basic fragment choosing
[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 /*.book-wide-box.search-result .book-box-inner, .book-wide-box.search-result blockquote {
87     height: auto !important;
88 }*/
89
90 .book-mini-box img, .book-box img, .book-wide-box img, .search-result img {
91     width: 13.9em;
92     height: 19.3em;
93 }
94 .book-mini-box img {
95     margin-bottom: 1.8em;
96 }
97 .book-box-inner img, .book-wide-box img {
98     float: left;
99     margin-right: 1.5em;
100 }
101
102 .book-mini-box .desc {
103     margin-left:0em;
104 }
105 .book-mini-box .author {
106     font-size: 1.1em;
107     color: #707b7a;
108     display: block;
109 }
110 .book-mini-box .title {
111     font-size: 1.4em;
112     color: #242424;
113 }
114
115
116 .book-box-body {
117     height: 17em;
118     overflow: hidden;
119     position: relative;
120 }
121
122 .book-wide-box .book-box-body {
123     height: 21.8em;
124 }
125
126 .book-box-head {
127     min-height: 7em;
128     margin-top: 1.4em;
129     margin-bottom: 1em;
130 }
131 .book-box-head .author {
132     font-size: 1.1em;
133 }
134 .book-box-head .title {
135     font-size: 2.4em;
136     margin-top: .3em;
137 }
138 .book-box-body .tags {
139     font-size: 1.1em;
140 }
141 .book-box-tag {
142     margin-right: .5em;
143     margin-left: .4em;
144 }
145 .book-box-download {
146     position: relative;
147 }
148
149 .book-box-download a {
150     position: relative;
151     z-index: 1;
152 }
153
154 .book-box-formats {
155     display: none;
156     position: absolute;
157
158     width: 16.363em;
159     border: 1px solid #ddd;
160     padding: 3.454em 1.727em .818em 1.727em;
161     background: #fff;
162     -moz-box-shadow: 2px 2px 2px #ddd;
163     -webkit-box-shadow: 2px 2px 2px #ddd;
164     box-shadow: 2px 2px 2px #ddd;
165
166     z-index: 0;
167     top: -1.454em;
168     left: -1.727em;
169 }
170 .book-box-formats span {
171     display: block;
172 }
173  
174
175 .book-box-download:hover .book-box-formats span:first-child {
176     margin-top: 1.454em;
177 }
178
179 .book-box-download:hover .book-box-formats {
180     display: block;
181 }
182
183 .book-box-tools {
184     font-size: 1.1em;
185 }
186
187 .book-wide-box .book-box-tools {
188     margin-left: 14em;
189 }
190
191 .book-box-read a:before {
192     content: "\2609";
193     font-family: WL-Nav;
194     font-size: 2.25em;
195     margin-right: .15em;
196     vertical-align: middle;
197     font-weight: normal;
198 }
199
200 .book-box-download a:before {
201     content: "\21E9";
202     font-family: WL-Nav;
203     font-size: 2.25em;
204     margin-right: .15em;
205     vertical-align: middle;
206     font-weight: normal;
207 }
208
209 .book-box-audiobook a:before {
210     content: "\266B";
211     font-family: WL-Nav;
212     font-size: 2.25em;
213     margin-right: .15em;
214     vertical-align: middle;
215     font-weight: normal;
216 }
217
218 ul.book-box-tools {
219     margin: 0;
220     padding: 0;
221 }
222
223 .book-box-tools li {
224     display: inline-block;
225 }
226
227 .book-box-read {
228     width: 11.5em;
229 }
230 .book-box-download {
231     width: 8.5em;
232 }
233 .book-box-audiobook {
234     width: 7em;
235 }
236
237 .book-wide-box .right-column {
238     float: right;
239     width: 41.5em;
240 }
241
242 ul.inline-items, ul.inline-items li {
243     margin: 0;
244     padding: 0;
245 }
246
247 ul.inline-items li {
248     display: inline-block;
249 }
250
251 .book-wide-box .other-tools {
252     float: left;
253     width: 14.5em;
254     margin: 6em 0 0 1.5em;
255     
256 }
257
258 .book-wide-box .other-download {
259     float: left;
260     width: 22.5em;
261     margin: 6em 1.5em 0em 1.5em;
262 }
263
264
265 .star {
266     font-size: 2.25em;
267     margin-right: .5em;
268     position: absolute;
269     right: 0;
270 }
271 .star button::-moz-focus-inner {
272     padding: 0;
273     border: 0
274 }
275 .if-unlike button {
276     font-size: 1em;
277     font-family: inherit;
278     border: 0;
279     background: none;
280     margin: 0;
281     padding: 0;
282 }
283
284 .if-like a {
285     display:block;
286     text-align:right;
287     padding: 0;
288 }
289
290 .like .if-unlike {
291     display: none;
292 }
293
294 .unlike .if-like {
295     display: none;
296 }
297
298 .snippets {
299     width: 44em;
300     float: right;
301 }
302
303 .snippets .snippet-text {
304     font-size: 1.2em;
305     margin: 1.083em 0em;
306 }
307
308 .snippets .anchor {
309     display: none;
310 }
311
312
313 .cite blockquote p {
314     margin: 0;
315 }
316
317 .cite blockquote {
318     padding: 0;
319     margin: 0;
320 }
321
322 .book-wide-box .cite {
323     /* @ 18pt */
324     width: 100%; /*23.055em;*/
325     height: 7.222em;
326     background-color: #f7f7f7;
327     margin: 0;
328     position: relative;
329     top: -0.444em;
330     right: -0.555em;
331     vertical-align: center;
332 }
333
334 .abook-wide-box blockquote div.cite-text {
335     padding: 0.888em;
336 }
337
338 .abook-wide-box blockquote p.cite-more {
339     display: inline;
340     font-size: 0.611em;
341     float: right;
342 }