diff options
author | Nicolas LÅ“uillet <nicolas@loeuillet.org> | 2014-11-15 20:48:49 +0100 |
---|---|---|
committer | Nicolas LÅ“uillet <nicolas@loeuillet.org> | 2014-11-15 20:48:49 +0100 |
commit | 153237671001225dea40957e33e67fe16e6124fc (patch) | |
tree | 4f5ec06050233f9cd5740904785edcbc65eb2cd9 /themes/baggy/css/main.css | |
parent | 44d35257e805856b4913c63fcbed3c0acb64bae8 (diff) | |
parent | d3122db7b267b384cd70f368328a9ed024719135 (diff) | |
download | wallabag-1.8.1.tar.gz wallabag-1.8.1.tar.zst wallabag-1.8.1.zip |
Merge pull request #932 from wallabag/dev1.8.1
1.8.1
Diffstat (limited to 'themes/baggy/css/main.css')
-rwxr-xr-x | themes/baggy/css/main.css | 194 |
1 files changed, 89 insertions, 105 deletions
diff --git a/themes/baggy/css/main.css b/themes/baggy/css/main.css index b775a291..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 | ||
@@ -104,10 +104,6 @@ form input[type="text"], select, form input[type="password"], form input[type="u | |||
104 | } | 104 | } |
105 | } | 105 | } |
106 | 106 | ||
107 | fieldset label { | ||
108 | min-width: 12.5em; | ||
109 | } | ||
110 | |||
111 | .inline .row { | 107 | .inline .row { |
112 | display: inline-block; | 108 | display: inline-block; |
113 | margin-right: 0.5em; | 109 | margin-right: 0.5em; |
@@ -119,10 +115,14 @@ fieldset label { | |||
119 | 115 | ||
120 | fieldset label { | 116 | fieldset label { |
121 | display: inline-block; | 117 | display: inline-block; |
122 | margin-right: 0.5em; | 118 | min-width: 12.5em; |
123 | color: #666; | 119 | color: #666; |
124 | } | 120 | } |
125 | 121 | ||
122 | label { | ||
123 | margin-right: 0.5em; | ||
124 | } | ||
125 | |||
126 | form .row { | 126 | form .row { |
127 | margin-bottom: 0.5em; | 127 | margin-bottom: 0.5em; |
128 | } | 128 | } |
@@ -180,7 +180,7 @@ h2:after { | |||
180 | padding-top: 9.5em; | 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: 15; |
184 | } | 184 | } |
185 | 185 | ||
186 | #main { | 186 | #main { |
@@ -191,7 +191,7 @@ h2:after { | |||
191 | padding-bottom: 1em; | 191 | padding-bottom: 1em; |
192 | } | 192 | } |
193 | 193 | ||
194 | #links a { | 194 | #links > li > a { |
195 | display: block; | 195 | display: block; |
196 | padding: 0.5em 2em 0.5em 1em; | 196 | padding: 0.5em 2em 0.5em 1em; |
197 | color: #FFF; | 197 | color: #FFF; |
@@ -207,7 +207,7 @@ h2:after { | |||
207 | transition: all 0.5s ease; | 207 | transition: all 0.5s ease; |
208 | } | 208 | } |
209 | 209 | ||
210 | #links a:hover, #links a:focus { | 210 | #links > li > a:hover, #links > li > a:focus { |
211 | background: #999; | 211 | background: #999; |
212 | color: #000; | 212 | color: #000; |
213 | } | 213 | } |
@@ -281,12 +281,12 @@ h2:after { | |||
281 | #listmode a:hover { | 281 | #listmode a:hover { |
282 | opacity: 1; | 282 | opacity: 1; |
283 | } | 283 | } |
284 | .tablemode { | 284 | #listmode.tablemode { |
285 | background-image: url("../img/baggy/table.png"); | 285 | background-image: url("../img/baggy/table.png"); |
286 | background-repeat: no-repeat; | 286 | background-repeat: no-repeat; |
287 | background-position: bottom; | 287 | background-position: bottom; |
288 | } | 288 | } |
289 | .listmode { | 289 | #listmode.listmode { |
290 | background-image: url("../img/baggy/list.png"); | 290 | background-image: url("../img/baggy/list.png"); |
291 | background-repeat: no-repeat; | 291 | background-repeat: no-repeat; |
292 | background-position: bottom; | 292 | background-position: bottom; |
@@ -327,15 +327,11 @@ footer a { | |||
327 | margin-left: 0!important; | 327 | margin-left: 0!important; |
328 | } | 328 | } |
329 | 329 | ||
330 | .listmode .entrie p { | ||
331 | display: none; | ||
332 | } | ||
333 | |||
334 | .list-entries + .results { | 330 | .list-entries + .results { |
335 | margin-bottom: 2em; | 331 | margin-bottom: 2em; |
336 | } | 332 | } |
337 | 333 | ||
338 | .estimatedTime a { | 334 | .estimatedTime .reading-time { |
339 | color: #999; | 335 | color: #999; |
340 | font-style: italic; | 336 | font-style: italic; |
341 | font-weight: normal; | 337 | font-weight: normal; |
@@ -359,11 +355,15 @@ footer a { | |||
359 | position: relative; | 355 | position: relative; |
360 | overflow: hidden; | 356 | overflow: hidden; |
361 | padding: 1.5em 1.5em 3em 1.5em; | 357 | padding: 1.5em 1.5em 3em 1.5em; |
362 | -webkit-transition: all 0.5s ease; | 358 | |
363 | -moz-transition: all 0.5s ease; | 359 | /* Removing CSS transitions because they make the switch from list view to |
364 | -ms-transition: all 0.5s ease; | 360 | * table view jerky |
365 | -o-transition: all 0.5s ease; | 361 | */ |
366 | transition: all 0.5s ease; | 362 | /* -webkit-transition: all 0.5s ease; */ |
363 | /* -moz-transition: all 0.5s ease; */ | ||
364 | /* -ms-transition: all 0.5s ease; */ | ||
365 | /* -o-transition: all 0.5s ease; */ | ||
366 | /* transition: all 0.5s ease; */ | ||
367 | } | 367 | } |
368 | 368 | ||
369 | .entrie:before { | 369 | .entrie:before { |
@@ -418,6 +418,7 @@ footer a { | |||
418 | .entrie h2 { | 418 | .entrie h2 { |
419 | text-transform: none; | 419 | text-transform: none; |
420 | margin-bottom: 0; | 420 | margin-bottom: 0; |
421 | line-height: 1.2; | ||
421 | } | 422 | } |
422 | 423 | ||
423 | .entrie h2:after { | 424 | .entrie h2:after { |
@@ -540,7 +541,7 @@ footer a { | |||
540 | 2.1 = "save a link" related styles | 541 | 2.1 = "save a link" related styles |
541 | ========================================================================== */ | 542 | ========================================================================== */ |
542 | 543 | ||
543 | #bagit-form, #search-form { | 544 | .popup-form { |
544 | background: rgba(0,0,0,0.5); | 545 | background: rgba(0,0,0,0.5); |
545 | position: absolute; | 546 | position: absolute; |
546 | top: 0; | 547 | top: 0; |
@@ -549,37 +550,53 @@ footer a { | |||
549 | height: 100%; | 550 | height: 100%; |
550 | width: 100%; | 551 | width: 100%; |
551 | margin: 0; | 552 | margin: 0; |
552 | margin-top: -30%; | 553 | margin-top: -30% !important; /* TODO: get rid of !important here; overridden by .messages selector */ |
553 | padding: 2em; | 554 | padding: 2em; |
554 | display: none; | 555 | display: none; |
555 | border-left: 1px #EEE solid; | 556 | border-left: 1px #EEE solid; |
556 | } | 557 | } |
557 | 558 | ||
558 | #bagit-form form, #search-form form { | 559 | .popup-form form { |
559 | background: #FFF; | 560 | background: #FFF; |
560 | position: absolute; | 561 | position: absolute; |
561 | top: 0; | 562 | top: 0; |
562 | left: 0; | 563 | left: 0; |
563 | z-index: 20; | 564 | z-index: 20; |
564 | border: 10px solid #000; | 565 | border: 10px solid #000; |
565 | width: 400px; | 566 | width: 400px; |
566 | height: 200px; | 567 | height: 200px; |
567 | /* margin: -150px 0 0 -300px; */ | 568 | padding: 2em; |
568 | padding: 2em; | 569 | } |
570 | |||
571 | #bagit-form-form .addurl { | ||
572 | margin-left: 0; | ||
569 | } | 573 | } |
570 | 574 | ||
571 | a#bagit-form-close, a#search-form-close { | 575 | .closeMessage, |
576 | .close-button { | ||
572 | background: #000; | 577 | background: #000; |
573 | color: #FFF; | 578 | color: #FFF; |
574 | padding: 0.2em 0.5em; | 579 | font-size: 1.2em; |
580 | line-height: 1.6; | ||
581 | width: 1.6em; | ||
582 | height: 1.6em; | ||
583 | text-align: center; | ||
575 | text-decoration: none; | 584 | text-decoration: none; |
576 | display: inline-block; | ||
577 | float: right; | ||
578 | font-size: 0.6em; | ||
579 | } | 585 | } |
580 | a#bagit-form-close:hover, a#search-form-close:hover { | 586 | .closeMessage:hover, |
581 | background: #999; | 587 | .closeMessage:focus, |
582 | color: #000; | 588 | .close-button:hover, |
589 | .close-button:focus { | ||
590 | background: #999; | ||
591 | color: #000; | ||
592 | } | ||
593 | |||
594 | .close-button--popup { | ||
595 | display: inline-block; | ||
596 | position: absolute; | ||
597 | top: 0; | ||
598 | right: 0; | ||
599 | font-size: 1.4em; | ||
583 | } | 600 | } |
584 | 601 | ||
585 | .active-current { | 602 | .active-current { |
@@ -634,56 +651,6 @@ a.add-to-wallabag-link-after:after { | |||
634 | } | 651 | } |
635 | 652 | ||
636 | /* ========================================================================== | 653 | /* ========================================================================== |
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 | |||
667 | a#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 | } | ||
676 | a#search-form-close:hover { | ||
677 | background: #999; | ||
678 | color: #000; | ||
679 | } | ||
680 | |||
681 | #submit-search{ | ||
682 | margin-left: 4em; | ||
683 | margin-top:1em; | ||
684 | } | ||
685 | |||
686 | /* ========================================================================== | ||
687 | 3 = Pictos | 654 | 3 = Pictos |
688 | ========================================================================== */ | 655 | ========================================================================== */ |
689 | 656 | ||
@@ -777,6 +744,10 @@ margin-top:1em; | |||
777 | color: #FFF; | 744 | color: #FFF; |
778 | } | 745 | } |
779 | 746 | ||
747 | .icon-check.archive:before { | ||
748 | color: #FFF; | ||
749 | } | ||
750 | |||
780 | /* ========================================================================== | 751 | /* ========================================================================== |
781 | 4 = Messages | 752 | 4 = Messages |
782 | ========================================================================== */ | 753 | ========================================================================== */ |
@@ -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 | ||