EbookFoundation
/
regluit
mirror of https://github.com/EbookFoundation/regluit.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

improving display of hover state of book panel (still in progress)

pull/1/head
Andromeda Yelton 2011-11-28 10:13:21 -05:00
parent 24f9122a85
commit 0e33932435
6 changed files with 86 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
core/tests.py
View File

@ -133,6 +133,8 @@ class TestBookLoader(TestCase):
w = edition.work
self.assertEqual(w.first_epub().url, "http://books.google.com/books/download/The_Latin_language.epub?id=U3FXAAAAYAAJ&ie=ISO-8859-1&output=epub&source=gbs_api")
self.assertEqual(w.first_pdf().url, "http://books.google.com/books/download/The_Latin_language.pdf?id=U3FXAAAAYAAJ&ie=ISO-8859-1&output=pdf&sig=ACfU3U2yLt3nmTncB8ozxOWUc4iHKUznCA&source=gbs_api")
self.assertEqual(w.first_epub_url(), "http://books.google.com/books/download/The_Latin_language.epub?id=U3FXAAAAYAAJ&ie=ISO-8859-1&output=epub&source=gbs_api")
self.assertEqual(w.first_pdf_url(), "http://books.google.com/books/download/The_Latin_language.pdf?id=U3FXAAAAYAAJ&ie=ISO-8859-1&output=pdf&sig=ACfU3U2yLt3nmTncB8ozxOWUc4iHKUznCA&source=gbs_api")
def test_add_no_ebook(self):
# this edition lacks an ebook, but we should still be able to load it

2
frontend/templates/book_panel.html
View File

@ -36,7 +36,7 @@
<div class="Unglue_itbutton"><a href="#">Unglue it!</a> </div>
{% endif %}
{% ifequal supporter request.user %}
<div class="moreinfo remove-wishlist"><a id="{{ work.id }}">Remove</a></div>
<div class="moreinfo remove-wishlist"><div><a id="{{ work.id }}">Remove</a></div></div>
{% else %}{% if work in shared_works %}
<div class="moreinfo on-wishlist">
<a href="#">On Your Wishlist!</a>

2
frontend/templates/supporter.html
View File

@ -9,7 +9,7 @@
<link type="text/css" rel="stylesheet" href="/static/css/book_panel.css" />
<script type="text/javascript" src="/static/js/wishlist.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="/static/js/jquery-1.6.3.min.js"></script>
<script type="text/javascript" src="/static/js/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="/static/js/greenpanel.js"></script>

3
frontend/templates/work.html
View File

