diff options
Diffstat (limited to 'app/Resources/static/themes/baggy/css')
-rwxr-xr-x | app/Resources/static/themes/baggy/css/font.css | 6 | ||||
-rwxr-xr-x | app/Resources/static/themes/baggy/css/main.css | 1282 | ||||
-rwxr-xr-x | app/Resources/static/themes/baggy/css/messages.css | 19 | ||||
-rwxr-xr-x | app/Resources/static/themes/baggy/css/print.css | 66 | ||||
-rw-r--r-- | app/Resources/static/themes/baggy/css/ratatouille.css | 224 |
5 files changed, 1597 insertions, 0 deletions
diff --git a/app/Resources/static/themes/baggy/css/font.css b/app/Resources/static/themes/baggy/css/font.css new file mode 100755 index 00000000..cae7904a --- /dev/null +++ b/app/Resources/static/themes/baggy/css/font.css | |||
@@ -0,0 +1,6 @@ | |||
1 | @font-face { | ||
2 | font-family: "PT Sans"; | ||
3 | font-style: normal; | ||
4 | font-weight: 700; | ||
5 | src: local("PT Sans Bold"), local("PTSans-Bold"), url("../fonts/pt_sans/regular/PTS55F.woff") format("woff"); | ||
6 | } | ||
diff --git a/app/Resources/static/themes/baggy/css/main.css b/app/Resources/static/themes/baggy/css/main.css new file mode 100755 index 00000000..7ffaa12c --- /dev/null +++ b/app/Resources/static/themes/baggy/css/main.css | |||
@@ -0,0 +1,1282 @@ | |||
1 | /* ========================================================================== | ||
2 | Sommaire | ||
3 | |||
4 | 1 = Style Guide | ||
5 | 2 = Layout | ||
6 | 3 = Pictos | ||
7 | 4 = Messages | ||
8 | 5 = Article | ||
9 | 6 = Media queries | ||
10 | |||
11 | ========================================================================== */ | ||
12 | |||
13 | html { | ||
14 | min-height: 100%; | ||
15 | } | ||
16 | |||
17 | body { | ||
18 | background-color: #eee; | ||
19 | } | ||
20 | |||
21 | .login { | ||
22 | background-color: #333; | ||
23 | } | ||
24 | |||
25 | .login #main { | ||
26 | padding: 0; | ||
27 | margin: 0; | ||
28 | } | ||
29 | |||
30 | .login form { | ||
31 | background-color: #fff; | ||
32 | padding: 1.5em; | ||
33 | box-shadow: 0 1px 8px rgba(0, 0, 0, 0.9); | ||
34 | width: 20em; | ||
35 | position: absolute; | ||
36 | top: 8em; | ||
37 | left: 50%; | ||
38 | margin-left: -10em; | ||
39 | } | ||
40 | |||
41 | .login .logo { | ||
42 | position: absolute; | ||
43 | top: 2em; | ||
44 | left: 50%; | ||
45 | margin-left: -55px; | ||
46 | } | ||
47 | |||
48 | /* ========================================================================== | ||
49 | 1 = Style Guide | ||
50 | ========================================================================== */ | ||
51 | |||
52 | ::selection { | ||
53 | color: #fff; | ||
54 | background-color: #000; | ||
55 | } | ||
56 | |||
57 | .desktopHide { | ||
58 | display: none; | ||
59 | } | ||
60 | |||
61 | .logo { | ||
62 | position: fixed; | ||
63 | z-index: 20; | ||
64 | top: 0.4em; | ||
65 | left: 0.6em; | ||
66 | } | ||
67 | |||
68 | h2, | ||
69 | h3, | ||
70 | h4 { | ||
71 | font-family: "PT Sans", sans-serif; | ||
72 | text-transform: uppercase; | ||
73 | } | ||
74 | |||
75 | p, | ||
76 | li, | ||
77 | label { | ||
78 | color: #666; | ||
79 | } | ||
80 | |||
81 | a { | ||
82 | color: #000; | ||
83 | font-weight: bold; | ||
84 | } | ||
85 | |||
86 | a.nostyle { | ||
87 | text-decoration: none; | ||
88 | } | ||
89 | |||
90 | a:hover, | ||
91 | a:focus { | ||
92 | text-decoration: none; | ||
93 | } | ||
94 | |||
95 | form fieldset { | ||
96 | border: 0; | ||
97 | padding: 0; | ||
98 | margin: 0; | ||
99 | } | ||
100 | |||
101 | form input[type="text"], | ||
102 | form input[type="number"], | ||
103 | select, | ||
104 | form input[type="password"], | ||
105 | form input[type="url"], | ||
106 | form input[type="email"] { | ||
107 | border: 1px solid #999; | ||
108 | padding: 0.5em 1em; | ||
109 | min-width: 12em; | ||
110 | color: #666; | ||
111 | } | ||
112 | |||
113 | @media screen and (-webkit-min-device-pixel-ratio: 0) { | ||
114 | select { | ||
115 | -webkit-appearance: none; | ||
116 | border-radius: 0; | ||
117 | background: #fff url("../../_global/img/bg-select.png") no-repeat right center; | ||
118 | } | ||
119 | } | ||
120 | |||
121 | .inline .row { | ||
122 | display: inline-block; | ||
123 | margin-right: 0.5em; | ||
124 | } | ||
125 | |||
126 | .inline label { | ||
127 | min-width: 6em; | ||
128 | } | ||
129 | |||
130 | fieldset label { | ||
131 | display: inline-block; | ||
132 | min-width: 12.5em; | ||
133 | color: #666; | ||
134 | } | ||
135 | |||
136 | label { | ||
137 | margin-right: 0.5em; | ||
138 | } | ||
139 | |||
140 | form .row { | ||
141 | margin-bottom: 0.5em; | ||
142 | } | ||
143 | |||
144 | form button, | ||
145 | input[type="submit"] { | ||
146 | cursor: pointer; | ||
147 | background-color: #000; | ||
148 | color: #fff; | ||
149 | padding: 0.5em 1em; | ||
150 | display: inline-block; | ||
151 | border: 1px solid #000; | ||
152 | } | ||
153 | |||
154 | form button:hover, | ||
155 | form button:focus, | ||
156 | input[type="submit"]:hover, | ||
157 | input[type="submit"]:focus { | ||
158 | background-color: #fff; | ||
159 | color: #000; | ||
160 | -webkit-transition: all 0.5s ease; | ||
161 | -moz-transition: all 0.5s ease; | ||
162 | -ms-transition: all 0.5s ease; | ||
163 | -o-transition: all 0.5s ease; | ||
164 | transition: all 0.5s ease; | ||
165 | } | ||
166 | |||
167 | #bookmarklet { | ||
168 | cursor: move; | ||
169 | } | ||
170 | |||
171 | h2::after { | ||
172 | content: ""; | ||
173 | height: 4px; | ||
174 | width: 70px; | ||
175 | background-color: #000; | ||
176 | display: block; | ||
177 | } | ||
178 | |||
179 | .links { | ||
180 | padding: 0; | ||
181 | margin: 0; | ||
182 | } | ||
183 | |||
184 | .links li { | ||
185 | list-style: none; | ||
186 | margin: 0; | ||
187 | padding: 0; | ||
188 | } | ||
189 | |||
190 | #links { | ||
191 | position: fixed; | ||
192 | top: 0; | ||
193 | width: 10em; | ||
194 | left: 0; | ||
195 | text-align: right; | ||
196 | background-color: #333; | ||
197 | padding-top: 9.5em; | ||
198 | height: 100%; | ||
199 | box-shadow: inset -4px 0 20px rgba(0, 0, 0, 0.6); | ||
200 | z-index: 15; | ||
201 | } | ||
202 | |||
203 | #main { | ||
204 | margin-left: 12em; | ||
205 | position: relative; | ||
206 | z-index: 10; | ||
207 | padding-right: 5%; | ||
208 | padding-bottom: 1em; | ||
209 | } | ||
210 | |||
211 | #links > li > a { | ||
212 | display: block; | ||
213 | padding: 0.5em 2em 0.5em 1em; | ||
214 | color: #fff; | ||
215 | position: relative; | ||
216 | text-transform: uppercase; | ||
217 | text-decoration: none; | ||
218 | font-weight: normal; | ||
219 | font-family: "PT Sans", sans-serif; | ||
220 | -webkit-transition: all 0.5s ease; | ||
221 | -moz-transition: all 0.5s ease; | ||
222 | -ms-transition: all 0.5s ease; | ||
223 | -o-transition: all 0.5s ease; | ||
224 | transition: all 0.5s ease; | ||
225 | } | ||
226 | |||
227 | #links > li > a:hover, | ||
228 | #links > li > a:focus { | ||
229 | background-color: #999; | ||
230 | color: #000; | ||
231 | } | ||
232 | |||
233 | #links .current::after { | ||
234 | content: ""; | ||
235 | width: 0; | ||
236 | height: 0; | ||
237 | position: absolute; | ||
238 | border-style: solid; | ||
239 | border-width: 10px; | ||
240 | border-color: transparent #eee transparent transparent; | ||
241 | right: 0; | ||
242 | top: 50%; | ||
243 | margin-top: -10px; | ||
244 | } | ||
245 | |||
246 | #links li:last-child { | ||
247 | position: fixed; | ||
248 | bottom: 1em; | ||
249 | width: 10em; | ||
250 | } | ||
251 | |||
252 | #links li:last-child a::before { | ||
253 | font-size: 1.2em; | ||
254 | position: relative; | ||
255 | top: 2px; | ||
256 | } | ||
257 | |||
258 | #sort { | ||
259 | padding: 0; | ||
260 | list-style-type: none; | ||
261 | opacity: 0.5; | ||
262 | display: inline-block; | ||
263 | } | ||
264 | |||
265 | #sort li { | ||
266 | display: inline; | ||
267 | font-size: 0.9em; | ||
268 | } | ||
269 | |||
270 | #sort li + li { | ||
271 | margin-left: 10px; | ||
272 | } | ||
273 | |||
274 | #sort a { | ||
275 | padding: 2px 2px 0; | ||
276 | vertical-align: middle; | ||
277 | } | ||
278 | |||
279 | #sort img { | ||
280 | vertical-align: baseline; | ||
281 | } | ||
282 | |||
283 | #sort img:hover { | ||
284 | cursor: pointer; | ||
285 | } | ||
286 | |||
287 | #display-mode { | ||
288 | float: right; | ||
289 | margin-top: 10px; | ||
290 | margin-bottom: 10px; | ||
291 | opacity: 0.5; | ||
292 | } | ||
293 | |||
294 | #listmode { | ||
295 | width: 16px; | ||
296 | display: inline-block; | ||
297 | text-decoration: none; | ||
298 | } | ||
299 | |||
300 | #listmode a:hover { | ||
301 | opacity: 1; | ||
302 | } | ||
303 | |||
304 | #listmode.tablemode { | ||
305 | background-image: url("../img/baggy/table.png"); | ||
306 | background-repeat: no-repeat; | ||
307 | background-position: bottom; | ||
308 | } | ||
309 | |||
310 | #listmode.listmode { | ||
311 | background-image: url("../img/baggy/list.png"); | ||
312 | background-repeat: no-repeat; | ||
313 | background-position: bottom; | ||
314 | } | ||
315 | |||
316 | #warning_message { | ||
317 | position: fixed; | ||
318 | background-color: #ff6347; | ||
319 | z-index: 1000; | ||
320 | bottom: 0; | ||
321 | left: 0; | ||
322 | width: 100%; | ||
323 | color: #000; | ||
324 | } | ||
325 | |||
326 | /* ========================================================================== | ||
327 | 2 = Layout | ||
328 | ========================================================================== */ | ||
329 | |||
330 | #content { | ||
331 | margin-top: 2em; | ||
332 | min-height: 30em; | ||
333 | } | ||
334 | |||
335 | footer { | ||
336 | text-align: right; | ||
337 | position: relative; | ||
338 | bottom: 0; | ||
339 | right: 5em; | ||
340 | color: #999; | ||
341 | font-size: 0.8em; | ||
342 | font-style: italic; | ||
343 | z-index: 20; | ||
344 | } | ||
345 | |||
346 | footer a { | ||
347 | color: #999; | ||
348 | font-weight: normal; | ||
349 | } | ||
350 | |||
351 | .list-entries { | ||
352 | letter-spacing: -5px; | ||
353 | } | ||
354 | |||
355 | .listmode .entry { | ||
356 | width: 100% !important; | ||
357 | margin-left: 0 !important; | ||
358 | } | ||
359 | |||
360 | .card-entry-labels { | ||
361 | position: absolute; | ||
362 | top: 100px; | ||
363 | left: -1em; | ||
364 | z-index: 90; | ||
365 | max-width: 50%; | ||
366 | padding-left: 0; | ||
367 | } | ||
368 | |||
369 | .card-entry-labels li { | ||
370 | margin: 10px 10px 10px auto; | ||
371 | padding: 5px 12px 5px 25px; | ||
372 | background-color: rgba(0, 0, 0, 0.6); | ||
373 | border-radius: 0 3px 3px 0; | ||
374 | color: #fff; | ||
375 | cursor: default; | ||
376 | max-height: 2em; | ||
377 | overflow: hidden; | ||
378 | text-overflow: ellipsis; | ||
379 | white-space: nowrap; | ||
380 | } | ||
381 | |||
382 | .card-entry-tags { | ||
383 | max-height: 2em; | ||
384 | overflow-y: hidden; | ||
385 | padding: 0; | ||
386 | } | ||
387 | |||
388 | .card-entry-tags li { | ||
389 | display: inline-block; | ||
390 | margin: 0 5px; | ||
391 | padding: 5px 12px; | ||
392 | background-color: rgba(0, 0, 0, 0.6); | ||
393 | border-radius: 3px; | ||
394 | max-height: 2em; | ||
395 | overflow: hidden; | ||
396 | text-overflow: ellipsis; | ||
397 | color: #fff; | ||
398 | } | ||
399 | |||
400 | .list-entries + .results { | ||
401 | margin-bottom: 2em; | ||
402 | } | ||
403 | |||
404 | .estimatedTime .reading-time { | ||
405 | color: #999; | ||
406 | font-style: italic; | ||
407 | font-weight: normal; | ||
408 | font-size: 0.9em; | ||
409 | } | ||
410 | |||
411 | .estimatedTime small { | ||
412 | position: relative; | ||
413 | top: -1px; | ||
414 | } | ||
415 | |||
416 | .entry { | ||
417 | background-color: #fff; | ||
418 | letter-spacing: normal; | ||
419 | box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); | ||
420 | display: inline-block; | ||
421 | width: 32%; | ||
422 | margin-bottom: 1.5em; | ||
423 | vertical-align: top; | ||
424 | margin-right: 1%; | ||
425 | position: relative; | ||
426 | overflow: hidden; | ||
427 | padding: 1.5em 1.5em 3em; | ||
428 | height: 440px; | ||
429 | } | ||
430 | |||
431 | .entry::before { | ||
432 | content: ""; | ||
433 | width: 0; | ||
434 | height: 0; | ||
435 | border-style: solid; | ||
436 | border-color: transparent transparent #000; | ||
437 | border-width: 10px; | ||
438 | position: absolute; | ||
439 | bottom: 0.3em; | ||
440 | z-index: 10; | ||
441 | right: 1.5em; | ||
442 | -webkit-transition: all 0.5s ease; | ||
443 | -moz-transition: all 0.5s ease; | ||
444 | -ms-transition: all 0.5s ease; | ||
445 | -o-transition: all 0.5s ease; | ||
446 | transition: all 0.5s ease; | ||
447 | } | ||
448 | |||
449 | .entry::after { | ||
450 | content: ""; | ||
451 | position: absolute; | ||
452 | height: 7px; | ||
453 | width: 100%; | ||
454 | bottom: 0; | ||
455 | left: 0; | ||
456 | background-color: #000; | ||
457 | -webkit-transition: all 0.5s ease; | ||
458 | -moz-transition: all 0.5s ease; | ||
459 | -ms-transition: all 0.5s ease; | ||
460 | -o-transition: all 0.5s ease; | ||
461 | transition: all 0.5s ease; | ||
462 | } | ||
463 | |||
464 | .entry:hover { | ||
465 | box-shadow: 0 3px 10px rgba(0, 0, 0, 1); | ||
466 | } | ||
467 | |||
468 | .entry:hover::after { | ||
469 | height: 40px; | ||
470 | } | ||
471 | |||
472 | .entry:hover::before { | ||
473 | bottom: 2.4em; | ||
474 | } | ||
475 | |||
476 | .entry:hover h2 a { | ||
477 | color: #666; | ||
478 | } | ||
479 | |||
480 | .entry h2 { | ||
481 | text-transform: none; | ||
482 | margin-bottom: 0; | ||
483 | line-height: 1.2; | ||
484 | text-align: justify; | ||
485 | -moz-text-align-last: center; | ||
486 | text-align-last: center; | ||
487 | } | ||
488 | |||
489 | .entry h2::after { | ||
490 | content: none; | ||
491 | } | ||
492 | |||
493 | .entry h2 a { | ||
494 | display: block; | ||
495 | text-decoration: none; | ||
496 | color: #000; | ||
497 | word-wrap: break-word; | ||
498 | -webkit-transition: all 0.5s ease; | ||
499 | -moz-transition: all 0.5s ease; | ||
500 | -ms-transition: all 0.5s ease; | ||
501 | -o-transition: all 0.5s ease; | ||
502 | transition: all 0.5s ease; | ||
503 | } | ||
504 | |||
505 | img.preview { | ||
506 | max-width: calc(100% + 3em); | ||
507 | left: -1.5em; | ||
508 | position: relative; | ||
509 | } | ||
510 | |||
511 | .entry p { | ||
512 | color: #666; | ||
513 | font-size: 0.9em; | ||
514 | line-height: 1.7; | ||
515 | } | ||
516 | |||
517 | .entry h2 a::first-letter { | ||
518 | text-transform: uppercase; | ||
519 | } | ||
520 | |||
521 | .entry:hover .tools { | ||
522 | bottom: 0; | ||
523 | } | ||
524 | |||
525 | .entry .tools { | ||
526 | position: absolute; | ||
527 | bottom: -50px; | ||
528 | left: 0; | ||
529 | width: 100%; | ||
530 | z-index: 10; | ||
531 | padding-right: 0.5em; | ||
532 | text-align: right; | ||
533 | -webkit-transition: all 0.5s ease; | ||
534 | -moz-transition: all 0.5s ease; | ||
535 | -ms-transition: all 0.5s ease; | ||
536 | -o-transition: all 0.5s ease; | ||
537 | transition: all 0.5s ease; | ||
538 | } | ||
539 | |||
540 | .entry .tools a { | ||
541 | color: #666; | ||
542 | text-decoration: none; | ||
543 | display: block; | ||
544 | padding: 0.4em; | ||
545 | } | ||
546 | |||
547 | .entry .tools a:hover { | ||
548 | color: #fff; | ||
549 | } | ||
550 | |||
551 | .entry .tools li { | ||
552 | display: inline-block; | ||
553 | } | ||
554 | |||
555 | .entry:nth-child(3n+1) { | ||
556 | margin-left: 0; | ||
557 | } | ||
558 | |||
559 | .results { | ||
560 | letter-spacing: -5px; | ||
561 | padding: 0 0 0.5em; | ||
562 | } | ||
563 | |||
564 | .results > * { | ||
565 | display: inline-block; | ||
566 | vertical-align: top; | ||
567 | letter-spacing: normal; | ||
568 | width: 50%; | ||
569 | text-align: right; | ||
570 | } | ||
571 | |||
572 | div.pagination ul { | ||
573 | text-align: right; | ||
574 | margin-bottom: 50px; | ||
575 | } | ||
576 | |||
577 | .nb-results { | ||
578 | text-align: left; | ||
579 | font-style: italic; | ||
580 | color: #999; | ||
581 | } | ||
582 | |||
583 | div.pagination ul > * { | ||
584 | display: inline-block; | ||
585 | margin-left: 0.5em; | ||
586 | } | ||
587 | |||
588 | div.pagination ul a { | ||
589 | color: #999; | ||
590 | text-decoration: none; | ||
591 | } | ||
592 | |||
593 | div.pagination ul a:hover, | ||
594 | div.pagination ul a:focus { | ||
595 | text-decoration: underline; | ||
596 | } | ||
597 | |||
598 | div.pagination ul .prev.disabled, | ||
599 | div.pagination ul .next.disabled { | ||
600 | display: none; | ||
601 | } | ||
602 | |||
603 | div.pagination ul .current { | ||
604 | height: 25px; | ||
605 | padding: 4px 8px; | ||
606 | border: 1px solid #d5d5d5; | ||
607 | text-decoration: none; | ||
608 | font-weight: bold; | ||
609 | color: #000; | ||
610 | background-color: #ccc; | ||
611 | } | ||
612 | |||
613 | /* ========================================================================== | ||
614 | 2.1 = "save a link" related styles | ||
615 | ========================================================================== */ | ||
616 | |||
617 | .popup-form { | ||
618 | background: rgba(0, 0, 0, 0.5); | ||
619 | position: absolute; | ||
620 | top: 0; | ||
621 | left: 10em; | ||
622 | z-index: 20; | ||
623 | height: 100%; | ||
624 | width: 100%; | ||
625 | margin: 0; | ||
626 | margin-top: -30% !important; | ||
627 | padding: 2em; | ||
628 | display: none; | ||
629 | border-left: 1px #eee solid; | ||
630 | } | ||
631 | |||
632 | .popup-form form { | ||
633 | background-color: #fff; | ||
634 | position: absolute; | ||
635 | top: 0; | ||
636 | left: 0; | ||
637 | z-index: 20; | ||
638 | border: 10px solid #000; | ||
639 | width: 400px; | ||
640 | height: 200px; | ||
641 | padding: 2em; | ||
642 | } | ||
643 | |||
644 | #bagit-form-form .addurl { | ||
645 | margin-left: 0; | ||
646 | } | ||
647 | |||
648 | .closeMessage, | ||
649 | .close-button { | ||
650 | background-color: #000; | ||
651 | color: #fff; | ||
652 | font-size: 1.2em; | ||
653 | line-height: 1.6; | ||
654 | width: 1.6em; | ||
655 | height: 1.6em; | ||
656 | text-align: center; | ||
657 | text-decoration: none; | ||
658 | } | ||
659 | |||
660 | .closeMessage:hover, | ||
661 | .closeMessage:focus, | ||
662 | .close-button:hover, | ||
663 | .close-button:focus { | ||
664 | background-color: #999; | ||
665 | color: #000; | ||
666 | } | ||
667 | |||
668 | .close-button--popup { | ||
669 | display: inline-block; | ||
670 | position: absolute; | ||
671 | top: 0; | ||
672 | right: 0; | ||
673 | font-size: 1.4em; | ||
674 | } | ||
675 | |||
676 | .active-current { | ||
677 | background-color: #999; | ||
678 | } | ||
679 | |||
680 | .active-current::after { | ||
681 | content: ""; | ||
682 | width: 0; | ||
683 | height: 0; | ||
684 | position: absolute; | ||
685 | border-style: solid; | ||
686 | border-width: 10px; | ||
687 | border-color: transparent #eee transparent transparent; | ||
688 | right: 0; | ||
689 | top: 50%; | ||
690 | margin-top: -10px; | ||
691 | } | ||
692 | |||
693 | .opacity03 { | ||
694 | opacity: 0.3; | ||
695 | } | ||
696 | |||
697 | .add-to-wallabag-link-after { | ||
698 | background-color: #000; | ||
699 | color: #fff; | ||
700 | padding: 0 3px 2px; | ||
701 | } | ||
702 | |||
703 | a.add-to-wallabag-link-after { | ||
704 | visibility: hidden; | ||
705 | position: absolute; | ||
706 | opacity: 0; | ||
707 | transition-duration: 2s; | ||
708 | transition-timing-function: ease-out; | ||
709 | } | ||
710 | |||
711 | #article article a:hover + a.add-to-wallabag-link-after, | ||
712 | a.add-to-wallabag-link-after:hover { | ||
713 | opacity: 1; | ||
714 | visibility: visible; | ||
715 | transition-duration: 0.3s; | ||
716 | transition-timing-function: ease-in; | ||
717 | } | ||
718 | |||
719 | a.add-to-wallabag-link-after::after { | ||
720 | content: "w"; | ||
721 | } | ||
722 | |||
723 | #add-link-result { | ||
724 | font-weight: bold; | ||
725 | font-size: 0.9em; | ||
726 | } | ||
727 | |||
728 | .btn-clickable { | ||
729 | cursor: pointer; | ||
730 | } | ||
731 | |||
732 | /* ========================================================================== | ||
733 | 3 = Pictos | ||
734 | ========================================================================== */ | ||
735 | |||
736 | @font-face { | ||
737 | font-family: icomoon; | ||
738 | src: url("../fonts/icomoon.eot?-s0mcsx"); | ||
739 | src: | ||
740 | url("../fonts/icomoon.eot?#iefix-s0mcsx") format("embedded-opentype"), | ||
741 | url("../fonts/icomoon.woff?-s0mcsx") format("woff"), | ||
742 | url("../fonts/icomoon.ttf?-s0mcsx") format("truetype"), | ||
743 | url("../fonts/icomoon.svg?-s0mcsx#icomoon") format("svg"); | ||
744 | font-weight: normal; | ||
745 | font-style: normal; | ||
746 | } | ||
747 | |||
748 | @font-face { | ||
749 | font-family: 'Material Icons'; | ||
750 | font-style: normal; | ||
751 | font-weight: 400; | ||
752 | src: url(../fonts/MaterialIcons-Regular.eot); | ||
753 | |||
754 | /* For IE6-8 */ | ||
755 | src: local("Material Icons"), local("MaterialIcons-Regular"), url(../fonts/MaterialIcons-Regular.woff2) format("woff2"), url(../fonts/MaterialIcons-Regular.woff) format("woff"), url(../fonts/MaterialIcons-Regular.ttf) format("truetype"); | ||
756 | } | ||
757 | |||
758 | .material-icons { | ||
759 | font-family: 'Material Icons'; | ||
760 | font-weight: normal; | ||
761 | font-style: normal; | ||
762 | font-size: 1em; /* Preferred icon size */ | ||
763 | width: 1em; | ||
764 | height: 1em; | ||
765 | display: inline-block; | ||
766 | line-height: 1; | ||
767 | text-transform: none; | ||
768 | letter-spacing: normal; | ||
769 | word-wrap: normal; | ||
770 | white-space: nowrap; | ||
771 | direction: ltr; | ||
772 | |||
773 | /* Support for all WebKit browsers. */ | ||
774 | -webkit-font-smoothing: antialiased; | ||
775 | |||
776 | /* Support for Safari and Chrome. */ | ||
777 | text-rendering: optimizeLegibility; | ||
778 | |||
779 | /* Support for Firefox. */ | ||
780 | -moz-osx-font-smoothing: grayscale; | ||
781 | |||
782 | /* Support for IE. */ | ||
783 | font-feature-settings: 'liga'; | ||
784 | } | ||
785 | |||
786 | .material-icons.md-18 { font-size: 18px; } | ||
787 | .material-icons.md-24 { font-size: 24px; } | ||
788 | .material-icons.md-36 { font-size: 36px; } | ||
789 | .material-icons.md-48 { font-size: 48px; } | ||
790 | |||
791 | .icon span, | ||
792 | .icon-image span { | ||
793 | position: absolute; | ||
794 | top: -9999px; | ||
795 | } | ||
796 | |||
797 | [class^="icon-"]::before, | ||
798 | [class*=" icon-"]::before { | ||
799 | font-family: icomoon; | ||
800 | speak: none; | ||
801 | font-style: normal; | ||
802 | font-weight: normal; | ||
803 | font-variant: normal; | ||
804 | text-transform: none; | ||
805 | line-height: 1; | ||
806 | |||
807 | /* Better Font Rendering =========== */ | ||
808 | -webkit-font-smoothing: antialiased; | ||
809 | -moz-osx-font-smoothing: grayscale; | ||
810 | } | ||
811 | |||
812 | .icon-flattr::before { | ||
813 | content: "\ead4"; | ||
814 | } | ||
815 | |||
816 | .icon-mail::before { | ||
817 | content: "\ea86"; | ||
818 | } | ||
819 | |||
820 | .icon-up-open::before { | ||
821 | content: "\e80b"; | ||
822 | } | ||
823 | |||
824 | .icon-star::before { | ||
825 | content: "\e9d9"; | ||
826 | } | ||
827 | |||
828 | .icon-check::before { | ||
829 | content: "\ea10"; | ||
830 | } | ||
831 | |||
832 | .icon-link::before { | ||
833 | content: "\e9cb"; | ||
834 | } | ||
835 | |||
836 | .icon-reply::before { | ||
837 | content: "\e806"; | ||
838 | } | ||
839 | |||
840 | .icon-menu::before { | ||
841 | content: "\e9bd"; | ||
842 | } | ||
843 | |||
844 | .icon-clock::before { | ||
845 | content: "\e803"; | ||
846 | } | ||
847 | |||
848 | .icon-twitter::before { | ||
849 | content: "\ea91"; | ||
850 | } | ||
851 | |||
852 | .icon-down-open::before { | ||
853 | content: "\e809"; | ||
854 | } | ||
855 | |||
856 | .icon-trash::before { | ||
857 | content: "\e9ac"; | ||
858 | } | ||
859 | |||
860 | .icon-delete::before { | ||
861 | content: "\ea0d"; | ||
862 | } | ||
863 | |||
864 | .icon-power::before { | ||
865 | content: "\ea14"; | ||
866 | } | ||
867 | |||
868 | .icon-arrow-up-thick::before { | ||
869 | content: "\ea3a"; | ||
870 | } | ||
871 | |||
872 | .icon-rss::before { | ||
873 | content: "\e808"; | ||
874 | } | ||
875 | |||
876 | .icon-print::before { | ||
877 | content: "\e954"; | ||
878 | } | ||
879 | |||
880 | .icon-reload::before { | ||
881 | content: "\ea2e"; | ||
882 | } | ||
883 | |||
884 | .icon-price-tags::before { | ||
885 | content: "\e936"; | ||
886 | } | ||
887 | |||
888 | /* .icon-image class, for image-based icons | ||
889 | ========================================================================== */ | ||
890 | |||
891 | .icon-image { | ||
892 | background-size: 16px 16px; | ||
893 | background-repeat: no-repeat; | ||
894 | background-position: center; | ||
895 | padding-right: 1em !important; | ||
896 | padding-left: 1em !important; | ||
897 | } | ||
898 | |||
899 | /* Carrot (http://carrot.org) */ | ||
900 | .icon-image--carrot { | ||
901 | background-image: url("../../_global/img/icons/carrot-icon--white.png"); | ||
902 | } | ||
903 | |||
904 | /* Diaspora */ | ||
905 | .icon-image--diaspora { | ||
906 | background-image: url("../../_global/img/icons/diaspora-icon--black.png"); | ||
907 | } | ||
908 | |||
909 | /* ========================================================================== | ||
910 | Icon selected | ||
911 | ========================================================================== */ | ||
912 | |||
913 | .icon-star.fav::before { | ||
914 | color: #fff; | ||
915 | } | ||
916 | |||
917 | .icon-check.archive::before { | ||
918 | color: #fff; | ||
919 | } | ||
920 | |||
921 | /* ========================================================================== | ||
922 | 4 = Messages | ||
923 | ========================================================================== */ | ||
924 | |||
925 | .messages { | ||
926 | text-align: left; | ||
927 | margin-top: 1em; | ||
928 | } | ||
929 | |||
930 | .messages > * { | ||
931 | display: inline-block; | ||
932 | } | ||
933 | |||
934 | .warning { | ||
935 | font-weight: bold; | ||
936 | display: block; | ||
937 | width: 100%; | ||
938 | } | ||
939 | |||
940 | .more-info { | ||
941 | font-size: 0.85em; | ||
942 | line-height: 1.5; | ||
943 | color: #aaa; | ||
944 | } | ||
945 | |||
946 | .more-info a { | ||
947 | color: #aaa; | ||
948 | } | ||
949 | |||
950 | /* ========================================================================== | ||
951 | 5 = Article | ||
952 | ========================================================================== */ | ||
953 | |||
954 | #article { | ||
955 | width: 70%; | ||
956 | margin-bottom: 3em; | ||
957 | text-align: justify; | ||
958 | } | ||
959 | |||
960 | #article .tags { | ||
961 | margin-bottom: 1em; | ||
962 | } | ||
963 | |||
964 | #article i { | ||
965 | font-style: normal; | ||
966 | } | ||
967 | |||
968 | blockquote { | ||
969 | border: 1px solid #999; | ||
970 | background-color: #fff; | ||
971 | padding: 1em; | ||
972 | margin: 0; | ||
973 | } | ||
974 | |||
975 | #article h1 { | ||
976 | text-align: left; | ||
977 | } | ||
978 | |||
979 | #article h2, | ||
980 | #article h3, | ||
981 | #article h4 { | ||
982 | text-transform: none; | ||
983 | } | ||
984 | |||
985 | #article h2::after { | ||
986 | content: none; | ||
987 | } | ||
988 | |||
989 | .topPosF { | ||
990 | position: fixed; | ||
991 | right: 20%; | ||
992 | bottom: 2em; | ||
993 | font-size: 1.5em; | ||
994 | } | ||
995 | |||
996 | #article_toolbar { | ||
997 | margin-bottom: 1em; | ||
998 | } | ||
999 | |||
1000 | #article_toolbar li { | ||
1001 | display: inline-block; | ||
1002 | } | ||
1003 | |||
1004 | #article_toolbar a { | ||
1005 | background-color: #000; | ||
1006 | padding: 0.3em 0.5em 0.2em; | ||
1007 | color: #fff; | ||
1008 | text-decoration: none; | ||
1009 | } | ||
1010 | |||
1011 | #article_toolbar a:hover, | ||
1012 | #article_toolbar a:focus { | ||
1013 | background-color: #999; | ||
1014 | } | ||
1015 | |||
1016 | #nav-btn-add-tag { | ||
1017 | cursor: pointer; | ||
1018 | } | ||
1019 | |||
1020 | .shaarli::before { | ||
1021 | content: "*"; | ||
1022 | } | ||
1023 | |||
1024 | .return { | ||
1025 | text-decoration: none; | ||
1026 | margin-top: 1em; | ||
1027 | display: block; | ||
1028 | } | ||
1029 | |||
1030 | .return::before { | ||
1031 | margin-right: 0.5em; | ||
1032 | } | ||
1033 | |||
1034 | .notags { | ||
1035 | font-style: italic; | ||
1036 | color: #999; | ||
1037 | } | ||
1038 | |||
1039 | .icon-rss { | ||
1040 | background-color: #000; | ||
1041 | color: #fff; | ||
1042 | padding: 0.2em 0.5em; | ||
1043 | } | ||
1044 | |||
1045 | .icon-rss::before { | ||
1046 | position: relative; | ||
1047 | top: 2px; | ||
1048 | } | ||
1049 | |||
1050 | .list-tags li { | ||
1051 | margin-bottom: 0.5em; | ||
1052 | } | ||
1053 | |||
1054 | .list-tags .icon-rss:hover, | ||
1055 | .list-tags .icon-rss:focus { | ||
1056 | background-color: #fff; | ||
1057 | color: #000; | ||
1058 | text-decoration: none; | ||
1059 | } | ||
1060 | |||
1061 | .list-tags a { | ||
1062 | text-decoration: none; | ||
1063 | } | ||
1064 | |||
1065 | .list-tags a:hover, | ||
1066 | .list-tags a:focus { | ||
1067 | text-decoration: underline; | ||
1068 | } | ||
1069 | |||
1070 | pre code { | ||
1071 | font-family: "Courier New", Courier, monospace; | ||
1072 | } | ||
1073 | |||
1074 | #filter-form { | ||
1075 | position: fixed; | ||
1076 | width: 20%; | ||
1077 | height: 100%; | ||
1078 | top: 0; | ||
1079 | right: 0; | ||
1080 | background-color: #fff; | ||
1081 | padding: 15px; | ||
1082 | padding-right: 30px; | ||
1083 | padding-top: 30px; | ||
1084 | border-left: 1px #333 solid; | ||
1085 | z-index: 12; | ||
1086 | min-width: 300px; | ||
1087 | } | ||
1088 | |||
1089 | #filter-form form .filter-group { | ||
1090 | margin: 5px; | ||
1091 | } | ||
1092 | |||
1093 | #download-form { | ||
1094 | position: fixed; | ||
1095 | width: 10%; | ||
1096 | height: 100%; | ||
1097 | top: 0; | ||
1098 | right: 0; | ||
1099 | background-color: #fff; | ||
1100 | padding: 15px; | ||
1101 | padding-right: 30px; | ||
1102 | padding-top: 30px; | ||
1103 | border-left: 1px #333 solid; | ||
1104 | z-index: 12; | ||
1105 | min-width: 200px; | ||
1106 | } | ||
1107 | |||
1108 | #download-form li { | ||
1109 | display: block; | ||
1110 | padding: 0.5em 2em 0.5em 1em; | ||
1111 | color: #fff; | ||
1112 | position: relative; | ||
1113 | text-transform: uppercase; | ||
1114 | text-decoration: none; | ||
1115 | font-weight: 400; | ||
1116 | font-family: PT Sans, sans-serif; | ||
1117 | transition: all 0.5s ease; | ||
1118 | } | ||
1119 | |||
1120 | /* ========================================================================== | ||
1121 | 6 = Media Queries | ||
1122 | ========================================================================== */ | ||
1123 | |||
1124 | @media screen and (max-width: 1050px) { | ||
1125 | .entry { | ||
1126 | width: 49%; | ||
1127 | } | ||
1128 | .entry:nth-child(3n+1) { | ||
1129 | margin-left: 1.5%; | ||
1130 | } | ||
1131 | .entry:nth-child(2n+1) { | ||
1132 | margin-left: 0; | ||
1133 | } | ||
1134 | } | ||
1135 | |||
1136 | @media screen and (max-width: 900px) { | ||
1137 | #article { | ||
1138 | width: 80%; | ||
1139 | } | ||
1140 | .topPosF { | ||
1141 | right: 2.5em; | ||
1142 | } | ||
1143 | } | ||
1144 | |||
1145 | @media screen and (max-width: 700px) { | ||
1146 | .entry { | ||
1147 | width: 100%; | ||
1148 | margin-left: 0; | ||
1149 | } | ||
1150 | #display-mode { | ||
1151 | display: none; | ||
1152 | } | ||
1153 | } | ||
1154 | |||
1155 | @media screen and (max-width: 500px) { | ||
1156 | .entry { | ||
1157 | width: 100%; | ||
1158 | margin-left: 0; | ||
1159 | } | ||
1160 | |||
1161 | body > header { | ||
1162 | background-color: #333; | ||
1163 | position: fixed; | ||
1164 | top: 0; | ||
1165 | width: 100%; | ||
1166 | height: 3em; | ||
1167 | z-index: 11; | ||
1168 | } | ||
1169 | |||
1170 | #links li:last-child { | ||
1171 | position: static; | ||
1172 | width: auto; | ||
1173 | } | ||
1174 | |||
1175 | #links li:last-child a::before { | ||
1176 | content: none; | ||
1177 | } | ||
1178 | |||
1179 | .logo { | ||
1180 | width: 1.25em; | ||
1181 | height: 1.25em; | ||
1182 | left: 0; | ||
1183 | top: 0; | ||
1184 | } | ||
1185 | |||
1186 | .login > header { | ||
1187 | position: static; | ||
1188 | } | ||
1189 | |||
1190 | .login form { | ||
1191 | width: 100%; | ||
1192 | position: static; | ||
1193 | margin-left: 0; | ||
1194 | } | ||
1195 | |||
1196 | .login .logo { | ||
1197 | height: auto; | ||
1198 | top: 0.5em; | ||
1199 | width: 75px; | ||
1200 | height: 75px; | ||
1201 | margin-left: -37.5px; | ||
1202 | } | ||
1203 | |||
1204 | .desktopHide { | ||
1205 | display: block; | ||
1206 | position: fixed; | ||
1207 | z-index: 20; | ||
1208 | top: 0; | ||
1209 | right: 0; | ||
1210 | border: 0; | ||
1211 | width: 2.5em; | ||
1212 | height: 2.5em; | ||
1213 | cursor: pointer; | ||
1214 | background-color: #999; | ||
1215 | font-size: 1.2em; | ||
1216 | } | ||
1217 | .desktopHide:hover, | ||
1218 | .desktopHide:focus { | ||
1219 | background-color: #fff; | ||
1220 | } | ||
1221 | |||
1222 | #links { | ||
1223 | display: none; | ||
1224 | width: 100%; | ||
1225 | height: auto; | ||
1226 | padding-top: 3em; | ||
1227 | } | ||
1228 | |||
1229 | #links.menu--open { | ||
1230 | display: block; | ||
1231 | } | ||
1232 | |||
1233 | footer { | ||
1234 | position: static; | ||
1235 | margin-right: 3em; | ||
1236 | } | ||
1237 | |||
1238 | #main { | ||
1239 | margin-left: 1.5em; | ||
1240 | padding-right: 1.5em; | ||
1241 | position: static; | ||
1242 | margin-top: 3em; | ||
1243 | } | ||
1244 | |||
1245 | .card-entry-labels { | ||
1246 | display: none; | ||
1247 | } | ||
1248 | |||
1249 | #article_toolbar .topPosF { | ||
1250 | display: none; | ||
1251 | } | ||
1252 | |||
1253 | #article { | ||
1254 | width: 100%; | ||
1255 | } | ||
1256 | |||
1257 | #article h1 { | ||
1258 | font-size: 1.5em; | ||
1259 | } | ||
1260 | |||
1261 | #article_toolbar a { | ||
1262 | padding: 0.3em 0.4em 0.2em; | ||
1263 | } | ||
1264 | |||
1265 | #display-mode { | ||
1266 | display: none; | ||
1267 | } | ||
1268 | |||
1269 | .popup-form, | ||
1270 | #bagit-form, | ||
1271 | #search-form { | ||
1272 | left: 0; | ||
1273 | width: 100%; | ||
1274 | border-left: none; | ||
1275 | } | ||
1276 | |||
1277 | .popup-form form, | ||
1278 | #bagit-form form, | ||
1279 | #search-form form { | ||
1280 | width: 100%; | ||
1281 | } | ||
1282 | } | ||
diff --git a/app/Resources/static/themes/baggy/css/messages.css b/app/Resources/static/themes/baggy/css/messages.css new file mode 100755 index 00000000..bfaf1448 --- /dev/null +++ b/app/Resources/static/themes/baggy/css/messages.css | |||
@@ -0,0 +1,19 @@ | |||
1 | .messages.error.install { | ||
2 | border: 1px solid #c42608; | ||
3 | color: #c00 !important; | ||
4 | background: #fff0ef; | ||
5 | text-align: left; | ||
6 | } | ||
7 | |||
8 | .messages.notice.install { | ||
9 | border: 1px solid #ebcd41; | ||
10 | color: #000; | ||
11 | background: #fffcd3; | ||
12 | text-align: left; | ||
13 | } | ||
14 | |||
15 | .messages.success.install { | ||
16 | border: 1px solid #6dc70c; | ||
17 | background: #e0fbcc !important; | ||
18 | text-align: left; | ||
19 | } | ||
diff --git a/app/Resources/static/themes/baggy/css/print.css b/app/Resources/static/themes/baggy/css/print.css new file mode 100755 index 00000000..f7f6a8ad --- /dev/null +++ b/app/Resources/static/themes/baggy/css/print.css | |||
@@ -0,0 +1,66 @@ | |||
1 | @media print { | ||
2 | /* ### Layout ### */ | ||
3 | |||
4 | body { | ||
5 | font-family: Serif; | ||
6 | background-color: #fff; | ||
7 | } | ||
8 | |||
9 | @page { | ||
10 | margin: 1cm; | ||
11 | } | ||
12 | |||
13 | img { | ||
14 | max-width: 100% !important; | ||
15 | } | ||
16 | |||
17 | /* ### Content ### */ | ||
18 | |||
19 | /* Hide useless blocks */ | ||
20 | body > header, | ||
21 | #article_toolbar, | ||
22 | #links, | ||
23 | #sort, | ||
24 | body > footer, | ||
25 | .top_link, | ||
26 | div.tools, | ||
27 | header div, | ||
28 | .messages, | ||
29 | .entrie + .results, | ||
30 | #article .mbm a, | ||
31 | #article-informations { | ||
32 | display: none !important; | ||
33 | } | ||
34 | |||
35 | article { | ||
36 | border: none !important; | ||
37 | } | ||
38 | |||
39 | /* Add URL after links */ | ||
40 | .vieworiginal a::after { | ||
41 | content: " (" attr(href) ")"; | ||
42 | } | ||
43 | |||
44 | /* Add explanation after abbr */ | ||
45 | abbr[title]::after { | ||
46 | content: " (" attr(title) ")"; | ||
47 | } | ||
48 | |||
49 | /* Change border on current pager item */ | ||
50 | .pagination span.current { | ||
51 | border-style: dashed; | ||
52 | } | ||
53 | |||
54 | #main { | ||
55 | width: 100%; | ||
56 | padding: 0; | ||
57 | margin: 0; | ||
58 | margin-left: 0; | ||
59 | padding-right: 0; | ||
60 | padding-bottom: 0; | ||
61 | } | ||
62 | |||
63 | #article { | ||
64 | width: 100%; | ||
65 | } | ||
66 | } | ||
diff --git a/app/Resources/static/themes/baggy/css/ratatouille.css b/app/Resources/static/themes/baggy/css/ratatouille.css new file mode 100644 index 00000000..b5aeb54e --- /dev/null +++ b/app/Resources/static/themes/baggy/css/ratatouille.css | |||
@@ -0,0 +1,224 @@ | |||
1 | /* | ||
2 | Ratatouille mini Framework css by Thomas LEBEAU | ||
3 | Base on KNACSS => www.KNACSS.com (2013-10) @author: Raphael Goetter, Alsacreations | ||
4 | and normalize.css | ||
5 | */ | ||
6 | |||
7 | * { | ||
8 | -webkit-box-sizing: border-box; | ||
9 | -moz-box-sizing: border-box; | ||
10 | box-sizing: border-box; | ||
11 | } | ||
12 | |||
13 | html { | ||
14 | font-family: sans-serif; /* 1 */ | ||
15 | -ms-text-size-adjust: 100%; /* 2 */ | ||
16 | -webkit-text-size-adjust: 100%; /* 2 */ | ||
17 | } | ||
18 | |||
19 | body { | ||
20 | font-size: 1em; | ||
21 | line-height: 1.5; | ||
22 | margin: 0; | ||
23 | } | ||
24 | |||
25 | /* ========================================================================== | ||
26 | Mise en forme | ||
27 | ========================================================================== */ | ||
28 | |||
29 | h1:first-child, | ||
30 | h2:first-child, | ||
31 | h3:first-child, | ||
32 | h4:first-child, | ||
33 | h5:first-child, | ||
34 | h6:first-child, | ||
35 | p:first-child, | ||
36 | ul:first-child, | ||
37 | ol:first-child, | ||
38 | dl:first-child { | ||
39 | margin-top: 0; | ||
40 | } | ||
41 | |||
42 | code, | ||
43 | kbd, | ||
44 | pre, | ||
45 | samp { | ||
46 | font-family: monospace, serif; | ||
47 | } | ||
48 | |||
49 | pre { | ||
50 | white-space: pre-wrap; | ||
51 | } | ||
52 | |||
53 | .upper { | ||
54 | text-transform: uppercase; | ||
55 | } | ||
56 | |||
57 | .bold { | ||
58 | font-weight: bold; | ||
59 | } | ||
60 | |||
61 | .inner { | ||
62 | margin: 0 auto; | ||
63 | max-width: 61.25em; /* 980px */ | ||
64 | } | ||
65 | |||
66 | table, img, figure { | ||
67 | max-width: 100%; | ||
68 | height: auto; | ||
69 | } | ||
70 | |||
71 | iframe { | ||
72 | max-width: 100%; | ||
73 | } | ||
74 | |||
75 | .fl { | ||
76 | float: left; | ||
77 | } | ||
78 | |||
79 | .fr { | ||
80 | float: right; | ||
81 | } | ||
82 | |||
83 | table { | ||
84 | border-collapse: collapse; | ||
85 | } | ||
86 | |||
87 | figure { | ||
88 | margin: 0; | ||
89 | } | ||
90 | |||
91 | button, | ||
92 | input, | ||
93 | select, | ||
94 | textarea { | ||
95 | font-family: inherit; | ||
96 | font-size: 100%; | ||
97 | margin: 0; | ||
98 | } | ||
99 | |||
100 | input[type="search"] { | ||
101 | -webkit-appearance: textfield; | ||
102 | } | ||
103 | |||
104 | /* ========================================================================== | ||
105 | Mise en page | ||
106 | ========================================================================== */ | ||
107 | |||
108 | .dib { | ||
109 | display: inline-block; | ||
110 | vertical-align: middle; | ||
111 | } | ||
112 | |||
113 | .dnone { | ||
114 | display: none; | ||
115 | } | ||
116 | |||
117 | .dtable { | ||
118 | display: table; | ||
119 | } | ||
120 | |||
121 | .dtable > * { | ||
122 | display: table-row; | ||
123 | } | ||
124 | |||
125 | .dtable > * > * { | ||
126 | display: table-cell; | ||
127 | } | ||
128 | |||
129 | .element-invisible { | ||
130 | border: 0; | ||
131 | clip: rect(0 0 0 0); | ||
132 | height: 1px; | ||
133 | margin: -1px; | ||
134 | overflow: hidden; | ||
135 | padding: 0; | ||
136 | position: absolute; | ||
137 | width: 1px; | ||
138 | } | ||
139 | |||
140 | .small { | ||
141 | font-size: 0.8em; | ||
142 | } | ||
143 | |||
144 | .big { | ||
145 | font-size: 1.2em; | ||
146 | } | ||
147 | |||
148 | /* Width */ | ||
149 | |||
150 | .w100 { | ||
151 | width: 100%; | ||
152 | } | ||
153 | |||
154 | .w90 { | ||
155 | width: 90%; | ||
156 | } | ||
157 | |||
158 | .w80 { | ||
159 | width: 80%; | ||
160 | } | ||
161 | |||
162 | .w70 { | ||
163 | width: 70%; | ||
164 | } | ||
165 | |||
166 | .w60 { | ||
167 | width: 60%; | ||
168 | } | ||
169 | |||
170 | .w50 { | ||
171 | width: 50%; | ||
172 | } | ||
173 | |||
174 | .w40 { | ||
175 | width: 40%; | ||
176 | } | ||
177 | |||
178 | .w30 { | ||
179 | width: 30%; | ||
180 | } | ||
181 | |||
182 | .w20 { | ||
183 | width: 20%; | ||
184 | } | ||
185 | |||
186 | .w10 { | ||
187 | width: 10%; | ||
188 | } | ||
189 | |||
190 | /* ========================================================================== | ||
191 | Internet Explorer | ||
192 | ========================================================================== */ | ||
193 | |||
194 | /* IE8 and IE9 */ | ||
195 | |||
196 | article, | ||
197 | aside, | ||
198 | details, | ||
199 | figcaption, | ||
200 | figure, | ||
201 | footer, | ||
202 | header, | ||
203 | hgroup, | ||
204 | main, | ||
205 | nav, | ||
206 | section, | ||
207 | summary { | ||
208 | display: block; | ||
209 | } | ||
210 | |||
211 | /* IE8 and IE9 */ | ||
212 | |||
213 | audio, | ||
214 | canvas, | ||
215 | video { | ||
216 | display: inline-block; | ||
217 | } | ||
218 | |||
219 | @media screen and (-webkit-min-device-pixel-ratio: 0) { | ||
220 | select { | ||
221 | -webkit-appearance: none; | ||
222 | border-radius: 0; | ||
223 | } | ||
224 | } | ||