diff options
Diffstat (limited to 'tpl/default/css/shaarli.css')
-rw-r--r-- | tpl/default/css/shaarli.css | 1348 |
1 files changed, 0 insertions, 1348 deletions
diff --git a/tpl/default/css/shaarli.css b/tpl/default/css/shaarli.css deleted file mode 100644 index 14439402..00000000 --- a/tpl/default/css/shaarli.css +++ /dev/null | |||
@@ -1,1348 +0,0 @@ | |||
1 | /** | ||
2 | * General | ||
3 | */ | ||
4 | body { | ||
5 | background: #d0d0d0; | ||
6 | } | ||
7 | |||
8 | .strong { | ||
9 | font-weight: bold; | ||
10 | } | ||
11 | |||
12 | .clear { | ||
13 | clear: both; | ||
14 | } | ||
15 | |||
16 | .center { | ||
17 | text-align: center; | ||
18 | margin: auto; | ||
19 | } | ||
20 | |||
21 | .label { | ||
22 | display: inline-block; | ||
23 | padding: .25em .4em; | ||
24 | font-size: 75%; | ||
25 | font-weight: 700; | ||
26 | line-height: 1; | ||
27 | text-align: center; | ||
28 | white-space: nowrap; | ||
29 | vertical-align: baseline; | ||
30 | border-radius: .25rem; | ||
31 | } | ||
32 | |||
33 | pre { | ||
34 | max-width: 100%; | ||
35 | } | ||
36 | |||
37 | @font-face { | ||
38 | font-family: 'Roboto'; | ||
39 | font-weight: 400; | ||
40 | font-style: normal; | ||
41 | src: | ||
42 | local('Roboto'), | ||
43 | local('Roboto-Regular'), | ||
44 | url('../fonts/Roboto-Regular.woff2') format('woff2'), | ||
45 | url('../fonts/Roboto-Regular.woff') format('woff'); | ||
46 | } | ||
47 | |||
48 | @font-face { | ||
49 | font-family: 'Roboto'; | ||
50 | font-weight: 700; | ||
51 | font-style: normal; | ||
52 | src: | ||
53 | local('Roboto'), | ||
54 | local('Roboto-Bold'), | ||
55 | url('../fonts/Roboto-Bold.woff2') format('woff2'), | ||
56 | url('../fonts/Roboto-Bold.woff') format('woff'); | ||
57 | } | ||
58 | |||
59 | body, .pure-g [class*="pure-u"] { | ||
60 | font-family: Roboto, Arial, sans-serif; | ||
61 | } | ||
62 | |||
63 | /** | ||
64 | * Extends Pure grids responsive to hide items. | ||
65 | * Use xx-0 to hide an item on xx screen. | ||
66 | * Display it at any level with xx-visible. | ||
67 | */ | ||
68 | .pure-u-0 { display: none !important; } | ||
69 | @media screen and (min-width: 35.5em) { | ||
70 | .pure-u-sm-0 { display: none !important; } | ||
71 | .pure-u-sm-visible { display: inline-block !important; } | ||
72 | } | ||
73 | @media screen and (min-width: 48em) { | ||
74 | .pure-u-md-0 { display: none !important; } | ||
75 | .pure-u-md-visible { display: inline-block !important; } | ||
76 | } | ||
77 | @media screen and (min-width: 64em) { | ||
78 | .pure-u-lg-0 { display: none !important; } | ||
79 | .pure-u-lg-visible { display: inline-block !important; } | ||
80 | } | ||
81 | @media screen and (min-width: 80em) { | ||
82 | .pure-u-xl-0 { display: none !important; } | ||
83 | .pure-u-xl-visible { display: inline-block !important; } | ||
84 | } | ||
85 | |||
86 | /** | ||
87 | * Make pure-extras alert closable. | ||
88 | */ | ||
89 | .pure-alert-closable .fa-times { | ||
90 | float: right; | ||
91 | } | ||
92 | .pure-alert-close { | ||
93 | cursor: pointer; | ||
94 | } | ||
95 | |||
96 | .pure-alert-success { | ||
97 | background-color: #1b926c; | ||
98 | } | ||
99 | |||
100 | .anchor:target { | ||
101 | padding-top: 40px; | ||
102 | } | ||
103 | /** | ||
104 | * MENU | ||
105 | **/ | ||
106 | .shaarli-menu { | ||
107 | position: fixed; | ||
108 | top: 0; | ||
109 | width: 100%; | ||
110 | --height: 50px; | ||
111 | background: #1b926c; | ||
112 | -webkit-font-smoothing: antialiased; | ||
113 | /* Hack to transition with auto height: http://stackoverflow.com/a/8331169/1484919 */ | ||
114 | max-height: 45px; | ||
115 | transition: max-height 0.5s; | ||
116 | overflow: hidden; | ||
117 | z-index: 999; | ||
118 | } | ||
119 | |||
120 | /* Chrome bugfix: with 100% height, it only displays the first element. */ | ||
121 | .pure-menu-item { | ||
122 | height: 45px; | ||
123 | } | ||
124 | |||
125 | .shaarli-menu.open { | ||
126 | max-height: 500px; | ||
127 | transition: max-height 0.75s; | ||
128 | } | ||
129 | |||
130 | .head-logo { | ||
131 | float: left; | ||
132 | margin: 0 5px 0 0; | ||
133 | } | ||
134 | |||
135 | .pure-menu-link, | ||
136 | .pure-menu-link:visited, | ||
137 | .pure-menu-selected .pure-menu-link, | ||
138 | .pure-menu-selected .pure-menu-link:visited { | ||
139 | padding: 0.8em 1em; | ||
140 | color: #f5f5f5; | ||
141 | } | ||
142 | |||
143 | .pure-menu-link:hover, .pure-menu-link:focus, | ||
144 | .pure-menu-selected .pure-menu-link:hover, | ||
145 | .pure-menu-selected .pure-menu-link:focus { | ||
146 | color: #fff; | ||
147 | background: transparent; | ||
148 | } | ||
149 | |||
150 | .pure-menu-item:hover::after { | ||
151 | margin: -4px auto 0 auto; | ||
152 | display: block; | ||
153 | content:""; | ||
154 | background: #fff; | ||
155 | height: 4px; | ||
156 | width: 100%; | ||
157 | } | ||
158 | |||
159 | .menu-toggle { | ||
160 | width: 34px; | ||
161 | height: 45px; | ||
162 | position: absolute; | ||
163 | top: 5px; | ||
164 | right: 0; | ||
165 | display: none; | ||
166 | } | ||
167 | |||
168 | .menu-toggle .bar { | ||
169 | background-color: #b0ddce; | ||
170 | display: block; | ||
171 | width: 20px; | ||
172 | height: 2px; | ||
173 | border-radius: 100px; | ||
174 | position: absolute; | ||
175 | top: 18px; | ||
176 | right: 7px; | ||
177 | transition: all 0.5s; | ||
178 | } | ||
179 | |||
180 | .menu-toggle .bar:first-child { | ||
181 | transform: translateY(-6px); | ||
182 | } | ||
183 | |||
184 | .menu-toggle.x .bar { | ||
185 | transform: rotate(45deg); | ||
186 | } | ||
187 | |||
188 | .menu-toggle.x .bar:first-child { | ||
189 | transform: rotate(-45deg); | ||
190 | } | ||
191 | |||
192 | @media screen and (max-width: 64em) { | ||
193 | .menu-toggle { | ||
194 | display: block; | ||
195 | } | ||
196 | } | ||
197 | |||
198 | .header-buttons { | ||
199 | text-align: right; | ||
200 | } | ||
201 | |||
202 | .linkcount { | ||
203 | color: #252525; | ||
204 | font-size: 0.8em; | ||
205 | } | ||
206 | |||
207 | @media screen and (min-width: 64em) { | ||
208 | .linkcount { | ||
209 | position: absolute; | ||
210 | right: 5px; | ||
211 | } | ||
212 | } | ||
213 | |||
214 | #search, #search-linklist, #search-tagcloud { | ||
215 | text-align: center; | ||
216 | width: 100%; | ||
217 | } | ||
218 | |||
219 | #search input[type="text"], #search-linklist input[type="text"] { | ||
220 | padding: 0 5px; | ||
221 | height: 30px; | ||
222 | width: 260px; | ||
223 | background: #f5f5f5; | ||
224 | border: medium none currentColor; | ||
225 | box-shadow: 0 1px 0 rgba(255, 255, 255, 0.078), 0 1px 1px rgba(0, 0, 0, 0.298) inset; | ||
226 | border-radius: 2px; | ||
227 | color: #252525; | ||
228 | } | ||
229 | @media screen and (max-width: 64em) { | ||
230 | .searchform { | ||
231 | max-width: 260px; | ||
232 | margin: 0 auto; | ||
233 | } | ||
234 | } | ||
235 | |||
236 | /* because chrome */ | ||
237 | #search input[type="text"]::-webkit-input-placeholder, | ||
238 | #search-linklist input[type="text"]::-webkit-input-placeholder { | ||
239 | color: #777777; | ||
240 | } | ||
241 | |||
242 | #search button, | ||
243 | #search-tagcloud button, | ||
244 | #search-linklist button { | ||
245 | padding: 4px 8px 6px 8px; | ||
246 | background-color: #1B926C; | ||
247 | color: #f5f5f5; | ||
248 | border: none; | ||
249 | border-radius: 2px; | ||
250 | } | ||
251 | |||
252 | #search-tagcloud button { | ||
253 | width: 90%; | ||
254 | } | ||
255 | |||
256 | @media screen and (max-width: 64em) { | ||
257 | #search-linklist button { | ||
258 | width: 100%; | ||
259 | } | ||
260 | #search-linklist .awesomplete { | ||
261 | margin: 5px 0; | ||
262 | } | ||
263 | } | ||
264 | |||
265 | #search button:hover, | ||
266 | #search-linklist button:hover, | ||
267 | #search-tagcloud button:hover { | ||
268 | color: #d0d0d0; | ||
269 | } | ||
270 | |||
271 | #search, | ||
272 | #search-linklist { | ||
273 | padding: 6px 0; | ||
274 | } | ||
275 | |||
276 | @media screen and (max-width: 64em) { | ||
277 | #search, #search * { | ||
278 | visibility: hidden; | ||
279 | } | ||
280 | } | ||
281 | |||
282 | .subheader-form a.button { | ||
283 | color: #f5f5f5; | ||
284 | font-weight: bold; | ||
285 | text-decoration: none; | ||
286 | border: 2px solid #f5f5f5; | ||
287 | border-radius: 5px; | ||
288 | padding: 3px 10px; | ||
289 | } | ||
290 | |||
291 | .linklist-item-editbuttons .delete-checkbox { | ||
292 | display: none; | ||
293 | } | ||
294 | |||
295 | #header-login-form input[type="text"], #header-login-form input[type="password"] { | ||
296 | width: 200px; | ||
297 | } | ||
298 | |||
299 | /* because chrome */ | ||
300 | #header-login-form input[type="text"]::-webkit-input-placeholder, | ||
301 | #header-login-form input[type="password"]::-webkit-input-placeholder { | ||
302 | color: #777777; | ||
303 | } | ||
304 | |||
305 | .subheader-form { | ||
306 | visibility: hidden; | ||
307 | position: fixed; | ||
308 | width: 100%; | ||
309 | text-align: center; | ||
310 | background: #1b926c; | ||
311 | display: block; | ||
312 | z-index: 999; | ||
313 | height: 30px; | ||
314 | padding: 5px 0; | ||
315 | } | ||
316 | |||
317 | @media screen and (min-width: 64em) { | ||
318 | .subheader-form.open, .subheader-form.open * { | ||
319 | visibility: visible; | ||
320 | } | ||
321 | } | ||
322 | |||
323 | .subheader-form input[type="text"], .subheader-form input[type="password"], .subheader-form .remember-me { | ||
324 | padding: 5px 5px 3px 15px; | ||
325 | height: 20px; | ||
326 | width: 20%; | ||
327 | background: #f5f5f5; | ||
328 | border: medium none currentColor; | ||
329 | border-radius: 2px; | ||
330 | box-shadow: 0 1px 0 rgba(255, 255, 255, 0.078), 0 1px 4px rgba(0, 0, 0, 0.298) inset; | ||
331 | color: #252525; | ||
332 | } | ||
333 | |||
334 | /* because chrome */ | ||
335 | .subheader-form input[type="text"]::-webkit-input-placeholder, | ||
336 | .subheader-form input[type="password"]::-webkit-input-placeholder | ||
337 | { | ||
338 | color: #252525; | ||
339 | } | ||
340 | |||
341 | .subheader-form .remember-me { | ||
342 | display: inline-block; | ||
343 | width: auto; | ||
344 | padding: 5px 20px 3px 20px; | ||
345 | cursor: pointer; | ||
346 | } | ||
347 | |||
348 | .subheader-form .remember-me label, .subheader-form .remember-me input { | ||
349 | cursor: pointer; | ||
350 | } | ||
351 | |||
352 | .subheader-form input[type="submit"] { | ||
353 | display: inline-block; | ||
354 | margin: 0 0 5px 0; | ||
355 | padding: 4px 0 4px 0; | ||
356 | height: 28px; | ||
357 | width: 100px; | ||
358 | background: #1b926c; | ||
359 | border: 1px solid #f5f5f5; | ||
360 | color: #f5f5f5; | ||
361 | border-radius: 2px; | ||
362 | } | ||
363 | |||
364 | .subheader-form input[type="submit"]:hover { | ||
365 | background: #f5f5f5; | ||
366 | color: #1b926c; | ||
367 | } | ||
368 | |||
369 | .new-version-message { | ||
370 | text-align: center; | ||
371 | } | ||
372 | |||
373 | .new-version-message a { | ||
374 | color: rgb(151, 96, 13); | ||
375 | font-weight: bold; | ||
376 | } | ||
377 | |||
378 | /** | ||
379 | * CONTENT - GENERAL | ||
380 | */ | ||
381 | #content { | ||
382 | position: relative; | ||
383 | z-index: 2; | ||
384 | margin-top: 45px; | ||
385 | } | ||
386 | |||
387 | /** | ||
388 | * Plugins additional forms | ||
389 | */ | ||
390 | .toolbar-plugin { | ||
391 | margin: 5px 0; | ||
392 | text-align: center; | ||
393 | } | ||
394 | |||
395 | .toolbar-plugin input[type="text"] { | ||
396 | padding: 0 5px; | ||
397 | height: 30px; | ||
398 | width: 300px; | ||
399 | background: #f5f5f5; | ||
400 | border: medium none currentColor; | ||
401 | box-shadow: 0 1px 0 rgba(255, 255, 255, 0.078), 0 1px 1px rgba(0, 0, 0, 0.298) inset; | ||
402 | border-radius: 2px; | ||
403 | color: #252525; | ||
404 | } | ||
405 | |||
406 | /* because chrome */ | ||
407 | .toolbar-plugin input[type="text"]::-webkit-input-placeholder { | ||
408 | color: #777777; | ||
409 | } | ||
410 | |||
411 | .toolbar-plugin input[type="submit"] { | ||
412 | padding: 0 10px; | ||
413 | height: 30px; | ||
414 | background: #f5f5f5; | ||
415 | border: medium none currentColor; | ||
416 | border-radius: 2px; | ||
417 | color: #252525; | ||
418 | } | ||
419 | |||
420 | .toolbar-plugin input[type="submit"]:hover { | ||
421 | background: #fff; | ||
422 | } | ||
423 | |||
424 | @media screen and (max-width: 64em) { | ||
425 | .toolbar-plugin input[type="text"] { | ||
426 | width: 70%; | ||
427 | |||
428 | } | ||
429 | } | ||
430 | |||
431 | /** | ||
432 | * CONTENT - LINKLIST PAGING | ||
433 | * 64em -> lg | ||
434 | */ | ||
435 | .linklist-filters { | ||
436 | margin: 5px 0; | ||
437 | color: #252525; | ||
438 | font-size: 0.9em; | ||
439 | } | ||
440 | |||
441 | .linklist-filters a { | ||
442 | padding: 5px 8px; | ||
443 | text-decoration: none; | ||
444 | } | ||
445 | |||
446 | .linklist-filters .filter-off { | ||
447 | color: #252525; | ||
448 | background: #f5f5f5; | ||
449 | } | ||
450 | |||
451 | .linklist-filters .filter-on { | ||
452 | color: #b0ddce; | ||
453 | background: #1b926c; | ||
454 | } | ||
455 | |||
456 | .linklist-pages { | ||
457 | margin: 5px 0; | ||
458 | color: #252525; | ||
459 | text-align: center; | ||
460 | } | ||
461 | |||
462 | .linklist-pages a { | ||
463 | color: #252525; | ||
464 | text-decoration: none; | ||
465 | } | ||
466 | |||
467 | .linklist-pages a:hover { | ||
468 | color: #fff; | ||
469 | } | ||
470 | |||
471 | .linksperpage { | ||
472 | margin: 5px 0; | ||
473 | text-align: right; | ||
474 | color: #252525; | ||
475 | font-size: 0.9em; | ||
476 | } | ||
477 | |||
478 | .linksperpage a { | ||
479 | padding: 5px 5px; | ||
480 | text-decoration: none; | ||
481 | color: #252525; | ||
482 | background: #f5f5f5; | ||
483 | } | ||
484 | |||
485 | .linksperpage a, .linksperpage input[type="text"] { | ||
486 | display: inline-block; | ||
487 | width: 20px; | ||
488 | text-align: center; | ||
489 | } | ||
490 | |||
491 | .linksperpage form { | ||
492 | display: inline; | ||
493 | } | ||
494 | |||
495 | .linksperpage input[type="text"] { | ||
496 | height: 20px; | ||
497 | margin: 0; | ||
498 | padding: 4px 5px 3px 8px; | ||
499 | background: #f5f5f5; | ||
500 | border: medium none currentColor; | ||
501 | color: #252525; | ||
502 | font-size: 0.8em; | ||
503 | } | ||
504 | |||
505 | /** | ||
506 | * CONTENT - LINKLIST ITEMS | ||
507 | */ | ||
508 | .linklist-item { | ||
509 | margin: 0 0 10px 0; | ||
510 | background: #f5f5f5; | ||
511 | box-shadow: 1px 1px 3px #797979; | ||
512 | } | ||
513 | |||
514 | .linklist-item-buttons { | ||
515 | background: transparent; | ||
516 | position: relative; | ||
517 | width: 23px; | ||
518 | z-index: 99; | ||
519 | } | ||
520 | |||
521 | .linklist-item-buttons-right { | ||
522 | float: right; | ||
523 | margin-right: -25px; | ||
524 | } | ||
525 | |||
526 | .linklist-item-buttons * { | ||
527 | display: block; | ||
528 | float: left; | ||
529 | width:100%; | ||
530 | margin: auto; | ||
531 | text-align: center; | ||
532 | } | ||
533 | |||
534 | .linklist-item-title, .linklist-item-title h2 { | ||
535 | margin: 0; | ||
536 | word-wrap: break-word; | ||
537 | } | ||
538 | |||
539 | .linklist-item-title { | ||
540 | position: relative; | ||
541 | background: #f5f5f5; | ||
542 | } | ||
543 | |||
544 | .linklist-item-title h2 { | ||
545 | padding: 3px 10px 0 10px; | ||
546 | line-height: 30px; | ||
547 | } | ||
548 | |||
549 | .linklist-item-title h2 a { | ||
550 | font-size: 0.7em; | ||
551 | color: #252525; | ||
552 | text-decoration: none; | ||
553 | vertical-align: middle; | ||
554 | } | ||
555 | |||
556 | .linklist-item-title .linklist-link { | ||
557 | font-size: 1.1em; | ||
558 | color: #1b926c; | ||
559 | } | ||
560 | |||
561 | .linklist-item-title h2 a:visited .linklist-link { | ||
562 | color: #2a4c41; | ||
563 | } | ||
564 | |||
565 | .linklist-item-title h2 a:hover, .linklist-item-title .linklist-link:hover{ | ||
566 | color: #252525; | ||
567 | } | ||
568 | |||
569 | |||
570 | .linklist-item-title .label-private { | ||
571 | border: solid 1px #F89406; | ||
572 | font-family: Arial, sans-serif; | ||
573 | font-size: 0.65em; | ||
574 | color: #F89406; | ||
575 | } | ||
576 | |||
577 | .fold-button { | ||
578 | display: none; | ||
579 | color: #252525; | ||
580 | } | ||
581 | |||
582 | .linklist-item-editbuttons { | ||
583 | float: right; | ||
584 | padding: 8px 5px; | ||
585 | } | ||
586 | |||
587 | .linklist-item-editbuttons * { | ||
588 | display: block; | ||
589 | float: left; | ||
590 | margin: 0 1px; | ||
591 | } | ||
592 | |||
593 | .linklist-item-editbuttons a { | ||
594 | font-size: 1em; | ||
595 | } | ||
596 | |||
597 | .edit-link { | ||
598 | font-size: 1.2em; | ||
599 | color: #0b5ea6; | ||
600 | } | ||
601 | |||
602 | .delete-link { | ||
603 | font-size: 1.3em; | ||
604 | color: #ac2925 !important; | ||
605 | } | ||
606 | |||
607 | .linklist-item-description { | ||
608 | position: relative; | ||
609 | padding: 0 10px; | ||
610 | word-wrap: break-word; | ||
611 | color: #252525; | ||
612 | line-height: 1.3em; | ||
613 | } | ||
614 | |||
615 | .linklist-item-description a { | ||
616 | text-decoration: none; | ||
617 | color: #1b926c; | ||
618 | } | ||
619 | |||
620 | .linklist-item-description a:hover { | ||
621 | color: #252525; | ||
622 | } | ||
623 | |||
624 | .linklist-item-description a:visited { | ||
625 | color: #14553f; | ||
626 | } | ||
627 | |||
628 | .linklist-item-thumbnail { | ||
629 | position: relative; | ||
630 | padding: 0 0 0 5px; | ||
631 | margin: 0; | ||
632 | float: right; | ||
633 | z-index: 50; | ||
634 | height: 90px; | ||
635 | } | ||
636 | |||
637 | .linklist-item.private .linklist-item-title::before, | ||
638 | .linklist-item.private .linklist-item-description::before { | ||
639 | position: absolute; | ||
640 | left: 3px; | ||
641 | top: 0; | ||
642 | display: block; | ||
643 | content:""; | ||
644 | background: #F89406; | ||
645 | height: 96%; | ||
646 | width: 2px; | ||
647 | z-index: 1; | ||
648 | } | ||
649 | |||
650 | .linklist-item.private .linklist-item-description::before { | ||
651 | height: 100%; | ||
652 | } | ||
653 | |||
654 | .linklist-item.private .linklist-item-title::before { | ||
655 | margin-top: 3px; | ||
656 | } | ||
657 | |||
658 | .linklist-item-infos { | ||
659 | padding: 4px 8px 4px 8px; | ||
660 | background: #ddd; | ||
661 | color: #252525; | ||
662 | } | ||
663 | |||
664 | .linklist-item-infos a { | ||
665 | color: #252525; | ||
666 | text-decoration: none; | ||
667 | } | ||
668 | |||
669 | .linklist-item-infos a:hover { | ||
670 | color: #000; | ||
671 | } | ||
672 | |||
673 | .linklist-item-infos .linklist-item-tags { | ||
674 | font-size: 0.8em; | ||
675 | } | ||
676 | |||
677 | .linklist-item-infos .label-tag { | ||
678 | font-size: 1em; | ||
679 | } | ||
680 | |||
681 | .linklist-item-infos-dateblock { | ||
682 | font-size: 0.9em; | ||
683 | } | ||
684 | |||
685 | .linklist-plugin-icon { | ||
686 | width: 13px; | ||
687 | height: 13px; | ||
688 | } | ||
689 | |||
690 | .linklist-item-infos-url { | ||
691 | text-align: right; | ||
692 | white-space: nowrap; | ||
693 | overflow: hidden; | ||
694 | text-overflow: ellipsis; | ||
695 | font-size: 0.8em; | ||
696 | height:23px; | ||
697 | line-height:23px; | ||
698 | } | ||
699 | |||
700 | .linklist-item-infos .mobile-buttons { | ||
701 | text-align: right; | ||
702 | } | ||
703 | |||
704 | .linklist-item-infos .linklist-plugin-icon { | ||
705 | display: inline-block; | ||
706 | margin: 0 2px; | ||
707 | width: 16px; | ||
708 | height: 16px; | ||
709 | } | ||
710 | |||
711 | .linklist-item-infos-controls-group { | ||
712 | display: inline-block; | ||
713 | border-right: 1px solid #5d5d5d; | ||
714 | padding-right: 6px; | ||
715 | } | ||
716 | |||
717 | .ctrl-edit { | ||
718 | margin: 0 7px; | ||
719 | } | ||
720 | |||
721 | /** 64em -> lg **/ | ||
722 | @media screen and (max-width: 64em) { | ||
723 | .linklist-item-infos-url { | ||
724 | text-align: left; | ||
725 | } | ||
726 | } | ||
727 | |||
728 | /** | ||
729 | * Footer | ||
730 | */ | ||
731 | #footer { | ||
732 | margin: 20px 0; | ||
733 | padding: 5px; | ||
734 | text-align: center; | ||
735 | color: #252525; | ||
736 | } | ||
737 | |||
738 | #footer:before { | ||
739 | display: block; | ||
740 | content:""; | ||
741 | background: linear-gradient(to right, #949393, #252525, #949393); | ||
742 | height: 1px; | ||
743 | width: 80%; | ||
744 | margin: 10px auto; | ||
745 | } | ||
746 | |||
747 | #footer a { | ||
748 | color: #252525; | ||
749 | } | ||
750 | |||
751 | /** | ||
752 | * PAGE FORM | ||
753 | */ | ||
754 | .page-form { | ||
755 | margin: 20px 0 0 0; | ||
756 | background: #f5f5f5; | ||
757 | box-shadow: 1px 1px 2px #797979; | ||
758 | color: #252525; | ||
759 | overflow: hidden; | ||
760 | } | ||
761 | |||
762 | .page-form .window-title { | ||
763 | margin: 0 0 10px 0; | ||
764 | padding: 10px 0; | ||
765 | width: 100%; | ||
766 | color: #1b926c; | ||
767 | background: #f5f5f5; | ||
768 | text-align: center; | ||
769 | } | ||
770 | |||
771 | .page-form .window-subtitle { | ||
772 | text-align: center; | ||
773 | } | ||
774 | |||
775 | .page-form a { | ||
776 | color: #1b926c; | ||
777 | font-weight: bold; | ||
778 | text-decoration: none; | ||
779 | } | ||
780 | |||
781 | .page-form p { | ||
782 | padding: 5px 10px; | ||
783 | margin: 0; | ||
784 | } | ||
785 | |||
786 | .page-form input[type="text"], | ||
787 | .page-form input[type="password"], | ||
788 | .page-form textarea { | ||
789 | box-sizing: border-box; | ||
790 | margin: 10px 0; | ||
791 | padding: 5px 5px 3px 15px; | ||
792 | height: 35px; | ||
793 | width: 90%; | ||
794 | background: #eeeeee; | ||
795 | border: solid 1px #d8d8d8; | ||
796 | border-radius: 2px; | ||
797 | color: #252525; | ||
798 | } | ||
799 | |||
800 | .page-form textarea { | ||
801 | min-height: 240px; | ||
802 | padding: 15px 5px 3px 15px; | ||
803 | resize: vertical; | ||
804 | overflow-y: auto; | ||
805 | word-wrap:break-word | ||
806 | } | ||
807 | |||
808 | /* because chrome */ | ||
809 | .page-form input[type="text"]::-webkit-input-placeholder, | ||
810 | .page-form input[type="password"]::-webkit-input-placeholder { | ||
811 | color: #777777; | ||
812 | } | ||
813 | |||
814 | .page-form input[type="submit"], .page-form a.button { | ||
815 | margin: 15px 5px; | ||
816 | height: 35px; | ||
817 | line-height: 35px; | ||
818 | width: 150px; | ||
819 | background: #1b926c; | ||
820 | color: #f5f5f5; | ||
821 | border: none; | ||
822 | box-shadow: 1px 1px 1px #ddd, -1px -1px 6px #ddd, -1px 1px 2px #ddd, 1px -1px 2px #ddd; | ||
823 | font-size: 1.2em; | ||
824 | text-decoration: none; | ||
825 | vertical-align: center; | ||
826 | font-weight: normal; | ||
827 | display: inline-block; | ||
828 | } | ||
829 | |||
830 | |||
831 | .page-form .button.button-red { | ||
832 | background: #ac2925; | ||
833 | } | ||
834 | |||
835 | .page-form .submit-buttons { | ||
836 | margin-bottom: 10px; | ||
837 | } | ||
838 | |||
839 | @media screen and (min-width: 64em) { | ||
840 | .page-form .submit-buttons { | ||
841 | position: relative; | ||
842 | } | ||
843 | |||
844 | .page-form .submit-buttons .button.button-red { | ||
845 | position: absolute; | ||
846 | right: 5%; | ||
847 | } | ||
848 | } | ||
849 | |||
850 | @media screen and (max-width: 64em) { | ||
851 | .page-form .submit-buttons .button { | ||
852 | display: block; | ||
853 | margin: auto; | ||
854 | } | ||
855 | } | ||
856 | |||
857 | .page-form select { | ||
858 | color: #252525; | ||
859 | } | ||
860 | |||
861 | /** | ||
862 | * PAGE FORM - LIGHT | ||
863 | */ | ||
864 | .page-form-light div, .page-form-light p { | ||
865 | text-align: center; | ||
866 | } | ||
867 | |||
868 | /** | ||
869 | * PAGE FORM - COMPLETE | ||
870 | */ | ||
871 | .page-form-complete { | ||
872 | #background: #f5f5f5; | ||
873 | } | ||
874 | |||
875 | .page-form-complete div, .page-form-complete p { | ||
876 | color: #252525; | ||
877 | } | ||
878 | |||
879 | .page-form-complete .form-label, .page-form-complete .form-input { | ||
880 | position: relative; | ||
881 | height: 60px; | ||
882 | } | ||
883 | |||
884 | .page-form-complete .form-label label, | ||
885 | .page-form-complete .form-input input, | ||
886 | .page-form-complete .form-input select.align, | ||
887 | .page-form-complete .timezone { | ||
888 | position: absolute; | ||
889 | top: 50%; | ||
890 | transform: translateY(-50%); | ||
891 | } | ||
892 | |||
893 | .page-form-complete .form-label label { | ||
894 | text-align: right; | ||
895 | right: 0; | ||
896 | padding: 0 20px; | ||
897 | } | ||
898 | |||
899 | .page-form-complete .label-name { | ||
900 | font-weight: bold; | ||
901 | } | ||
902 | |||
903 | .page-form-complete .label-desc { | ||
904 | font-size: 0.8em; | ||
905 | } | ||
906 | |||
907 | .page-form-complete input[type="text"], | ||
908 | .page-form-complete input[type="password"], | ||
909 | .page-form-complete textarea { | ||
910 | margin: 0; | ||
911 | } | ||
912 | |||
913 | .page-form section { | ||
914 | margin: 10px 0 25px 0; | ||
915 | } | ||
916 | |||
917 | .page-form table { | ||
918 | margin: auto; | ||
919 | width: 90%; | ||
920 | } | ||
921 | |||
922 | .page-form table .order { | ||
923 | text-decoration: none; | ||
924 | color: #252525; | ||
925 | } | ||
926 | |||
927 | .page-form table, .page-form th, .page-form td { | ||
928 | border-width: 1px 0; | ||
929 | border-style: solid; | ||
930 | border-color: #aaaaaa; | ||
931 | } | ||
932 | |||
933 | .page-form th, .page-form td { | ||
934 | padding: 5px; | ||
935 | |||
936 | } | ||
937 | |||
938 | /* Awesomeplete fix */ | ||
939 | div.awesomplete { | ||
940 | width: inherit; | ||
941 | } | ||
942 | |||
943 | div.awesomplete > input { | ||
944 | display: inherit; | ||
945 | } | ||
946 | |||
947 | div.awesomplete > ul { | ||
948 | z-index: 9999; | ||
949 | } | ||
950 | |||
951 | .page-form .awesomplete { | ||
952 | width: 90%; | ||
953 | } | ||
954 | |||
955 | .page-form .awesomplete input { | ||
956 | width: 100%; | ||
957 | } | ||
958 | |||
959 | .page-form div.awesomplete > ul { | ||
960 | color: black; | ||
961 | } | ||
962 | |||
963 | form[name="linkform"].page-form { | ||
964 | overflow: visible; | ||
965 | } | ||
966 | |||
967 | @media screen and (max-width: 64em) { | ||
968 | .page-form-complete .form-label { | ||
969 | height: inherit; | ||
970 | } | ||
971 | |||
972 | .page-form-complete .form-label label, | ||
973 | .page-form-complete .form-input input, | ||
974 | .page-form-complete .timezone { | ||
975 | position: inherit; | ||
976 | top: inherit; | ||
977 | transform: translateY(0); | ||
978 | } | ||
979 | |||
980 | .page-form-complete .form-input input[type="checkbox"] { | ||
981 | position: absolute; | ||
982 | top: 50%; | ||
983 | right: 50%; | ||
984 | transform: translateY(-50%); | ||
985 | } | ||
986 | |||
987 | .page-form-complete .form-input { | ||
988 | text-align: center; | ||
989 | } | ||
990 | |||
991 | .page-form-complete .form-label label { | ||
992 | display: block; | ||
993 | text-align: left; | ||
994 | margin: 10px 0 0 0; | ||
995 | } | ||
996 | |||
997 | .timezone-continent:after { | ||
998 | content:"\a\a"; | ||
999 | white-space: pre; | ||
1000 | } | ||
1001 | |||
1002 | .page-form-complete .radio-buttons { | ||
1003 | text-align: left; | ||
1004 | padding: 5px 15px; | ||
1005 | } | ||
1006 | } | ||
1007 | |||
1008 | /** | ||
1009 | * Page visitor (page form extended) | ||
1010 | */ | ||
1011 | .page-visitor { | ||
1012 | color: #252525; | ||
1013 | } | ||
1014 | |||
1015 | #page404 { | ||
1016 | color: #3f3f3f; | ||
1017 | } | ||
1018 | |||
1019 | /** | ||
1020 | * EDIT LINK | ||
1021 | */ | ||
1022 | #editlinkform .created-date { | ||
1023 | color: #767676; | ||
1024 | margin-bottom: 10px; | ||
1025 | } | ||
1026 | |||
1027 | /** | ||
1028 | * LOGIN | ||
1029 | */ | ||
1030 | #login-form .remember-me { | ||
1031 | margin: 5px 0; | ||
1032 | } | ||
1033 | |||
1034 | /** | ||
1035 | * Search results | ||
1036 | */ | ||
1037 | .search-result a { | ||
1038 | color: white; | ||
1039 | text-decoration: none; | ||
1040 | } | ||
1041 | |||
1042 | .search-result .label-tag { | ||
1043 | border-color: white; | ||
1044 | } | ||
1045 | |||
1046 | .search-result .label-tag .remove { | ||
1047 | border-left: white 1px solid; | ||
1048 | padding: 0 0 0 5px; | ||
1049 | margin: 0 0 0 5px; | ||
1050 | } | ||
1051 | |||
1052 | .search-result .label-private { | ||
1053 | border: 1px solid white; | ||
1054 | } | ||
1055 | |||
1056 | /** | ||
1057 | * TOOLS | ||
1058 | */ | ||
1059 | .tools-item { | ||
1060 | margin: 10px 0; | ||
1061 | } | ||
1062 | |||
1063 | .tools-item .pure-button:hover { | ||
1064 | background-image: none; | ||
1065 | background-color: #1b926c; | ||
1066 | color: #f5f5f5; | ||
1067 | } | ||
1068 | |||
1069 | /** | ||
1070 | * PLUGIN ADMIN | ||
1071 | */ | ||
1072 | #pluginform .mobile-row { | ||
1073 | font-size: 0.9em; | ||
1074 | } | ||
1075 | |||
1076 | #pluginform .more { | ||
1077 | margin-top: 10px; | ||
1078 | } | ||
1079 | |||
1080 | @media screen and (max-width: 64em) { | ||
1081 | #pluginform .main-row, #pluginform .main-row td { | ||
1082 | border-bottom-style: none; | ||
1083 | } | ||
1084 | |||
1085 | #pluginform .mobile-row, #pluginform .mobile-row td { | ||
1086 | border-top-style: none; | ||
1087 | } | ||
1088 | } | ||
1089 | |||
1090 | /** | ||
1091 | * IMPORT | ||
1092 | */ | ||
1093 | #import-field { | ||
1094 | margin: 15px 0; | ||
1095 | } | ||
1096 | |||
1097 | /** | ||
1098 | * TAG CLOUD | ||
1099 | */ | ||
1100 | #cloudtag { | ||
1101 | padding: 10px; | ||
1102 | text-align: center; | ||
1103 | } | ||
1104 | |||
1105 | #cloudtag, #cloudtag a { | ||
1106 | color: #252525; | ||
1107 | text-decoration: none; | ||
1108 | } | ||
1109 | |||
1110 | #cloudtag .count { | ||
1111 | color: #7f7f7f; | ||
1112 | } | ||
1113 | |||
1114 | /** | ||
1115 | * TAG LIST | ||
1116 | */ | ||
1117 | #taglist { | ||
1118 | padding: 0 10px; | ||
1119 | } | ||
1120 | |||
1121 | #taglist a { | ||
1122 | color: #252525; | ||
1123 | text-decoration: none; | ||
1124 | } | ||
1125 | |||
1126 | #taglist .count { | ||
1127 | display: inline-block; | ||
1128 | width: 35px; | ||
1129 | text-align: right; | ||
1130 | color: #7f7f7f; | ||
1131 | } | ||
1132 | |||
1133 | #taglist .rename-tag-form { | ||
1134 | display: none; | ||
1135 | } | ||
1136 | |||
1137 | #taglist .delete-tag { | ||
1138 | color: #ac2925; | ||
1139 | display: none; | ||
1140 | } | ||
1141 | |||
1142 | #taglist .rename-tag { | ||
1143 | color: #0b5ea6; | ||
1144 | } | ||
1145 | |||
1146 | #taglist .validate-rename-tag { | ||
1147 | color: #1b926c; | ||
1148 | } | ||
1149 | |||
1150 | /** | ||
1151 | * Picture wall CSS | ||
1152 | */ | ||
1153 | #picwall_container { | ||
1154 | margin: 0 10px 10px 10px; | ||
1155 | color: #252525; | ||
1156 | background-color: #f5f5f5; | ||
1157 | clear: both; | ||
1158 | } | ||
1159 | |||
1160 | .picwall_pictureframe { | ||
1161 | margin: 2px; | ||
1162 | background-color: #f5f5f5; | ||
1163 | z-index: 5; | ||
1164 | position: relative; | ||
1165 | display: table-cell; | ||
1166 | vertical-align: middle; | ||
1167 | width: 90px; | ||
1168 | height: 90px; | ||
1169 | overflow: hidden; | ||
1170 | text-align: center; | ||
1171 | float: left; | ||
1172 | } | ||
1173 | |||
1174 | .b-lazy { | ||
1175 | -webkit-transition: opacity 500ms ease-in-out; | ||
1176 | -moz-transition: opacity 500ms ease-in-out; | ||
1177 | -o-transition: opacity 500ms ease-in-out; | ||
1178 | transition: opacity 500ms ease-in-out; | ||
1179 | opacity: 0; | ||
1180 | } | ||
1181 | .b-lazy.b-loaded { | ||
1182 | opacity: 1; | ||
1183 | } | ||
1184 | |||
1185 | .picwall_pictureframe img { | ||
1186 | max-width: 100%; | ||
1187 | height: auto; | ||
1188 | color: transparent; | ||
1189 | } /* Adapt the width of the image */ | ||
1190 | |||
1191 | .picwall_pictureframe a { | ||
1192 | text-decoration: none; | ||
1193 | } | ||
1194 | |||
1195 | /* CSS to show title when hovering an image - no javascript required. */ | ||
1196 | .picwall_pictureframe span.info { | ||
1197 | display: none; | ||
1198 | font-family: Arial, sans-serif; | ||
1199 | } | ||
1200 | |||
1201 | .picwall_pictureframe:hover span.info { | ||
1202 | display: block; | ||
1203 | position: absolute; | ||
1204 | top: 0; | ||
1205 | left: 0; | ||
1206 | width: 90px; | ||
1207 | height: 90px; | ||
1208 | font-weight: bold; | ||
1209 | font-size: 9pt; | ||
1210 | color: #f5f5f5; | ||
1211 | text-align: left; | ||
1212 | background-color: rgba(0, 0, 0, 0.8); | ||
1213 | } | ||
1214 | |||
1215 | /** | ||
1216 | * DAILY | ||
1217 | */ | ||
1218 | .daily-desc { | ||
1219 | color: #7f7f7f; | ||
1220 | font-size: 0.8em; | ||
1221 | } | ||
1222 | |||
1223 | .daily-about a { | ||
1224 | color: #343434; | ||
1225 | text-decoration: none; | ||
1226 | } | ||
1227 | |||
1228 | .daily-about a:hover { | ||
1229 | color: #7f7f7f; | ||
1230 | } | ||
1231 | |||
1232 | .daily-about h3:before, .daily-about h3:after { | ||
1233 | display: block; | ||
1234 | content:""; | ||
1235 | background: linear-gradient(to right, #d5d4d4, #252525, #d5d4d4); | ||
1236 | height: 1px; | ||
1237 | width: 90%; | ||
1238 | margin: 10px auto; | ||
1239 | } | ||
1240 | |||
1241 | .daily-entry { | ||
1242 | padding: 0 10px; | ||
1243 | } | ||
1244 | |||
1245 | .daily-entry .daily-entry-title:after { | ||
1246 | display: block; | ||
1247 | content:""; | ||
1248 | background: linear-gradient(to right, #fff, #515151, #fff); | ||
1249 | height: 1px; | ||
1250 | width: 70%; | ||
1251 | margin: 5px auto; | ||
1252 | } | ||
1253 | |||
1254 | .daily-entry .daily-entry-title { | ||
1255 | margin: 10px 0 0 0; | ||
1256 | } | ||
1257 | |||
1258 | .daily-entry .daily-entry-title a { | ||
1259 | color: #000; | ||
1260 | text-decoration: none; | ||
1261 | } | ||
1262 | |||
1263 | .daily-entry .daily-entry-description { | ||
1264 | padding: 5px 5px 0 5px; | ||
1265 | font-size: 0.9em; | ||
1266 | text-align: justify; | ||
1267 | word-wrap: break-word; | ||
1268 | } | ||
1269 | |||
1270 | .daily-entry .daily-entry-tags { | ||
1271 | padding: 0 5px 5px 5px; | ||
1272 | font-size: 0.8em; | ||
1273 | } | ||
1274 | |||
1275 | .daily-entry-thumbnail { | ||
1276 | float: left; | ||
1277 | margin: 15px 5px 5px 15px; | ||
1278 | } | ||
1279 | |||
1280 | .daily-entry-description a { | ||
1281 | text-decoration: none; | ||
1282 | color: #1b926c; | ||
1283 | } | ||
1284 | |||
1285 | .daily-entry-description a:hover { | ||
1286 | text-shadow: 1px 1px #ddd; | ||
1287 | } | ||
1288 | |||
1289 | .daily-entry-description a:visited { | ||
1290 | color: #20b988; | ||
1291 | } | ||
1292 | |||
1293 | /* | ||
1294 | * Fix empty bookmarklet name in Firefox | ||
1295 | */ | ||
1296 | .pure-button { | ||
1297 | -moz-user-select: auto; | ||
1298 | } | ||
1299 | |||
1300 | .tag-sort { | ||
1301 | margin-top: 30px; | ||
1302 | text-align: center; | ||
1303 | } | ||
1304 | |||
1305 | .tag-sort a { | ||
1306 | display: inline-block; | ||
1307 | margin: 0 15px; | ||
1308 | color: white; | ||
1309 | text-decoration: none; | ||
1310 | font-weight: bold; | ||
1311 | } | ||
1312 | |||
1313 | /** | ||
1314 | * Markdown | ||
1315 | */ | ||
1316 | .markdown p { | ||
1317 | margin: 0 !important; | ||
1318 | } | ||
1319 | |||
1320 | .markdown p + p { | ||
1321 | margin: 0.5em 0 0 0 !important; | ||
1322 | } | ||
1323 | |||
1324 | .markdown *:first-child { | ||
1325 | margin-top: 0 !important; | ||
1326 | } | ||
1327 | |||
1328 | .markdown *:last-child { | ||
1329 | margin-bottom: 5px !important; | ||
1330 | } | ||
1331 | |||
1332 | /** | ||
1333 | * Pure Button | ||
1334 | */ | ||
1335 | .pure-button-success, | ||
1336 | .pure-button-error, | ||
1337 | .pure-button-warning, | ||
1338 | .pure-button-primary, | ||
1339 | .pure-button-shaarli, | ||
1340 | .pure-button-secondary { | ||
1341 | color: white !important; | ||
1342 | border-radius: 4px; | ||
1343 | text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2); | ||
1344 | } | ||
1345 | |||
1346 | .pure-button-shaarli { | ||
1347 | background-color: #1B926C; | ||
1348 | } | ||