@ -5,7 +5,7 @@
{% block extra_head %}
<link type="text/css" rel="stylesheet" href="/static/css/campaign.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="/static/js/jquery-1.6.3.min.js"></script>
<script type="text/javascript" src="/static/js/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="/static/js/tabs4.js"></script>
@ -27,7 +27,6 @@ $(document).ready(function(){
<div class="jsmod-content"> {{ work.last_campaign.id }} {{ work.campaigns.0.id }}
{% if work.last_campaign %}
{% with work.last_campaign_status as status %}
{{ work.last_campaign_status}}
{% if status == 'ACTIVE' %}
Campaign in Progress: <br />${{ work.last_campaign.current_total }}/${{ work.last_campaign.target }}
{% else %}{% if status == 'SUCCESSFUL' %}

106
static/css/book_panel.css
View File

@ -158,11 +158,12 @@ div.panelview.side2 > div {
padding: 10px;
height: 295px;
background-color: #8dc63f;
color: #ffffff;
color: #fff;
position: absolute;
top: -5px;
left: -10px;
}
/* Campaign status text at top of hover state */
.unglued_white {
font-size: 12px;
margin: 0px auto;
@ -170,6 +171,7 @@ div.panelview.side2 > div {
padding: 10px 0px;
height: 48px;
}
/* White-background action buttons; vary by state of campaign */
.read_itbutton {
width: 118px;
height: 35px;
@ -222,12 +224,43 @@ div.panelview.side2 > div {
.read_itbutton_fail span:hover {
text-decoration: none;
}
.Unglue_itbutton {
width: 118px;
height: 35px;
padding: 0px 0px;
background: #FFFFFF;
margin: 0px;
-moz-border-radius: 4px 4px 4px 4px;
-webkit-border-radius: 4px 4px 4px 4px;
border-radius: 4px 4px 4px 4px;
border: 1px solid #81bb38;
}
.Unglue_itbutton a {
background-image: url("/static/images/book-panel/unglue_icon.png");
line-height: 40px;
font-size: 11px;
background-repeat: no-repeat;
background-position: 10px center;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
padding: 0px 0px 0px 25px;
color: #73a334;
}
.Unglue_itbutton a:hover {
text-decoration: none;
}
.add_towish {
width: 130px;
width: 120px;
height: 30px;
padding: 0px;
margin: 15px 0 15px 0;
vertical-align: baseline;
border-top-width: 1px;
border-bottom-width: 1px;
border-top-style: solid;
border-bottom-style: solid;
border-top-color: #FFFFFF;
border-bottom-color: #FFFFFF;
background-image: url("/static/images/book-panel/add_wish_icon.png");
}
.add_towish a {
@ -238,19 +271,14 @@ div.panelview.side2 > div {
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
padding: 8px 5px 8px 21px;
color: #FFFFFF;
border-top-width: 1px;
border-bottom-width: 1px;
border-top-style: solid;
border-bottom-style: solid;
border-top-color: #FFFFFF;
border-bottom-color: #FFFFFF;
padding: 0 5px 0 21px;
color: #FFF;
}
.add_towish a:hover {
text-decoration: none;
color: #3d4e53;
}
/* title, author */
.white_text {
width: 130px;
height: 40px;
@ -266,16 +294,23 @@ div.panelview.side2 > div {
color: #3d4e53;
}
.white_text p {
/* necessary to ensure title/author don't overflow onto icons */
line-height: 16px;
max-height: 32px;
overflow: hidden;
}
.moreinfo {
width: 130px;
width: 120px;
height: 30px;
padding: 0px;
margin: 15px 0 0px 0;
vertical-align: baseline;
margin: 15px 0 0 0;
border-top-width: 1px;
border-bottom-width: 1px;
border-top-style: solid;
border-bottom-style: solid;
border-top-color: #FFFFFF;
border-bottom-color: #FFFFFF;
background-image: url("/static/images/book-panel/more_icon.png") no-repeat 10% center;
}
.moreinfo a {
@ -286,48 +321,19 @@ div.panelview.side2 > div {
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
padding: 8px 42px 8px 21px;
color: #FFFFFF;
border-top-width: 1px;
border-bottom-width: 1px;
border-top-style: solid;
border-bottom-style: solid;
border-top-color: #FFFFFF;
border-bottom-color: #FFFFFF;
padding: 0 0 0 21px;
color: #FFF;
}
.moreinfo a:hover {
text-decoration: none;
color: #3d4e53;
}
.moreinfo > div {
height: 30px;
line-height: 30px;
padding-bottom: 8px;
}
/* styling of hover state when book has not been unglued, and a bunch of stuff I haven't figured out yet */
.Unglue_itbutton {
width: 110px;
height: 40px;
padding: 0px 9px;
background: #FFFFFF;
margin: 0px 15px 0px -5px;
-moz-border-radius: 4px 4px 4px 4px;
-webkit-border-radius: 4px 4px 4px 4px;
border-radius: 4px 4px 4px 4px;
border: 1px solid #d4dcdd;
}
.Unglue_itbutton a {
line-height: 40px;
font-size: 11px;
background-repeat: no-repeat;
background-position: 2px center;
font-weight: bold;
text-decoration: none;
text-transform: uppercase;
background-image: url("/static/images/book-panel/unglue_icon.png");
padding: 5px 0px 0px 20px;
color: #3d4e53;
text-align: right;
font-family: "LucidaGrandeBold";
}
.Unglue_itbutton a:hover {
text-decoration: none;
}
.add_towish2 {
width: 130px;
height: 30px;

53
static/less/book_panel.less
View File

@ -39,7 +39,7 @@
background:#FFFFFF;
margin:0px;
.border-radius(4px, 4px, 4px, 4px);
border: 1px solid #81bb38;
border: 1px solid #81bb38;
}
.readit_inner (@padding) {
@ -53,17 +53,16 @@
}
.banners (@right, @bottom) {
width:130px;
width:120px;
height:30px;
padding:0px;
margin:15px 0 @bottom 0;
vertical-align: baseline;
.greenpanelactionborders;
a {
.greenpanelactionitems(left);
padding:8px @right 8px 21px;
color:#FFFFFF;
.greenpanelactionborders;
padding:0 @right 0 21px;
color:#FFF;
&:hover { .panelhoverlink;}
}
@ -200,11 +199,13 @@ div.panelview.side2 > div {
padding: 10px;
height: 295px;
background-color: @green;
color: #ffffff;
color: #fff;
position:absolute;
top:-5px;
left:-10px;
}
/* Campaign status text at top of hover state */
.unglued_white {
font-size: 12px;
margin: 0px auto;
@ -213,6 +214,7 @@ div.panelview.side2 > div {
height:48px;
}
/* White-background action buttons; vary by state of campaign */
.read_itbutton {
.readit;
a {
@ -230,6 +232,14 @@ div.panelview.side2 > div {
}
}
.Unglue_itbutton{
.readit;
a {
background-image: url("@{image-base}book-panel/unglue_icon.png");
.readit_inner(25px);
}
}
.add_towish {
.banners(5px, 15px);
@ -237,6 +247,7 @@ div.panelview.side2 > div {
}
/* title, author */
.white_text {
width:130px;
height:40px;
@ -251,6 +262,7 @@ div.panelview.side2 > div {
}
p {
/* necessary to ensure title/author don't overflow onto icons */
line-height:16px;
max-height:32px;
overflow: hidden;
@ -258,33 +270,18 @@ div.panelview.side2 > div {
}
.moreinfo {
.banners(42px, 0px);
.banners(0, 0);
background-image: url("@{image-base}book-panel/more_icon.png") no-repeat 10% center;
> div {
.height(30px);
padding-bottom:8px;
}
}
/* styling of hover state when book has not been unglued, and a bunch of stuff I haven't figured out yet */
.Unglue_itbutton{
width:110px;
height:40px;
padding:0px 9px;
background:#FFFFFF;
margin:0px 15px 0px -5px;
.border-radius(4px, 4px, 4px, 4px);
border: 1px solid #d4dcdd;
}
.Unglue_itbutton a{
.greenpanelactionitems(2px);
background-image: url("@{image-base}book-panel/unglue_icon.png");
padding:5px 0px 0px 20px;
color:@text-blue;
text-align:right;
font-family: "LucidaGrandeBold";
}
.Unglue_itbutton a:hover{
text-decoration:none;
}
.add_towish2{
width:130px;