regluit/static/css/book_list.css

327 lines
7.1 KiB
CSS
Executable File

/* variables and mixins used in multiple less files go here */
.header-text {
height: 36px;
line-height: 36px;
display: block;
text-decoration: none;
font-weight: bold;
letter-spacing: -0.05em;
}
.panelborders {
border-width: 1px 0px;
border-style: solid none;
border-color: #FFFFFF;
}
.roundedspan {
border: 1px solid #d4d4d4;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
border-radius: 7px;
padding: 1px;
color: #fff;
margin: 0 8px 0 0;
display: inline-block;
}
.roundedspan > span {
padding: 7px 7px;
min-width: 15px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
text-align: center;
display: inline-block;
}
.roundedspan > span .hovertext {
display: none;
}
.roundedspan > span:hover .hovertext {
display: inline;
}
.mediaborder {
padding: 5px;
border: solid 5px #EDF3F4;
}
.actionbuttons {
width: auto;
height: 36px;
line-height: 36px;
background: #8dc63f;
-moz-border-radius: 32px;
-webkit-border-radius: 32px;
border-radius: 32px;
color: white;
cursor: pointer;
font-size: 13px;
font-weight: bold;
padding: 0 15px;
border: none;
margin: 5px 0;
}
.errors {
-moz-border-radius: 16px 16px 0 0;
-webkit-border-radius: 16px 16px 0 0;
border-radius: 16px 16px 0 0;
border: solid #e35351 3px;
clear: both;
width: 90%;
height: auto;
line-height: 16px;
padding: 7px 0;
font-weight: bold;
font-size: 13px;
text-align: center;
}
.errors li {
list-style: none;
border: none;
}
/* Cross-browser language */
/* rows in listview should alternate colors */
.row1 .book-list.listview {
background: #f6f9f9;
}
.row2 .book-list.listview {
background: #fff;
}
div.book-list.listview {
clear: both;
display: block;
vertical-align: middle;
height: 43px;
line-height: 43px;
margin: 0 5px 0 0;
padding: 7px 0;
position: relative;
/* row is a container for divs with individual content elements */
/* these elements are styled differently to create list and panel views */
}
div.book-list.listview div.unglue-this {
float: left;
}
div.book-list.listview div.book-thumb {
margin-right: 5px;
float: left;
}
div.book-list.listview div.book-name {
width: 235px;
margin-right: 10px;
background: url("/static/images/booklist/booklist-vline.png") right center no-repeat;
float: left;
}
div.book-list.listview div.book-name .title {
display: block;
line-height: normal;
overflow: hidden;
height: 19px;
line-height: 19px;
margin-bottom: 5px;
font-weight: bold;
}
div.book-list.listview div.book-name .listview.author {
overflow: hidden;
display: block;
line-height: normal;
height: 19px;
line-height: 19px;
}
div.book-list.listview div.add-wishlist,
div.book-list.listview div.remove-wishlist,
div.book-list.listview div.on-wishlist,
div.book-list.listview div.create-account {
margin-right: 10px;
padding-right: 10px;
width: 136px;
background: url("/static/images/booklist/booklist-vline.png") right center no-repeat;
float: left;
}
div.book-list.listview div.add-wishlist span,
div.book-list.listview div.remove-wishlist span,
div.book-list.listview div.on-wishlist span,
div.book-list.listview div.create-account span {
font-weight: normal;
color: #3d4e53;
text-transform: none;
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.remove-wishlist span {
background: url("/static/images/booklist/remove-wishlist-blue.png") left center no-repeat;
}
div.book-list.listview div.on-wishlist > span,
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;
float: left;
}
div.add-wishlist,
div.remove-wishlist {
cursor: pointer;
}
.booklist-status.listview span.booklist-status-label {
display: none;
}
.booklist-status.listview span.booklist-status-text {
float: left;
display: block;
padding-right: 5px;
}
div.unglue-this a {
text-transform: uppercase;
color: #3d4e53;
font-size: 11px;
font-weight: bold;
}
div.unglue-this.complete .unglue-this-inner1 {
background: url("/static/images/booklist/bg.png") 0 -84px no-repeat;
height: 42px;
}
div.unglue-this.complete .unglue-this-inner2 {
background: url("/static/images/booklist/bg.png") 100% -126px no-repeat;
margin-left: 29px;
height: 42px;
padding-right: 10px;
}
div.unglue-this.complete a {
color: #fff;
display: block;
}
div.unglue-this.processing .unglue-this-inner1 {
background: url("/static/images/booklist/bg.png") 0 0 no-repeat;
height: 42px;
}
div.unglue-this.processing .unglue-this-inner2 {
background: url("/static/images/booklist/bg.png") 100% -42px no-repeat;
margin-left: 25px;
height: 42px;
padding-right: 10px;
}
ul.book-list-view {
padding: 0;
margin: 15px;
float: right;
list-style: none;
}
ul.book-list-view li {
float: left;
margin-right: 10px;
display: block;
vertical-align: middle;
line-height: 22px;
}
div.navigation {
float: left;
clear: both;
width: 100%;
color: #37414d;
}
ul.navigation {
float: right;
padding: 0;
margin: 0;
list-style: none;
}
ul.navigation li {
float: left;
line-height: normal;
margin-right: 5px;
}
ul.navigation li a {
color: #37414d;
font-weight: normal;
}
ul.navigation li.arrow-l a {
background: url("/static/images/booklist/bg.png") 0 -168px no-repeat;
width: 10px;
height: 15px;
display: block;
text-indent: -10000px;
}
ul.navigation li.arrow-r a {
background: url("/static/images/booklist/bg.png") -1px -185px no-repeat;
width: 10px;
height: 15px;
display: block;
text-indent: -10000px;
}
ul.navigation li a:hover,
ul.navigation li.active a {
color: #8ac3d7;
text-decoration: underline;
}
.unglue-button {
display: block;
border: 0;
}
.book-thumb.listview a {
display: block;
height: 50px;
width: 32px;
overflow: hidden;
position: relative;
z-index: 1;
}
.book-thumb.listview a:hover {
overflow: visible;
z-index: 1000;
border: none;
}
.book-thumb.listview a img {
position: absolute;
/* the excerpt you get looks cooler if you select from the middle, but
the popup version doesn't extend past the containing div's boundaries,
so the positioned part is cut off.
top:-20px;
left:-50px;
*/
}
.listview.icons {
position: absolute;
right: 31px;
}
.listview.icons .booklist-status-img {
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
background-color: #fff;
margin-top: 4px;
height: 37px;
}
.listview.icons .booklist-status-img img {
padding: 5px;
}
.listview.icons .booklist-status-label {
display: none;
}
div#content-block-content {
padding-bottom: 100px;
}
.listview.panelback,
.listview.panelback div {
display: none;
}
/* Starting state of toggle icons; will be overwritten by js in page */
#toggle-list {
filter: alpha(opacity=100);
-moz-opacity: 1;
-khtml-opacity: 1;
opacity: 1;
}
#toggle-panel {
filter: alpha(opacity=100);
-moz-opacity: 0.2;
-khtml-opacity: 0.2;
opacity: 0.2;
}
.nobold {
font-weight: normal;
}