Commit e8bddcc7 authored by Frédéric Bolvin's avatar Frédéric Bolvin

add a card footer in gallery containing meta data and link to single post view

parent baeff224
......@@ -22,6 +22,7 @@
@import 'vendor/autoSuggest';
@import 'typeahead';
@import 'colors';
@import 'card-footer';
/* font overrides */
@import 'typography';
......
.card-footer {
background-color: $background-grey;
border-top: 1px solid $border-medium-grey;
bottom: 0;
font-size: $font-size-small;
left: 0;
line-height: $line-height-computed;
margin-left: 0;
min-height: $line-height-computed + 1;
position: absolute;
width: 100%;
.footer-container {
padding: 1px 5px;
a {
color: $text-grey;
font-weight: normal;
margin-right: 4px;
}
}
}
// gallery-picture specific styles for card-footer
.media {
.gallery-picture img { margin-bottom: $line-height-computed + 2; }
.card-footer .footer-container { font-size: $font-size-base; }
}
......@@ -14,6 +14,7 @@ $light-grey: #ddd;
$border-grey: $light-grey;
$border-dark-grey: $text-grey;
$border-medium-grey: #ccc;
$link-grey: #777;
$link-disabled-grey: $text-grey;
......
......@@ -26,11 +26,14 @@
$image_width: 80px; /* including margin */
& > h4, & > div {
> h4,
> div:not(.card-footer) {
margin-left: $image_width;
}
& > h4, & > div, .hashtags {
> h4,
> div,
.hashtags {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
......@@ -64,32 +67,6 @@
}
.btn-group.aspect_membership_dropdown { margin: 0 !important; }
.hovercard_footer {
position: absolute;
bottom: 0;
left: 0;
background-color: $background-grey;
margin-left: 0;
width: 100%;
min-height: 19px;
font-size: 10px;
line-height: 18px;
border-top: 1px solid #cccccc;
.footer_container {
padding: 1px 5px;
a {
color: $text-grey;
margin-right: 4px;
font-weight: normal;
}
}
}
}
#hovercard_container {
......
.media { margin: 10px; }
.media {
margin: 10px;
position: relative;
}
.media,
.bd {
......@@ -10,8 +13,8 @@
.media .img {
float: left;
margin-right: 10px;
img { display: block; }
}
.media .img img { display: block }
.media .imgEt { float: right; margin-left: 10px; }
......@@ -7,8 +7,8 @@
</h4>
<div class="handle"></div>
<div id="hovercard_dropdown_container"></div>
<div class="hovercard_footer">
<div class="footer_container">
<div class="card-footer">
<div class="footer-container">
<div class="hashtags"></div>
</div>
</div>
......
......@@ -26,4 +26,15 @@
</a>
</div>
</div>
<div class="card-footer">
<div class="footer-container">
{{#if status_message}}
<a href="{{urlTo "post" status_message.id}}">
<time class="timeago" data-original-title="{{{localTime created_at}}}" datetime="{{created_at}}" />
</a>
{{else}}
<time class="timeago" data-original-title="{{{localTime created_at}}}" datetime="{{created_at}}" />
{{/if}}
</div>
</div>
</div>
......@@ -15,14 +15,23 @@ class Photo < ActiveRecord::Base
t.add :created_at
t.add :author
t.add lambda { |photo|
{ :small => photo.url(:thumb_small),
:medium => photo.url(:thumb_medium),
:large => photo.url(:scaled_full) }
{
small: photo.url(:thumb_small),
medium: photo.url(:thumb_medium),
large: photo.url(:scaled_full)
}
}, :as => :sizes
t.add lambda { |photo|
{ :height => photo.height,
:width => photo.width }
}, :as => :dimensions
{
height: photo.height,
width: photo.width
}
}, as: :dimensions
t.add lambda { |photo|
{
id: photo.status_message.id
} if photo.status_message
}, as: :status_message
end
mount_uploader :processed_image, ProcessedImage
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment