X-Git-Url: https://git.mdrn.pl/wolnelektury.git/blobdiff_plain/7cf1f5926f871122e6e240432531ae942c4f9df1..50f38b58c45dc9b68da614b3e26d45951088ec0c:/wolnelektury/static/css/book_box.css diff --git a/wolnelektury/static/css/book_box.css b/wolnelektury/static/css/book_box.css index 2faa1a2d8..17330083a 100755 --- a/wolnelektury/static/css/book_box.css +++ b/wolnelektury/static/css/book_box.css @@ -1,4 +1,4 @@ -.book-mini-box, .book-box { +.book-wide-box, .book-mini-box, .book-box { display: inline-block; margin: 0; vertical-align: top; @@ -6,11 +6,16 @@ .book-box { - width: 37.5em; + width: 48.75em; } .book-mini-box { - width: 12.5em; + width: 16.15em; +} + +.book-wide-box { + width: 98.5em; + margin-left: -0.1em; } .book-mini-box a, .book-box-inner { @@ -18,82 +23,202 @@ color: black; border: 1px solid #ddd; height: 20em; - padding: .75em; + padding: .8em 1em; margin: .1em; background: #fff; -moz-box-shadow: 2px 2px 2px #ddd; -webkit-box-shadow: 2px 2px 2px #ddd; box-shadow: 2px 2px 2px #ddd; - overflow: hidden; } .book-mini-box a { - height: 20em; + height: 27.1em; margin: .1em; + overflow: hidden; } .book-box-inner { - height: 14.4em; + height: 19.75em; margin: .5em; } -.book-mini-box img, .book-box img { - width: 10.8em; - height: 14.4em; +.book-wide-box .book-box-inner { + height: 24.4em; +} + +.book-mini-box img, .book-box img, .book-wide-box img { + width: 13.9em; + height: 19.3em; } .book-mini-box img { - margin-bottom: .3em; + margin-bottom: 1.8em; } -.book-box img { +.book-box img, .book-wide-box img { float: left; margin-right: 1.5em; } +.book-mini-box .desc { + margin-left:0em; +} .book-mini-box .author { + font-size: 1.1em; color: #777; + display: block; +} +.book-mini-box .title { + font-size: 1.4em; } .book-box-body { - height: 13em; + height: 17em; overflow: hidden; } + +.book-wide-box .book-box-body { + height: 21.8em; +} + .book-box-head { min-height: 7em; + margin-top: 1.4em; + margin-bottom: 1em; +} +.book-box-head .author { + font-size: 1.1em; +} +.book-box-head .title { + font-size: 2.4em; + margin-top: .3em; +} +.book-box-body .tags { + font-size: 1.1em; } .book-box-tag { - font-size: .8em; margin-right: .5em; + margin-left: .4em; } .book-box-download { position: relative; } + +.book-box-download a { + position: relative; + z-index: 1; +} + .book-box-formats { display: none; - top: -2em; position: absolute; - height: 2em; - width: 100em; + + width: 16.363em; + border: 1px solid #ddd; + padding: 3.454em 1.727em .818em 1.727em; + background: #fff; + -moz-box-shadow: 2px 2px 2px #ddd; + -webkit-box-shadow: 2px 2px 2px #ddd; + box-shadow: 2px 2px 2px #ddd; + + z-index: 0; + top: -1.454em; + left: -1.727em; +} +.book-box-formats span { + display: block; } -.book-box-formats a { - margin-right: 1em; + + +.book-box-download:hover .book-box-formats:first { + margin-top: 1.454em; } + .book-box-download:hover .book-box-formats { display: block; } -.book-box-tools a:before { - content: "⇩"; +.book-box-tools { + font-size: 1.1em; +} + +.book-wide-box .book-box-tools { + margin-left: 14em; +} + +.book-box-tools a.downarrow:before { + content: "\2609"; + font-family: WL-Nav; + font-size: 2.25em; + margin-right: .15em; + vertical-align: middle; +} + +.book-box-audiobook a:before { + content: "\266B"; font-family: WL-Nav; - font-size: 2em; - margin-right: .25em; + font-size: 2.25em; + margin-right: .15em; vertical-align: middle; } + +ul.book-box-tools { + margin: 0; + padding: 0; +} + +.book-box-tools li { + display: inline-block; +} + .book-box-read { - width: 10em; + width: 11.5em; } .book-box-download { - width: 6em; + width: 8.5em; } .book-box-audiobook { - width: 6em; + width: 7em; +} + +.book-wide-box .right-column { + float: right; + width: 41.5em; } + +.book-wide-box blockquote.cite-body { + /* @ 18pt */ + width: 100%; /*23.055em;*/ + height: 7.222em; + background-color: #f7f7f7; + margin: 0; + position: relative; + top: -0.444em; + right: -0.555em; + vertical-align: center; +} + +.book-wide-box blockquote div { + padding: 0.888em; +} + +ul.inline-items, ul.inline-items li { + margin: 0; + padding: 0; +} + +ul.inline-items li { + display: inline-block; +} + +.book-wide-box #other-tools { + float: left; + width: 14.5em; + margin: 6em 0 0 1.5em; + +} + +.book-wide-box #other-download { + float: left; + width: 22.5em; + margin: 6em 1.5em 0em 1.5em +} +