Add book side bar
parent
72ed2c2804
commit
6924640596
|
@ -23,6 +23,7 @@
|
|||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
{% with work.id as work_id %}
|
||||
<div class="wrapper">
|
||||
<div class="bookImage">
|
||||
{% if work.uses_google_cover %}
|
||||
|
@ -74,17 +75,50 @@
|
|||
</div>
|
||||
<div class="bookSidebar">
|
||||
<div>
|
||||
Favorite
|
||||
<div class="btn_wishlist" id="wishlist_actions">
|
||||
{% if request.user.is_anonymous %}
|
||||
<div class="create-account">
|
||||
<span title="{% url 'work' work_id %}">Login to Fave</span>
|
||||
</div>
|
||||
{% elif request.user.id in work.last_campaign.supporters %}
|
||||
<div class="add-wishlist">
|
||||
<span class="on-wishlist">Faved!</span>
|
||||
</div>
|
||||
{% elif work in request.user.wishlist.works.all %}
|
||||
<div class="remove-wishlist-workpage">
|
||||
<span id="w{{ work_id }}">Remove from My Faves</span>
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="add-wishlist">
|
||||
<span class="work_id" id="w{{ work_id }}">Add to My Faves</span>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
GoodReads
|
||||
<a rel="nofollow" class="find-goodreads" href="{% url 'work_goodreads' work_id %}"><img src="/static/images/supporter_icons/goodreads_square.png" title="Find on GoodReads" alt="Find on GoodReads" /></a>
|
||||
<span>GoodReads</span>
|
||||
</div>
|
||||
<div>
|
||||
LibraryThing
|
||||
<a rel="nofollow" class="find-librarything" href="{% url 'work_librarything' work_id %}"><img src="/static/images/supporter_icons/librarything_square.png" title="Find on LibraryThing" alt="Find on LibraryThing" /></a>
|
||||
<span>LibraryThing</span>
|
||||
</div>
|
||||
<div class="bookDownload">
|
||||
<button>Download</button>
|
||||
</div>
|
||||
<div class="bookDonate">
|
||||
<button>Donate</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bookComments">
|
||||
<h2>Comments</h2>
|
||||
{% render_comment_list for work %}
|
||||
{% if user.is_authenticated %}
|
||||
{% render_comment_form for work %}
|
||||
{% else %}
|
||||
<p>You must be <a href="{% url 'superlogin' %}?next={{ request.get_full_path|urlencode }}">logged in</a> to comment.</p>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endwith %}
|
||||
{% endblock %}
|
||||
|
|
|
@ -13,7 +13,7 @@
|
|||
float: left;
|
||||
margin-right:10px;
|
||||
width:151px;
|
||||
|
||||
|
||||
img {
|
||||
.mediaborder;
|
||||
}
|
||||
|
@ -47,7 +47,7 @@
|
|||
font-weight:normal;
|
||||
color:@link-color;
|
||||
}
|
||||
|
||||
|
||||
> div {
|
||||
width:100%;
|
||||
clear:both;
|
||||
|
@ -56,50 +56,46 @@
|
|||
border-top:1px solid @pale-blue;
|
||||
padding:10px 0;
|
||||
}
|
||||
|
||||
|
||||
> div.layout {
|
||||
border: none;
|
||||
padding: 0;
|
||||
|
||||
|
||||
div.pubinfo {
|
||||
float: left;
|
||||
width: auto;
|
||||
padding-bottom: 7px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn_wishlist span {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
|
||||
.find-book label {
|
||||
float:left;
|
||||
line-height:31px;
|
||||
}
|
||||
|
||||
|
||||
.find-link {
|
||||
float:right;
|
||||
|
||||
|
||||
img {
|
||||
padding: 2px;
|
||||
.one-border-radius(5px);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.pledged-info {
|
||||
padding:10px 0;
|
||||
position: relative;
|
||||
|
||||
|
||||
&.noborder {
|
||||
border-top: none;
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
|
||||
.campaign-status-info {
|
||||
float: left;
|
||||
width: 50%;
|
||||
margin-top: @font-size-default;
|
||||
|
||||
|
||||
span {
|
||||
font-size: @font-size-larger;
|
||||
color: @medium-blue;
|
||||
|
@ -107,7 +103,7 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.thermometer {
|
||||
.one-border-radius(10px);
|
||||
border: solid 2px @blue-grey;
|
||||
|
@ -118,22 +114,22 @@
|
|||
|
||||
/* looks better if we start the gradient a little closer to the success color */
|
||||
@greener-than-alert: #CF6944;
|
||||
|
||||
|
||||
background: -webkit-gradient(linear, left top, right top, from(@call-to-action), to(@greener-than-alert));
|
||||
background: -webkit-linear-gradient(left, @greener-than-alert, @call-to-action);
|
||||
background: -moz-linear-gradient(left, @greener-than-alert, @call-to-action);
|
||||
background: -ms-linear-gradient(left, @greener-than-alert, @call-to-action);
|
||||
background: -o-linear-gradient(left, @greener-than-alert, @call-to-action);
|
||||
background: linear-gradient(left, @greener-than-alert, @call-to-action);
|
||||
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@alert', endColorstr='@call-to-action'); /* IE6 & IE7 */
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='@alert', endColorstr='@call-to-action')"; /* IE8+ */
|
||||
|
||||
|
||||
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@alert', endColorstr='@call-to-action'); /* IE6 & IE7 */
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='@alert', endColorstr='@call-to-action')"; /* IE8+ */
|
||||
|
||||
&.successful {
|
||||
border-color: @bright-blue;
|
||||
background: @pale-blue;
|
||||
}
|
||||
|
||||
|
||||
.cover {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
|
@ -143,11 +139,11 @@
|
|||
margin-top: -7px;
|
||||
background: lighten(@blue-grey, 10%);
|
||||
}
|
||||
|
||||
|
||||
span {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
&:hover span {
|
||||
display: block;
|
||||
position: absolute;
|
||||
|
@ -166,7 +162,7 @@
|
|||
span.explanation{
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
&:hover span.explanation {
|
||||
display: block;
|
||||
position: absolute;
|
||||
|
@ -181,7 +177,7 @@
|
|||
.one-border-radius(10px);
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
.status {
|
||||
position: absolute;
|
||||
|
@ -190,5 +186,5 @@
|
|||
height: 25px;
|
||||
margin-top: -12px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -24,7 +24,7 @@
|
|||
border:none;
|
||||
margin:0;
|
||||
line-height: 16px;
|
||||
|
||||
|
||||
/* Bubble in upper left looks different depending on campaign status */
|
||||
&.ACTIVE {
|
||||
background: @green;
|
||||
|
@ -33,7 +33,7 @@
|
|||
font-weight: normal;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
|
||||
&.No.campaign.yet {
|
||||
background: @orange;
|
||||
color: white;
|
||||
|
@ -42,15 +42,15 @@
|
|||
span {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
|
||||
|
||||
&.spacer {
|
||||
visibility: none;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
&.findtheungluers {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -60,7 +60,7 @@
|
|||
}
|
||||
|
||||
#js-slide .jsmodule {
|
||||
width: 660px !important;
|
||||
width: 660px !important;
|
||||
}
|
||||
|
||||
#js-search {
|
||||
|
@ -74,14 +74,14 @@
|
|||
text-align: left;
|
||||
font-weight: normal;
|
||||
font-size: @font-size-default;
|
||||
|
||||
|
||||
> li {
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
.errorlist {
|
||||
margin-top: 7px;
|
||||
|
||||
margin-top: 7px;
|
||||
|
||||
li {
|
||||
width: auto;
|
||||
height: auto;
|
||||
|
@ -98,7 +98,7 @@
|
|||
width:470px;
|
||||
margin:0 10px;
|
||||
|
||||
div#content-block {
|
||||
div#content-block {
|
||||
background: none;
|
||||
padding:0;
|
||||
}
|
||||
|
@ -113,13 +113,13 @@
|
|||
.add-wishlist, .add-wishlist-workpage, &.remove-wishlist-workpage, .remove-wishlist, &.on-wishlist, &.create-account {
|
||||
float: right;
|
||||
cursor: pointer;
|
||||
|
||||
|
||||
span {
|
||||
font-weight:normal;
|
||||
color:@text-blue;
|
||||
text-transform: none;
|
||||
padding-left:20px;
|
||||
|
||||
|
||||
&.on-wishlist {
|
||||
background:url("@{image-base}checkmark_small.png") left center no-repeat;
|
||||
cursor: default;
|
||||
|
@ -138,15 +138,15 @@
|
|||
/* Center - tabs and content below them */
|
||||
div#content-block-content {
|
||||
padding-left: 5px;
|
||||
|
||||
|
||||
a {
|
||||
color: @medium-blue;
|
||||
}
|
||||
|
||||
|
||||
#tabs-1 img {
|
||||
.mediaborder;
|
||||
}
|
||||
|
||||
|
||||
#tabs-3 {
|
||||
margin-left: -5px;
|
||||
}
|
||||
|
@ -154,15 +154,15 @@ div#content-block-content {
|
|||
|
||||
.tabs-content {
|
||||
padding-right: 5px;
|
||||
|
||||
|
||||
iframe {
|
||||
.mediaborder;
|
||||
}
|
||||
|
||||
|
||||
form {
|
||||
margin-left: -5px;
|
||||
}
|
||||
|
||||
|
||||
.clearfix {
|
||||
margin-bottom: 10px;
|
||||
border-bottom: 2px solid @blue-grey;
|
||||
|
@ -179,12 +179,12 @@ div#content-block-content {
|
|||
.work_supporter_avatar {
|
||||
float: left;
|
||||
margin-right: 5px;
|
||||
|
||||
|
||||
img {
|
||||
.one-border-radius(5px);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.work_supporter_name {
|
||||
.height(50px);
|
||||
float: left;
|
||||
|
@ -197,13 +197,13 @@ div#content-block-content {
|
|||
min-width: 235px;
|
||||
float: left;
|
||||
}
|
||||
.show_supporter_contact_form
|
||||
.show_supporter_contact_form
|
||||
{
|
||||
display:block;
|
||||
margin-left: 5px;
|
||||
float: right;
|
||||
}
|
||||
.supporter_contact_form
|
||||
.supporter_contact_form
|
||||
{
|
||||
display:none;
|
||||
margin-left: 5px;
|
||||
|
@ -243,24 +243,24 @@ div#content-block-content {
|
|||
margin-left: -5px;
|
||||
}
|
||||
|
||||
.editions {
|
||||
.editions {
|
||||
div {
|
||||
float:left;
|
||||
padding-bottom: 5px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
|
||||
.image {
|
||||
width: 60px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.metadata {
|
||||
|
||||
.metadata {
|
||||
display:block;
|
||||
overflow: hidden;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
@ -273,7 +273,7 @@ div#content-block-content {
|
|||
|
||||
.show_more_edition {
|
||||
text-align: right;
|
||||
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
@ -283,7 +283,7 @@ div#content-block-content {
|
|||
display:none;
|
||||
clear: both;
|
||||
padding-bottom: 10px;
|
||||
padding-left: 60px;
|
||||
padding-left: 60px;
|
||||
}
|
||||
|
||||
.more_ebooks {
|
||||
|
@ -300,7 +300,7 @@ div#content-block-content {
|
|||
.add-wishlist, .on-wishlist, .create-account {
|
||||
float: none;
|
||||
}
|
||||
|
||||
|
||||
.on-wishlist {
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
@ -310,7 +310,7 @@ div#content-block-content {
|
|||
float:right;
|
||||
width:235px;
|
||||
margin-bottom: 20px;
|
||||
|
||||
|
||||
h3.jsmod-title {
|
||||
background:@medium-blue-grey;
|
||||
.one-border-radius(10px);
|
||||
|
@ -320,7 +320,7 @@ div#content-block-content {
|
|||
font-size: @font-size-larger;
|
||||
margin:0 0 10px 0;
|
||||
color: white;
|
||||
|
||||
|
||||
span {
|
||||
padding:0;
|
||||
color:#fff;
|
||||
|
@ -331,11 +331,11 @@ div#content-block-content {
|
|||
|
||||
.jsmodule {
|
||||
margin-bottom:10px;
|
||||
|
||||
|
||||
a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#pledge-rightcol {
|
||||
|
@ -346,7 +346,7 @@ div#content-block-content {
|
|||
border:1px solid @blue-grey;
|
||||
.one-border-radius(10px);
|
||||
padding:10px;
|
||||
}
|
||||
}
|
||||
|
||||
#widgetcode {
|
||||
display: none;
|
||||
|
@ -366,18 +366,18 @@ ul.support li {
|
|||
&.last {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
|
||||
span {
|
||||
display:block;
|
||||
padding-right:10px;
|
||||
|
||||
&.menu-item-price {
|
||||
&.menu-item-price {
|
||||
font-size: @font-size-header;
|
||||
float: left;
|
||||
display: inline;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
|
||||
|
||||
&.menu-item-desc {
|
||||
float: none;
|
||||
clear: both;
|
||||
|
@ -386,7 +386,7 @@ ul.support li {
|
|||
line-height: @font-size-larger*1.3;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
&:hover {
|
||||
color: #fff;
|
||||
background:@call-to-action url("@{image-base}icons/pledgearrow-hover.png") 98% center no-repeat;
|
||||
|
@ -417,7 +417,7 @@ ul.support li {
|
|||
margin: 20px auto;
|
||||
}
|
||||
|
||||
div#libtools {
|
||||
div#libtools {
|
||||
border:1px solid @blue-grey;
|
||||
.one-border-radius(10px);
|
||||
padding:10px;
|
||||
|
@ -436,4 +436,4 @@ div#libtools {
|
|||
input[type="submit"]{
|
||||
margin-left: 4em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -32,3 +32,11 @@
|
|||
grid-column: 1/4;
|
||||
grid-row: 2;
|
||||
}
|
||||
|
||||
.btn_wishlist span{
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.btn_wishlist div{
|
||||
float: none;
|
||||
}
|
||||
|
|
|
@ -1,3 +1,3 @@
|
|||
* {
|
||||
color: red ;
|
||||
}
|
||||
// color: red ;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue