aefb4550faed884a225dcf2d23782b6ce05eb096
[wolnelektury.git] / wolnelektury / static / css / book_box.css
1 .book-mini-box, .Book-item {
2     display: inline-block;
3     vertical-align: top;
4 }
5
6 .book-wide-box, .book-box {
7     margin: 0;
8     vertical-align: top;
9 }
10
11 .book-box {
12     width: 48.75em;
13 }
14
15 .book-mini-box {
16     width: 16.15em;
17 }
18
19 .book-wide-box {
20     width: 97.5em;
21
22     /** This is a fullpage box, it must be aligned with the top menu. 
23         This corresponds to a .1em margin below **/
24     margin-left: -0.1em;
25 }
26
27 /* 
28  * A mini-box wraps it's contents (image + label) in an <a>
29  * other boxes have an inner box as a wrapper.
30  */
31
32 .book-box-inner {
33     /* min, so it can grow */
34     min-height: 19.75em; 
35     margin: .5em;
36 }
37
38 .book-mini-box a, .book-box-inner {
39     display: block;
40     color: black;
41     border: 1px solid #ddd;
42 /*    height: 20em; */
43     padding: .8em 1em;
44     margin: .1em;
45     background: #fff;
46     -moz-box-shadow: 2px 2px 2px #ddd;
47     -webkit-box-shadow: 2px 2px 2px #ddd;
48     box-shadow: 2px 2px 2px #ddd;
49 }
50
51 .book-mini-box a {
52     height: 27.1em;
53     margin: .1em;
54     overflow: hidden;
55 }
56
57
58 .book-wide-box .book-box-inner {
59    /* min, so it can grow */ 
60    min-height: 24.4em;
61 }
62
63 .search-result {
64     width: 97.5em;
65 }
66
67 .search-result .book-box-body {
68     width: 31em;
69 }
70
71 .book-list-header {
72     width: 97.5em;
73     padding: 0em;
74     margin-left: -0.1em;
75 }
76
77 .book-list-header .book-box-inner {
78     min-height: 1em;
79 }
80
81 .book-list-header p {
82     font-size: 2.4em;
83     margin: 0.5em;
84 }
85
86
87 /* 
88  * ingenous float containment hack 
89  * http://www.mikepadgett.com/technology/technical/alternative-to-the-pie-clearfix-hack/
90  */
91 .search-result .book-box-inner {
92     height: 1%;
93     overflow: hidden;
94 }
95
96 .book-mini-box img, .book-box img, .book-wide-box img, .search-result img {
97     width: 13.9em;
98     height: 19.3em;
99 }
100 .book-mini-box img {
101     margin-bottom: 1.8em;
102 }
103 .book-box-inner img, .book-wide-box img {
104     float: left;
105     margin-right: 1.5em;
106 }
107
108 .book-mini-box .desc {
109     margin-left:0em;
110 }
111 .book-mini-box .author {
112     font-size: 1.1em;
113     color: #707b7a;
114     display: block;
115 }
116 .book-mini-box .title {
117     font-size: 1.4em;
118     color: #242424;
119 }
120
121
122 .book-box-body {
123     height: 17em;
124     overflow: hidden;
125     position: relative;
126 }
127
128 .book-wide-box .book-box-body {
129     height: 21.8em;
130 }
131
132 .book-box-head {
133     min-height: 7em;
134     margin-top: 1.4em;
135     margin-bottom: 1em;
136 }
137 .book-box-head .author {
138     font-size: 1.1em;
139 }
140 .book-box-head .title {
141     font-size: 2.4em;
142     margin-top: .3em;
143 }
144 .book-box-body .tags {
145     font-size: 1.1em;
146 }
147 .book-box-tag {
148     margin-right: .5em;
149     margin-left: .4em;
150 }
151 .book-box-download {
152     position: relative;
153 }
154
155 .book-box-download a {
156     position: relative;
157     z-index: 1;
158 }
159
160 .book-box-formats {
161     display: none;
162     position: absolute;
163
164     width: 16.363em;
165     border: 1px solid #ddd;
166     padding: 3.454em 1.727em .818em 1.727em;
167     background: #fff;
168     -moz-box-shadow: 2px 2px 2px #ddd;
169     -webkit-box-shadow: 2px 2px 2px #ddd;
170     box-shadow: 2px 2px 2px #ddd;
171
172     z-index: 0;
173     top: -1.454em;
174     left: -1.727em;
175 }
176 .book-box-formats span {
177     display: block;
178 }
179  
180
181 .book-box-download:hover .book-box-formats span:first-child {
182     margin-top: 1.454em;
183 }
184
185 .book-box-download:hover .book-box-formats {
186     display: block;
187 }
188
189 .book-box-tools {
190     font-size: 1.1em;
191 }
192
193 .book-wide-box .book-box-tools {
194     margin-left: 14em;
195 }
196
197 .book-box-read a:before {
198     content: "\2609";
199     font-family: WL-Nav;
200     font-size: 2.25em;
201     margin-right: .15em;
202     vertical-align: middle;
203     font-weight: normal;
204 }
205
206 .book-box-download a:before {
207     content: "\21E9";
208     font-family: WL-Nav;
209     font-size: 2.25em;
210     margin-right: .15em;
211     vertical-align: middle;
212     font-weight: normal;
213 }
214
215 .book-box-audiobook a:before {
216     content: "\266B";
217     font-family: WL-Nav;
218     font-size: 2.25em;
219     margin-right: .15em;
220     vertical-align: middle;
221     font-weight: normal;
222 }
223
224 ul.book-box-tools {
225     margin: 0;
226     padding: 0;
227 }
228
229 .book-box-tools li {
230     display: inline-block;
231 }
232
233 .book-box-read {
234     width: 11.5em;
235 }
236 .book-box-download {
237     width: 8.5em;
238 }
239 .book-box-audiobook {
240     width: 7em;
241 }
242
243 .book-wide-box .right-column {
244     float: right;
245     width: 41.5em;
246 }
247
248 ul.inline-items, ul.inline-items li {
249     margin: 0;
250     padding: 0;
251 }
252
253 ul.inline-items li {
254     display: inline-block;
255 }
256
257 .book-wide-box .other-tools {
258     float: left;
259     width: 14.5em;
260     margin: 6em 0 0 1.5em;
261     
262 }
263
264 .book-wide-box .other-download {
265     float: left;
266     width: 22.5em;
267     margin: 6em 1.5em 0em 1.5em;
268 }
269
270
271 .star {
272     font-size: 2.25em;
273     margin-right: .5em;
274     position: absolute;
275     right: 0;
276 }
277 .star button::-moz-focus-inner {
278     padding: 0;
279     border: 0
280 }
281 .if-unlike button {
282     font-size: 1em;
283     font-family: inherit;
284     border: 0;
285     background: none;
286     margin: 0;
287     padding: 0;
288 }
289
290 .if-like a {
291     display:block;
292     text-align:right;
293     padding: 0;
294 }
295
296 .like .if-unlike {
297     display: none;
298 }
299
300 .unlike .if-like {
301     display: none;
302 }
303
304 .snippets {
305     width: 44em;
306     float: right;
307 }
308
309 .snippets .snippet-text {
310     font-size: 1.2em;
311     margin: 1.083em 0em;
312 }
313
314 .snippets .anchor {
315     display: none;
316 }
317
318
319 .cite blockquote p {
320     margin: 0;
321 }
322
323 .cite blockquote {
324     padding: 0;
325     margin: 0;
326 }
327
328 .book-wide-box .cite {
329     /* @ 18pt */
330     width: 100%; /*23.055em;*/
331     height: 7.222em;
332     background-color: #f7f7f7;
333     margin: 0;
334     position: relative;
335     top: -0.444em;
336     right: -0.555em;
337     vertical-align: center;
338 }
339
340 .abook-wide-box blockquote div.cite-text {
341     padding: 0.888em;
342 }
343
344 .abook-wide-box blockquote p.cite-more {
345     display: inline;
346     font-size: 0.611em;
347     float: right;
348 }