aboutsummaryrefslogtreecommitdiffhomepage
path: root/themes/baggy/css
diff options
context:
space:
mode:
Diffstat (limited to 'themes/baggy/css')
-rwxr-xr-xthemes/baggy/css/main.css254
-rwxr-xr-xthemes/baggy/css/print.css14
2 files changed, 258 insertions, 10 deletions
diff --git a/themes/baggy/css/main.css b/themes/baggy/css/main.css
index 3e128b08..6d320cd2 100755
--- a/themes/baggy/css/main.css
+++ b/themes/baggy/css/main.css
@@ -173,21 +173,22 @@ h2:after {
173#links { 173#links {
174 position: fixed; 174 position: fixed;
175 top: 0; 175 top: 0;
176 width: 9em; 176 width: 10em;
177 left: 0; 177 left: 0;
178 text-align: right; 178 text-align: right;
179 background: #333; 179 background: #333;
180 padding-top: 9em; 180 padding-top: 9.5em;
181 height: 100%; 181 height: 100%;
182 box-shadow:inset -4px 0 20px rgba(0,0,0,0.6); 182 box-shadow:inset -4px 0 20px rgba(0,0,0,0.6);
183 z-index: 10; 183 z-index: 10;
184} 184}
185 185
186#main { 186#main {
187 margin-left: 12em; 187 margin-left: 13em;
188 position: relative; 188 position: relative;
189 z-index: 10; 189 z-index: 10;
190 padding-right: 5%; 190 padding-right: 5%;
191 padding-bottom: 1em;
191} 192}
192 193
193 #links a { 194 #links a {
@@ -227,7 +228,7 @@ h2:after {
227 #links li:last-child { 228 #links li:last-child {
228 position: fixed; 229 position: fixed;
229 bottom: 1em; 230 bottom: 1em;
230 width: 10%; 231 width: 10em;
231 } 232 }
232 233
233 #links li:last-child a:before { 234 #links li:last-child a:before {
@@ -237,6 +238,61 @@ h2:after {
237 } 238 }
238 239
239 240
241#sort {
242 padding: 0;
243 list-style-type: none;
244 opacity: 0.5;
245 display: inline-block;
246}
247
248#sort li {
249 display: inline;
250 font-size: 0.9em;
251}
252
253#sort li + li {
254 margin-left: 10px;
255}
256
257#sort a {
258 padding: 2px 2px 0;
259 vertical-align: middle;
260}
261
262#sort img {
263 vertical-align: baseline;
264}
265#sort img:hover {
266 cursor: pointer;
267}
268
269#display-mode {
270 float: right;
271 vertical-align: middle;
272 margin-top: 10px;
273 margin-bottom: 10px;
274 opacity: 0.5;
275}
276#listmode {
277 width: 16px;
278 display: inline-block;
279 text-decoration: none;
280}
281#listmode a:hover {
282 opacity: 1;
283}
284.tablemode {
285 background-image: url("../img/baggy/table.png");
286 background-repeat: no-repeat;
287 background-position: bottom;
288}
289.listmode {
290 background-image: url("../img/baggy/list.png");
291 background-repeat: no-repeat;
292 background-position: bottom;
293}
294
295
240/* ========================================================================== 296/* ==========================================================================
241 2 = Layout 297 2 = Layout
242 ========================================================================== */ 298 ========================================================================== */
@@ -248,7 +304,7 @@ h2:after {
248 304
249footer { 305footer {
250 text-align: right; 306 text-align: right;
251 position: fixed; 307 position: relative;
252 bottom: 0; 308 bottom: 0;
253 right: 5em; 309 right: 5em;
254 color: #999; 310 color: #999;
@@ -266,6 +322,15 @@ footer a {
266 letter-spacing:-5px; 322 letter-spacing:-5px;
267} 323}
268 324
325.listmode .entrie {
326 width: 100%!important;
327 margin-left: 0!important;
328}
329
330.listmode .entrie p {
331 display: none;
332}
333
269.list-entries + .results { 334.list-entries + .results {
270 margin-bottom: 2em; 335 margin-bottom: 2em;
271} 336}
@@ -359,6 +424,7 @@ footer a {
359 content: none; 424 content: none;
360 } 425 }
361 426
427
362.entrie h2 a { 428.entrie h2 a {
363 display: block; 429 display: block;
364 text-decoration: none; 430 text-decoration: none;
@@ -370,7 +436,7 @@ footer a {
370 -o-transition: all 0.5s ease; 436 -o-transition: all 0.5s ease;
371 transition: all 0.5s ease; 437 transition: all 0.5s ease;
372} 438}
373 439/*
374.entrie h2 a:after { 440.entrie h2 a:after {
375 content: ""; 441 content: "";
376 position: absolute; 442 position: absolute;
@@ -379,6 +445,7 @@ footer a {
379 height: 100%; 445 height: 100%;
380 left: 0; 446 left: 0;
381} 447}
448*/
382 449
383.entrie p { 450.entrie p {
384 color: #666; 451 color: #666;
@@ -442,6 +509,7 @@ footer a {
442 509
443.pagination { 510.pagination {
444 text-align: right; 511 text-align: right;
512 margin-bottom:50px;
445} 513}
446 514
447.nb-results { 515.nb-results {
@@ -469,6 +537,153 @@ footer a {
469} 537}
470 538
471/* ========================================================================== 539/* ==========================================================================
540 2.1 = "save a link" related styles
541 ========================================================================== */
542
543#bagit-form, #search-form {
544 background: rgba(0,0,0,0.5);
545 position: absolute;
546 top: 0;
547 left: 10em;
548 z-index: 20;
549 height: 100%;
550 width: 100%;
551 margin: 0;
552 margin-top: -30%;
553 padding: 2em;
554 display: none;
555 border-left: 1px #EEE solid;
556}
557
558#bagit-form form, #search-form form {
559 background: #FFF;
560 position: absolute;
561 top: 0;
562 left: 0;
563 z-index: 20;
564 border: 10px solid #000;
565 width: 400px;
566 height: 200px;
567 /* margin: -150px 0 0 -300px; */
568 padding: 2em;
569}
570
571a#bagit-form-close, a#search-form-close {
572 background: #000;
573 color: #FFF;
574 padding: 0.2em 0.5em;
575 text-decoration: none;
576 display: inline-block;
577 float: right;
578 font-size: 0.6em;
579}
580a#bagit-form-close:hover, a#search-form-close:hover {
581 background: #999;
582 color: #000;
583}
584
585.active-current {
586 background-color: #999;
587}
588
589.active-current:after {
590 content: "";
591 width: 0;
592 height: 0;
593 position: absolute;
594 border-style: solid;
595 border-width: 10px;
596 border-color: transparent #EEE transparent transparent;
597 right: 0;
598 top: 50%;
599 margin-top: -10px;
600}
601
602.opacity03 {
603 opacity: 0.3;
604}
605
606.add-to-wallabag-link-after {
607 background-color: #000;
608 color: #fff;
609 padding: 0 3px 2px 3px;
610}
611
612a.add-to-wallabag-link-after {
613 visibility: hidden;
614 position: absolute;
615 opacity: 0;
616 transition-duration: 2s;
617 transition-timing-function: ease-out;
618}
619
620#article article a:hover + a.add-to-wallabag-link-after, a.add-to-wallabag-link-after:hover {
621 opacity: 1;
622 visibility: visible;
623 transition-duration: .3s;
624 transition-timing-function: ease-in;
625}
626
627a.add-to-wallabag-link-after:after {
628 content: "w";
629}
630
631#add-link-result {
632 font-weight: bold;
633 margin-top: 10px;
634}
635
636/* ==========================================================================
637 2.2 = "search for articles" popup div related styles
638 ========================================================================== */
639#search-form {
640 background: rgba(0,0,0,0.5);
641 position: absolute;
642 top: 0;
643 left: 10em;
644 z-index: 20;
645 height: 100%;
646 width: 100%;
647 margin: 0;
648 margin-top: -30%;
649 padding: 2em;
650 display: none;
651 border-left: 1px #EEE solid;
652}
653
654#search-form form {
655 background: #FFF;
656 position: absolute;
657 top: 0;
658 left: 0;
659 z-index: 20;
660 border: 10px solid #000;
661 width: 400px;
662 height: 200px;
663 /* margin: -150px 0 0 -300px; */
664 padding: 2em;
665}
666
667a#search-form-close {
668 background: #000;
669 color: #FFF;
670 padding: 0.2em 0.5em;
671 text-decoration: none;
672 display: inline-block;
673 float: right;
674 font-size: 1.2em;
675}
676a#search-form-close:hover {
677 background: #999;
678 color: #000;
679}
680
681#submit-search{
682margin-left: 4em;
683margin-top:1em;
684}
685
686/* ==========================================================================
472 3 = Pictos 687 3 = Pictos
473 ========================================================================== */ 688 ========================================================================== */
474 689
@@ -550,6 +765,9 @@ footer a {
550.icon-rss:before { 765.icon-rss:before {
551 content: "\e808"; 766 content: "\e808";
552} 767}
768.icon-print:before {
769 content: "\e80d";
770}
553 771
554/* ========================================================================== 772/* ==========================================================================
555 Icon selected 773 Icon selected
@@ -583,7 +801,7 @@ footer a {
583 } 801 }
584 802
585.warning { 803.warning {
586 font-size: 3em; 804 /* font-size: 3em;
587 color: #999; 805 color: #999;
588 font-style: italic; 806 font-style: italic;
589 position: absolute; 807 position: absolute;
@@ -592,7 +810,10 @@ footer a {
592 width: 100%; 810 width: 100%;
593 text-align: center; 811 text-align: center;
594 padding-right: 5%; 812 padding-right: 5%;
595 margin-top: -2em; 813 margin-top: -2em;*/
814 font-weight: bold;
815 display: block;
816 width: 100%;
596} 817}
597 818
598/* ========================================================================== 819/* ==========================================================================
@@ -602,6 +823,7 @@ footer a {
602#article { 823#article {
603 width: 70%; 824 width: 70%;
604 margin-bottom: 3em; 825 margin-bottom: 3em;
826 text-align: justify;
605} 827}
606 828
607#article .tags { 829#article .tags {
@@ -731,6 +953,9 @@ blockquote {
731 width: 100%; 953 width: 100%;
732 margin-left: 0; 954 margin-left: 0;
733 } 955 }
956 #display-mode {
957 display: none;
958 }
734} 959}
735 960
736@media screen and (max-width: 500px) { 961@media screen and (max-width: 500px) {
@@ -754,8 +979,8 @@ blockquote {
754 content: none; 979 content: none;
755 } 980 }
756 .logo { 981 .logo {
757 width: 1.5em; 982 width: 1.25em;
758 height: 1.5em; 983 height: 1.25em;
759 left: 0; 984 left: 0;
760 top: 0; 985 top: 0;
761 } 986 }
@@ -805,6 +1030,7 @@ blockquote {
805 margin-left: 1.5em; 1030 margin-left: 1.5em;
806 padding-right: 1.5em; 1031 padding-right: 1.5em;
807 position: static; 1032 position: static;
1033 margin-top: 3em;
808 } 1034 }
809 #article_toolbar .topPosF { 1035 #article_toolbar .topPosF {
810 display: none; 1036 display: none;
@@ -820,4 +1046,12 @@ blockquote {
820 #article_toolbar a { 1046 #article_toolbar a {
821 padding: 0.3em 0.4em 0.2em; 1047 padding: 0.3em 0.4em 0.2em;
822 } 1048 }
1049
1050 #display-mode {
1051 display: none;
1052 }
1053
1054 #bagit-form, #search-form {
1055 left: 0;
1056 }
823} 1057}
diff --git a/themes/baggy/css/print.css b/themes/baggy/css/print.css
index 9aefa779..9dd6d295 100755
--- a/themes/baggy/css/print.css
+++ b/themes/baggy/css/print.css
@@ -17,6 +17,7 @@ img {
17 17
18/* Hide useless blocks */ 18/* Hide useless blocks */
19body > header, 19body > header,
20#article_toolbar,
20#links, 21#links,
21#sort, 22#sort,
22body > footer, 23body > footer,
@@ -46,3 +47,16 @@ abbr[title]:after {
46.pagination span.current { 47.pagination span.current {
47 border-style: dashed; 48 border-style: dashed;
48} 49}
50
51#main {
52 width: 100%;
53 padding: 0;
54 margin: 0;
55 margin-left: 0;
56 padding-right: 0;
57 padding-bottom: 0;
58}
59
60#article {
61 width: 100%;
62}