eleventy billion css tweaks, part deux

pull/1/head
Andromeda Yelton 2011-12-15 10:28:23 -05:00
parent 901f5b4c22
commit 6e152acfe8
12 changed files with 153 additions and 30 deletions

View File

@ -20,13 +20,12 @@
<ul class="menu level2">
{% for ungluer in ungluers %}
<li class="first"><a href="{% url supporter supporter_username=ungluer %}">
<span class="ungluer-pic">
{% if ungluer.profile.pic_url %}
<img src="{{ungluer.profile.pic_url}}" height="30" width="30" alt="{{ungluer}}" title="{{ungluer}}" />
{% else %}
<img src="/static/images/header/avatar.png" height="30" width="30" alt="Generic Ungluer Avatar" />
{% endif %}
</span><span class="ungluer-name">{{ungluer}}</span>
<span class="ungluer-name">{{ungluer}}</span>
</a></li>
{% endfor %}
</ul>

View File

@ -66,6 +66,14 @@ how do I integrate the your wishlist thing with the tabs thing?
<span class="user-date">{{ date }}</span>
<span class="user-short-info">{{ supporter.profile.tagline }}</span>
</div>
<div class="user-block3">
<div class="ungluingtext">Ungluing:</div>
<div class="badges">
<span class="rounded"><span class="blue tabs1" {% ifequal request.user supporter %}title="I've unglued {{ backed }} {% if backed == 1 %}book{% else %}books{% endif %}."{% else %}title="{{ supporter }} has unglued {{ backed }} {% if backed == 1 %}book{% else %}books{% endif %}."{% endifequal %}>{{ backed }}</span></span>
<span class="rounded"><span class="orange tabs2" {% ifequal request.user supporter %}title="I'm supporting {{ backing }} {% if backing == 1 %}book{% else %}books{% endif %}."{% else %}title="{{ supporter }} is supporting {{ backing }} {% if backing == 1 %}book{% else %}books{% endif %}."{% endifequal %}>{{ backing }}</span></span>
<span class="rounded"><span class="grey tabs3" {% ifequal request.user supporter %}title="I'm wishing for {{ wished }} {% if wished == 1 %}book{% else %}books{% endif %}."{% else %}title="{{ supporter }} is wishing for {{ wished }} {% if wished == 1 %}book{% else %}books{% endif %}."{% endifequal %}>{{ wished }}</span></span>
</div>
</div>
<div class="user-block4">
<div class="social">
{% if supporter.profile.home_url %}
@ -95,14 +103,6 @@ how do I integrate the your wishlist thing with the tabs thing?
{% endif %}
</div>
</div>
<div class="user-block3">
<div class="user-block">
<span class="rounded"><span class="blue tabs1" {% ifequal request.user supporter %}title="I've unglued {{ backed }} {% if backed == 1 %}book{% else %}books{% endif %}."{% else %}title="{{ supporter }} has unglued {{ backed }} {% if backed == 1 %}book{% else %}books{% endif %}."{% endifequal %}>{{ backed }}</span></span>
<span class="rounded"><span class="orange tabs2" {% ifequal request.user supporter %}title="I'm supporting {{ backing }} {% if backing == 1 %}book{% else %}books{% endif %}."{% else %}title="{{ supporter }} is supporting {{ backing }} {% if backing == 1 %}book{% else %}books{% endif %}."{% endifequal %}>{{ backing }}</span></span>
<span class="rounded"><span class="grey tabs3" {% ifequal request.user supporter %}title="I'm wishing for {{ wished }} {% if wished == 1 %}book{% else %}books{% endif %}."{% else %}title="{{ supporter }} is wishing for {{ wished }} {% if wished == 1 %}book{% else %}books{% endif %}."{% endifequal %}>{{ wished }}</span></span>
</div>
<span class="user-status-title">I am ungluing</span>
</div>
</div>
{% ifequal supporter request.user %}
<div class="user-block-hide">

View File

