diff options
Diffstat (limited to 'themes/baggy/css')
-rwxr-xr-x | themes/baggy/css/main.css | 144 |
1 files changed, 64 insertions, 80 deletions
diff --git a/themes/baggy/css/main.css b/themes/baggy/css/main.css index ce30cb5a..028c8b4e 100755 --- a/themes/baggy/css/main.css +++ b/themes/baggy/css/main.css | |||
@@ -70,7 +70,7 @@ h2, h3, h4 { | |||
70 | text-transform: uppercase; | 70 | text-transform: uppercase; |
71 | } | 71 | } |
72 | 72 | ||
73 | p, li { | 73 | p, li, label { |
74 | color: #666; | 74 | color: #666; |
75 | } | 75 | } |
76 | 76 | ||
@@ -92,7 +92,6 @@ form fieldset { | |||
92 | form input[type="text"], select, form input[type="password"], form input[type="url"], form input[type="email"] { | 92 | form input[type="text"], select, form input[type="password"], form input[type="url"], form input[type="email"] { |
93 | border: 1px solid #999; | 93 | border: 1px solid #999; |
94 | padding: 0.5em 1em; | 94 | padding: 0.5em 1em; |
95 | margin-left: 5px; | ||
96 | min-width: 12em; | 95 | min-width: 12em; |
97 | color: #666; | 96 | color: #666; |
98 | } | 97 | } |
@@ -105,10 +104,6 @@ form input[type="text"], select, form input[type="password"], form input[type="u | |||
105 | } | 104 | } |
106 | } | 105 | } |
107 | 106 | ||
108 | fieldset label { | ||
109 | min-width: 12.5em; | ||
110 | } | ||
111 | |||
112 | .inline .row { | 107 | .inline .row { |
113 | display: inline-block; | 108 | display: inline-block; |
114 | margin-right: 0.5em; | 109 | margin-right: 0.5em; |
@@ -120,10 +115,14 @@ fieldset label { | |||
120 | 115 | ||
121 | fieldset label { | 116 | fieldset label { |
122 | display: inline-block; | 117 | display: inline-block; |
123 | margin-right: 0.5em; | 118 | min-width: 12.5em; |
124 | color: #666; | 119 | color: #666; |
125 | } | 120 | } |
126 | 121 | ||
122 | label { | ||
123 | margin-right: 0.5em; | ||
124 | } | ||
125 | |||
127 | form .row { | 126 | form .row { |
128 | margin-bottom: 0.5em; | 127 | margin-bottom: 0.5em; |
129 | } | 128 | } |
@@ -282,12 +281,12 @@ h2:after { | |||
282 | #listmode a:hover { | 281 | #listmode a:hover { |
283 | opacity: 1; | 282 | opacity: 1; |
284 | } | 283 | } |
285 | .tablemode { | 284 | #listmode.tablemode { |
286 | background-image: url("../img/baggy/table.png"); | 285 | background-image: url("../img/baggy/table.png"); |
287 | background-repeat: no-repeat; | 286 | background-repeat: no-repeat; |
288 | background-position: bottom; | 287 | background-position: bottom; |
289 | } | 288 | } |
290 | .listmode { | 289 | #listmode.listmode { |
291 | background-image: url("../img/baggy/list.png"); | 290 | background-image: url("../img/baggy/list.png"); |
292 | background-repeat: no-repeat; | 291 | background-repeat: no-repeat; |
293 | background-position: bottom; | 292 | background-position: bottom; |
@@ -332,7 +331,7 @@ footer a { | |||
332 | margin-bottom: 2em; | 331 | margin-bottom: 2em; |
333 | } | 332 | } |
334 | 333 | ||
335 | .estimatedTime a { | 334 | .estimatedTime .reading-time { |
336 | color: #999; | 335 | color: #999; |
337 | font-style: italic; | 336 | font-style: italic; |
338 | font-weight: normal; | 337 | font-weight: normal; |
@@ -419,6 +418,7 @@ footer a { | |||
419 | .entrie h2 { | 418 | .entrie h2 { |
420 | text-transform: none; | 419 | text-transform: none; |
421 | margin-bottom: 0; | 420 | margin-bottom: 0; |
421 | line-height: 1.2; | ||
422 | } | 422 | } |
423 | 423 | ||
424 | .entrie h2:after { | 424 | .entrie h2:after { |
@@ -541,7 +541,7 @@ footer a { | |||
541 | 2.1 = "save a link" related styles | 541 | 2.1 = "save a link" related styles |
542 | ========================================================================== */ | 542 | ========================================================================== */ |
543 | 543 | ||
544 | #bagit-form, #search-form { | 544 | .popup-form { |
545 | background: rgba(0,0,0,0.5); | 545 | background: rgba(0,0,0,0.5); |
546 | position: absolute; | 546 | position: absolute; |
547 | top: 0; | 547 | top: 0; |
@@ -550,47 +550,54 @@ footer a { | |||
550 | height: 100%; | 550 | height: 100%; |
551 | width: 100%; | 551 | width: 100%; |
552 | margin: 0; | 552 | margin: 0; |
553 | margin-top: -30%; | 553 | margin-top: -30% !important; /* TODO: get rid of !important here; overridden by .messages selector */ |
554 | padding: 2em; | 554 | padding: 2em; |
555 | display: none; | 555 | display: none; |
556 | border-left: 1px #EEE solid; | 556 | border-left: 1px #EEE solid; |
557 | } | 557 | } |
558 | 558 | ||
559 | #bagit-form form, #search-form form { | 559 | .popup-form form { |
560 | background: #FFF; | 560 | background: #FFF; |
561 | position: absolute; | 561 | position: absolute; |
562 | top: 0; | 562 | top: 0; |
563 | left: 0; | 563 | left: 0; |
564 | z-index: 20; | 564 | z-index: 20; |
565 | border: 10px solid #000; | 565 | border: 10px solid #000; |
566 | width: 400px; | 566 | width: 400px; |
567 | height: 200px; | 567 | height: 200px; |
568 | /* margin: -150px 0 0 -300px; */ | 568 | padding: 2em; |
569 | padding: 2em; | 569 | } |
570 | } | ||
571 | 570 | ||
572 | #bagit-form-form .addurl { | 571 | #bagit-form-form .addurl { |
573 | margin-left: 0; | 572 | margin-left: 0; |
574 | } | 573 | } |
575 | 574 | ||
576 | .popup-close { | 575 | .closeMessage, |
576 | .close-button { | ||
577 | background: #000; | 577 | background: #000; |
578 | color: #FFF; | 578 | color: #FFF; |
579 | font-size: 1.4em; | 579 | font-size: 1.2em; |
580 | line-height: 1.6em; | 580 | line-height: 1.6; |
581 | width: 1.6em; | 581 | width: 1.6em; |
582 | height: 1.6em; | 582 | height: 1.6em; |
583 | text-align: center; | 583 | text-align: center; |
584 | text-decoration: none; | 584 | text-decoration: none; |
585 | } | ||
586 | .closeMessage:hover, | ||
587 | .closeMessage:focus, | ||
588 | .close-button:hover, | ||
589 | .close-button:focus { | ||
590 | background: #999; | ||
591 | color: #000; | ||
592 | } | ||
593 | |||
594 | .close-button--popup { | ||
585 | display: inline-block; | 595 | display: inline-block; |
586 | position: absolute; | 596 | position: absolute; |
587 | top: 0; | 597 | top: 0; |
588 | right: 0; | 598 | right: 0; |
599 | font-size: 1.4em; | ||
589 | } | 600 | } |
590 | .popup-close:hover { | ||
591 | background: #999; | ||
592 | color: #000; | ||
593 | } | ||
594 | 601 | ||
595 | .active-current { | 602 | .active-current { |
596 | background-color: #999; | 603 | background-color: #999; |
@@ -644,42 +651,6 @@ a.add-to-wallabag-link-after:after { | |||
644 | } | 651 | } |
645 | 652 | ||
646 | /* ========================================================================== | 653 | /* ========================================================================== |
647 | 2.2 = "search for articles" popup div related styles | ||
648 | ========================================================================== */ | ||
649 | #search-form { | ||
650 | background: rgba(0,0,0,0.5); | ||
651 | position: absolute; | ||
652 | top: 0; | ||
653 | left: 10em; | ||
654 | z-index: 20; | ||
655 | height: 100%; | ||
656 | width: 100%; | ||
657 | margin: 0; | ||
658 | margin-top: -30%; | ||
659 | padding: 2em; | ||
660 | display: none; | ||
661 | border-left: 1px #EEE solid; | ||
662 | } | ||
663 | |||
664 | #search-form form { | ||
665 | background: #FFF; | ||
666 | position: absolute; | ||
667 | top: 0; | ||
668 | left: 0; | ||
669 | z-index: 20; | ||
670 | border: 10px solid #000; | ||
671 | width: 400px; | ||
672 | height: 200px; | ||
673 | /* margin: -150px 0 0 -300px; */ | ||
674 | padding: 2em; | ||
675 | } | ||
676 | |||
677 | #submit-search{ | ||
678 | margin-left: 4em; | ||
679 | margin-top:1em; | ||
680 | } | ||
681 | |||
682 | /* ========================================================================== | ||
683 | 3 = Pictos | 654 | 3 = Pictos |
684 | ========================================================================== */ | 655 | ========================================================================== */ |
685 | 656 | ||
@@ -788,18 +759,6 @@ margin-top:1em; | |||
788 | 759 | ||
789 | .messages > * { display: inline-block;} | 760 | .messages > * { display: inline-block;} |
790 | 761 | ||
791 | .closeMessage { | ||
792 | background: #000; | ||
793 | color: #FFF; | ||
794 | padding: 0.2em 0.5em; | ||
795 | text-decoration: none; | ||
796 | } | ||
797 | |||
798 | .closeMessage:hover, .closeMessage:focus { | ||
799 | background: #FFF; | ||
800 | color: #000; | ||
801 | } | ||
802 | |||
803 | .warning { | 762 | .warning { |
804 | /* font-size: 3em; | 763 | /* font-size: 3em; |
805 | color: #999; | 764 | color: #999; |
@@ -816,6 +775,16 @@ margin-top:1em; | |||
816 | width: 100%; | 775 | width: 100%; |
817 | } | 776 | } |
818 | 777 | ||
778 | .more-info { | ||
779 | font-size: 0.85em; | ||
780 | line-height: 1.5; | ||
781 | color: #aaa; | ||
782 | } | ||
783 | |||
784 | .more-info a { | ||
785 | color: #aaa; | ||
786 | } | ||
787 | |||
819 | /* ========================================================================== | 788 | /* ========================================================================== |
820 | 5 = Article | 789 | 5 = Article |
821 | ========================================================================== */ | 790 | ========================================================================== */ |
@@ -841,6 +810,10 @@ blockquote { | |||
841 | margin: 0; | 810 | margin: 0; |
842 | } | 811 | } |
843 | 812 | ||
813 | #article h1 { | ||
814 | text-align: left; | ||
815 | } | ||
816 | |||
844 | #article h2, #article h3, #article h4 { | 817 | #article h2, #article h3, #article h4 { |
845 | text-transform: none; | 818 | text-transform: none; |
846 | } | 819 | } |
@@ -1029,6 +1002,9 @@ pre code { | |||
1029 | height: auto; | 1002 | height: auto; |
1030 | padding-top: 3em; | 1003 | padding-top: 3em; |
1031 | } | 1004 | } |
1005 | #links.menu--open { | ||
1006 | display: block; | ||
1007 | } | ||
1032 | footer { | 1008 | footer { |
1033 | position: static; | 1009 | position: static; |
1034 | margin-right: 3em; | 1010 | margin-right: 3em; |
@@ -1058,8 +1034,16 @@ pre code { | |||
1058 | display: none; | 1034 | display: none; |
1059 | } | 1035 | } |
1060 | 1036 | ||
1061 | #bagit-form, #search-form { | 1037 | .popup-form, #bagit-form, #search-form { |
1062 | left: 0; | 1038 | left: 0; |
1039 | width: 100%; | ||
1040 | border-left: none; | ||
1041 | } | ||
1042 | |||
1043 | .popup-form form, | ||
1044 | #bagit-form form, | ||
1045 | #search-form form { | ||
1046 | width: 100%; | ||
1063 | } | 1047 | } |
1064 | } | 1048 | } |
1065 | 1049 | ||