fmartingr
/
shelfzilla
Archived
1
0
Fork 0

Volume Badges WIP

This commit is contained in:
Felipe Martin 2014-03-28 23:47:53 +01:00
parent e2a6f2ec08
commit c5c0a94395
2 changed files with 61 additions and 4 deletions

View File

@ -12,3 +12,35 @@
* > p:last-child {
margin-bottom: 0 !important;
}
.volume-item {
&:not(.user-have-it) {
.badges { display: none; }
&:hover .badges {
display: block;
}
}
&
.badges {
position: absolute;
right: 10px;
top: -10px;
.badge {
@size: 34px;
border: #FFF 3px solid;
border-radius: 50%;
display: block;
font-size: @size/1.5;
height: @size;
line-height: (@size)-3px;
padding: 0;
text-align: center;
width: @size;
}
}
}

View File

@ -44,14 +44,39 @@
<div class="row">
{% for volume in item.volumes.all %}
<div class="col-sm-3">
<div class="well text-center">
<div class="well text-center volume-item user-have-it">
<div class="badges">
<span class="badge badge-success">
<i class="glyphicon glyphicon-ok"></i>
</span>
<span class="badge badge-warning">
<i class="glyphicon glyphicon-star"></i>
</span>
</div>
<div class="text-center">
<div><strong>{% trans "Volume" %} {{ volume.number }}</strong></div>
<img src="{% thumbnail volume.cover 150x150 %}" class="max-width-80" />
<button class="btn btn-primary btn-xs">{% trans "Details" %}</button>
</div>
</div>
</div>
{% endfor %}
{% for volume in item.volumes.all %}
<div class="col-sm-3">
<div class="well text-center volume-item">
<div class="badges">
<span class="badge">
<i class="glyphicon glyphicon-ok"></i>
</span>
<span class="badge">
<i class="glyphicon glyphicon-star"></i>
</span>
</div>
<div class="text-center">
<div><strong>{% trans "Volume" %} {{ volume.number }}</strong></div>
<img src="{% thumbnail volume.cover 150x150 %}" class="max-width-80" />
<button class="btn btn-primary btn-xs">{% trans "Details" %}</button>
</div>
<br />
<button class="btn btn-primary btn-xs">{% trans "I have it!" %}</button>
<button class="btn btn-warning btn-xs">{% trans "I want it!" %}</button>
</div>
</div>
{% endfor %}