@ -28,29 +28,32 @@ jQuery(document).ready(function(){
<div id="js-leftcol">
<div class="jsmodule rounded">
<div class="jsmod-content">
<span>
{% if work.last_campaign %}
{% if status == 'ACTIVE' %}
Campaign in Progress: <br />${{ work.last_campaign.current_total }}/${{ work.last_campaign.target }}
{% else %}{% if status == 'SUCCESSFUL' %}
Unglued on {{ work.last_campaign.deadline|date:"M j, Y"}}! <br />${{ work.last_campaign.current_total }} raised of ${{ work.last_campaign.target }} goal
{% else %}{% if status == 'INITIALIZED' %}
Campaign starting soon<br />&nbsp;
Campaign starting soon
{% else %}{% if status == 'SUSPENDED' %}
Campaign suspended. <br />See <a href="/faq">FAQ</a>.
{% else %}{% if status == 'WITHDRAWN' %}
Campaign withdrawn. <br />See <a href="/faq">FAQ</a>.
{% else %}{% if wishers == 1 %}
{{ wishers }} Ungluer is WISHING<br />&nbsp;
{{ wishers }} Ungluer is WISHING
{% else %}
{{ wishers }} Ungluers are WISHING<br />&nbsp;
{{ wishers }} Ungluers are WISHING
{% endif %}{% endif %}{% endif %}{% endif %}{% endif %}{% endif %}
{% else %}
{% if wishers == 1 %}
{{ wishers }} Ungluer is WISHING<br />&nbsp;
{{ wishers }} Ungluer is WISHING
{% else %}
{{ wishers }} Ungluers are WISHING<br />&nbsp;
{{ wishers }} Ungluers are WISHING
{% endif %}
{% endif %}
</span>
<span class="spacer">&nbsp;<br />&nbsp;</span>
</div>
</div>
{% include "explore.html" %}

View File

@ -81,9 +81,14 @@ div.book-list.listview div.create-account span {
font-weight: normal;
color: #3d4e53;
text-transform: none;
background: url("/static/images/booklist/add-wishlist.png") left center no-repeat;
padding-left: 20px;
}
div.book-list.listview div.add-wishlist span, div.book-list.listview div.create-account span {
background: url("/static/images/booklist/add-wishlist.png") left center no-repeat;
}
div.book-list.listview div > span.on-wishlist {
background: url("/static/images/checkmark_small.png") left center no-repeat;
}
div.book-list.listview div.booklist-status {
width: 110px;
margin-right: 7px;

View File

@ -13,6 +13,10 @@
border-style: solid none;
border-color: #FFFFFF;
}
.mediaborder {
padding: 5px;
border: solid 5px #EDF3F4;
}
#js-page-wrap {
overflow: hidden;
}
@ -34,6 +38,13 @@
border: none;
margin: 0;
}
#js-leftcol .jsmodule.rounded .jsmod-content span {
display: inline-block;
vertical-align: middle;
}
#js-leftcol .jsmodule.rounded .jsmod-content span.spacer {
visibility: none;
}
.book-detail {
float: left;
width: 100%;
@ -47,7 +58,7 @@
}
.book-detail-img img {
padding: 5px;
border: solid 5px #edf3f4;
border: solid 5px #EDF3F4;
}
.book-detail-info {
float: left;
@ -159,9 +170,10 @@ ul.tabs li a:hover, ul.tabs li.active a {
#js-rightcol {
float: right;
width: 235px;
margin-bottom: 20px;
}
#js-rightcol h3.jsmod-title {
background: #a7c1ca;
background: #3d4e53;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
border-radius: 10px 10px 10px 10px;
@ -170,6 +182,7 @@ ul.tabs li a:hover, ul.tabs li.active a {
font-style: normal;
font-size: 14px;
margin: 0 0 10px 0;
color: white;
}
#js-rightcol h3.jsmod-title span {
padding: 0;
@ -206,6 +219,10 @@ div.content-block-content {
.tabs-content {
padding-right: 5px;
}
.tabs-content iframe {
padding: 5px;
border: solid 5px #EDF3F4;
}
ul.social li {
padding: 5px 0 5px 30px;
height: 28px;
@ -230,7 +247,8 @@ ul.social li.email {
}
ul.support li {
border-bottom: 1px solid #d6dde0;
padding: 10px 15px 10px 0;
padding: 10px 0 10px 0;
margin-right: 15px;
}
ul.support li span {
display: block;
@ -238,6 +256,16 @@ ul.support li span {
ul.support li span.menu-item-price {
font-size: 18px;
}
ul.support li:hover {
background-color: #8dc63f;
color: #fff;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
border-radius: 10px 10px 10px 10px;
}
ul.support li:hover a {
color: #fff;
}
.work_supporter {
height: 50px;
margin-top: 5px;
@ -275,9 +303,17 @@ a {
font-weight: normal;
color: #3d4e53;
text-transform: none;
background: url("/static/images/booklist/add-wishlist.png") left center no-repeat;
padding-left: 20px;
}
.add-wishlist span.on-wishlist,
.remove-wishlist span.on-wishlist,
.on-wishlist span.on-wishlist,
.create-account span.on-wishlist {
background: url("/static/images/checkmark_small.png") left center no-repeat;
}
.add-wishlist span, .create-account span {
background: url("/static/images/booklist/add-wishlist.png") left center no-repeat;
}
.editions {
clear: both;
}

View File

@ -226,6 +226,13 @@ a.readon span {
#js-leftcol ul.level2 li a {
color: #6994a3;
}
#js-leftcol ul.level2 li img {
vertical-align: middle;
}
#js-leftcol ul.level2 li .ungluer-name {
height: 30px;
line-height: 30px;
}
/* Main content area: top */
#js-topsection {
padding: 15px 0;

View File

@ -49,9 +49,18 @@
width: 25%;
}
.user-block3, .user-block4 {
float: right;
float: left;
width: 25%;
margin-top: 10px;
}
.user-block3 {
margin-top: 8px;
}
.user-block3 .ungluingtext {
height: 29px;
line-height: 29px;
float: left;
color: #3d4e53;
padding-right: 5px;
}
img.user-avatar {
float: left;

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

View File

@ -70,11 +70,22 @@ div.book-list.listview{
font-weight:normal;
color:@text-blue;
text-transform: none;
background:url("@{image-base}booklist/add-wishlist.png") left center no-repeat;
padding-left:20px;
}
}
&.add-wishlist span, &.create-account span {
background:url("@{image-base}booklist/add-wishlist.png") left center no-repeat;
}
&.remove-wishlist span {
}
> span.on-wishlist {
background:url("@{image-base}checkmark_small.png") left center no-repeat;
}
&.booklist-status {
width: 110px;
margin-right:7px;

View File

@ -1,5 +1,10 @@
@import "variables.less";
.mediaborder {
padding: 5px;
border: solid 5px #EDF3F4;
}
#js-page-wrap {
overflow:hidden;
}
@ -20,6 +25,15 @@
font-weight:bold;
border:none;
margin:0;
span {
display: inline-block;
vertical-align: middle;
}
span.spacer {
visibility: none;
}
}
}
@ -38,8 +52,7 @@
width:151px;
img {
padding:5px;
border: solid 5px @pale-blue;
.mediaborder;
}
}
@ -171,15 +184,17 @@ ul.tabs {
#js-rightcol {
float:right;
width:235px;
margin-bottom: 20px;
h3.jsmod-title {
background:#a7c1ca;
background:@text-blue;
.border-radius(10px, 10px, 10px, 10px);
padding:10px;
height:auto;
font-style:normal;
font-size:14px;
margin:0 0 10px 0;
color: white;
span {
padding:0;
@ -221,6 +236,10 @@ div.content-block-content {
.tabs-content {
padding-right: 5px;
iframe {
.mediaborder;
}
}
ul.social li {
@ -249,7 +268,8 @@ ul.social li {
ul.support li {
border-bottom:1px solid @blue-grey;
padding:10px 15px 10px 0;
padding:10px 0 10px 0;
margin-right: 15px;
span {
display:block;
@ -258,6 +278,15 @@ ul.support li {
font-size:18px;
}
}
&:hover {
background-color: @green;
color: #fff;
.border-radius(10px, 10px, 10px, 10px);
a {
color: #fff;
}
}
}
.work_supporter {
@ -291,11 +320,18 @@ a{ color:#3d4e53; font-size:12px;}
font-weight:normal;
color:@text-blue;
text-transform: none;
background:url("@{image-base}booklist/add-wishlist.png") left center no-repeat;
padding-left:20px;
&.on-wishlist {
background:url("@{image-base}checkmark_small.png") left center no-repeat;
}
}
}
.add-wishlist span, .create-account span {
background:url("@{image-base}booklist/add-wishlist.png") left center no-repeat;
}
.editions {
clear: both;

View File

@ -238,6 +238,14 @@ a.readon {
&.level2 li {
.utilitylinks(5px, 10px);
img {
vertical-align: middle;
}
.ungluer-name {
.height(30px);
}
}
}
}

View File

@ -49,9 +49,18 @@
.user-block3,
.user-block4 {
float:right;
float:left;
width:25%;
margin-top:10px;
}
.user-block3 {
margin-top:8px;
.ungluingtext {
.height(29px);
float: left;
color: @text-blue;
padding-right: 5px;
}
}
img.user-avatar {