pop up stats on hover instead of always showing them [ci skip]

This commit is contained in:
danielgrippi 2012-04-23 17:57:04 -07:00
parent 51a6a3c8a3
commit 8390756ddd
2 changed files with 28 additions and 17 deletions

View file

@ -50,6 +50,11 @@ body {
&:hover { &:hover {
@include box-shadow(0,1px,5px,rgba(0,0,0,0.5)); @include box-shadow(0,1px,5px,rgba(0,0,0,0.5));
.info {
bottom : 0;
}
cursor : pointer; cursor : pointer;
} }
@ -108,11 +113,19 @@ body {
} }
.info { .info {
@include opacity(0.3); @include transition(bottom);
@include opacity(0.8);
background-color : rgba(255,255,255,0.4);
position : absolute;
bottom : -30px;
right : 0;
text-align : center;
width : 100%;
padding : 5px; padding : 5px;
max-height : 10px; padding-right : 8px;
text-align : right;
i { i {
margin-left: 3px; margin-left: 3px;
} }
@ -191,9 +204,6 @@ body {
&.wallpaper { &.wallpaper {
.info {
}
.content{ .content{
display: table; display: table;
} }

View file

@ -24,16 +24,17 @@
</div> </div>
{{/if}} {{/if}}
<div class="text-content"> <div class="text-content">
{{{text}}} {{{text}}}
</div> </div>
{{#if text}} {{#if text}}
<div class="background-color"></div> <div class="background-color"></div>
{{/if}} {{/if}}
<div class="info">
<i class="icon-heart"></i> {{likes_count}}
<i class="icon-retweet"></i> {{reshares_count}}
<i class="icon-comment"></i> {{comments_count}}
</div>
</div> </div>
<div class="info">
<i class="icon-heart"></i> {{likes_count}}
<i class="icon-retweet"></i> {{reshares_count}}
<i class="icon-comment"></i> {{comments_count}}
</div>