diff options
Diffstat (limited to 'app/Resources/static/themes/material/css/main.css')
-rwxr-xr-x | app/Resources/static/themes/material/css/main.css | 167 |
1 files changed, 153 insertions, 14 deletions
diff --git a/app/Resources/static/themes/material/css/main.css b/app/Resources/static/themes/material/css/main.css index 408fe14c..ee4ad4e0 100755 --- a/app/Resources/static/themes/material/css/main.css +++ b/app/Resources/static/themes/material/css/main.css | |||
@@ -150,6 +150,11 @@ | |||
150 | background-image: url("../../_global/img/icons/diaspora-icon--black.png"); | 150 | background-image: url("../../_global/img/icons/diaspora-icon--black.png"); |
151 | } | 151 | } |
152 | 152 | ||
153 | /* Unmark.it */ | ||
154 | .icon-image--unmark { | ||
155 | background-image: url("../../_global/img/icons/unmark-icon--black.png"); | ||
156 | } | ||
157 | |||
153 | /* Shaarli */ | 158 | /* Shaarli */ |
154 | .icon-image--shaarli { | 159 | .icon-image--shaarli { |
155 | background-image: url("../../_global/img/icons/shaarli.png"); | 160 | background-image: url("../../_global/img/icons/shaarli.png"); |
@@ -159,7 +164,7 @@ body { | |||
159 | display: flex; | 164 | display: flex; |
160 | min-height: 100vh; | 165 | min-height: 100vh; |
161 | flex-direction: column; | 166 | flex-direction: column; |
162 | background: #f0f0f0; | 167 | background: #fafafa; |
163 | } | 168 | } |
164 | 169 | ||
165 | body.login main { | 170 | body.login main { |
@@ -189,7 +194,6 @@ main, | |||
189 | 194 | ||
190 | .results { | 195 | .results { |
191 | height: 1em; | 196 | height: 1em; |
192 | line-height: 30px; | ||
193 | } | 197 | } |
194 | 198 | ||
195 | .results .nb-results, | 199 | .results .nb-results, |
@@ -198,6 +202,14 @@ main, | |||
198 | margin-bottom: 0; | 202 | margin-bottom: 0; |
199 | } | 203 | } |
200 | 204 | ||
205 | .results .nb-results { | ||
206 | display: inline-flex; | ||
207 | } | ||
208 | |||
209 | .results a { | ||
210 | color: #444; | ||
211 | } | ||
212 | |||
201 | .pagination { | 213 | .pagination { |
202 | float: right; | 214 | float: right; |
203 | } | 215 | } |
@@ -271,6 +283,17 @@ nav input { | |||
271 | color: #aaa; | 283 | color: #aaa; |
272 | } | 284 | } |
273 | 285 | ||
286 | nav { | ||
287 | height: auto; | ||
288 | } | ||
289 | |||
290 | .nav-wrapper { | ||
291 | display: flex; | ||
292 | flex-wrap: wrap; | ||
293 | justify-content: space-between; | ||
294 | min-height: 64px; | ||
295 | } | ||
296 | |||
274 | .nav-wrapper .button-collapse { | 297 | .nav-wrapper .button-collapse { |
275 | padding: 0 15px; | 298 | padding: 0 15px; |
276 | } | 299 | } |
@@ -279,8 +302,10 @@ nav input { | |||
279 | display: none; | 302 | display: none; |
280 | } | 303 | } |
281 | 304 | ||
282 | .nav-panels { | 305 | .nav-panel-buttom { |
283 | overflow: hidden; | 306 | display: flex; |
307 | flex-grow: 1; | ||
308 | justify-content: flex-end; | ||
284 | } | 309 | } |
285 | 310 | ||
286 | .nav-panel-buttom li { | 311 | .nav-panel-buttom li { |
@@ -317,11 +342,13 @@ nav input { | |||
317 | color: #444; | 342 | color: #444; |
318 | } | 343 | } |
319 | 344 | ||
320 | .input-field.nav-panel-add label { | 345 | .input-field.nav-panel-add label, |
346 | .input-field.nav-panel-search label { | ||
321 | left: 1rem; | 347 | left: 1rem; |
322 | } | 348 | } |
323 | 349 | ||
324 | .input-field.nav-panel-add .close { | 350 | .input-field.nav-panel-add .close, |
351 | .input-field.nav-panel-search .close { | ||
325 | position: absolute; | 352 | position: absolute; |
326 | top: 0; | 353 | top: 0; |
327 | right: 1rem; | 354 | right: 1rem; |
@@ -340,8 +367,11 @@ nav input { | |||
340 | } | 367 | } |
341 | 368 | ||
342 | .input-field.nav-panel-add, | 369 | .input-field.nav-panel-add, |
343 | .input-field.nav-panel-add form { | 370 | .input-field.nav-panel-add form, |
344 | height: 100%; | 371 | .input-field.nav-panel-search, |
372 | .input-field.nav-panel-search form { | ||
373 | display: flex; | ||
374 | flex: 1; | ||
345 | } | 375 | } |
346 | 376 | ||
347 | /* ========================================================================== | 377 | /* ========================================================================== |
@@ -411,7 +441,6 @@ nav ul a:hover { | |||
411 | .side-nav.fixed.right-aligned { | 441 | .side-nav.fixed.right-aligned { |
412 | right: -250px; | 442 | right: -250px; |
413 | left: auto !important; | 443 | left: auto !important; |
414 | overflow-y: visible; | ||
415 | } | 444 | } |
416 | 445 | ||
417 | #filters div.with-checkbox { | 446 | #filters div.with-checkbox { |
@@ -535,6 +564,18 @@ a.original { | |||
535 | line-height: 24px; | 564 | line-height: 24px; |
536 | } | 565 | } |
537 | 566 | ||
567 | .card .card-action ul.tools li a.tool { | ||
568 | margin-right: 5px !important; | ||
569 | } | ||
570 | |||
571 | .card-stacked:hover ul.tools-list { | ||
572 | display: block; | ||
573 | } | ||
574 | |||
575 | .card-stacked ul.tools-list { | ||
576 | display: none; | ||
577 | } | ||
578 | |||
538 | .card .card-action a { | 579 | .card .card-action a { |
539 | color: #fff; | 580 | color: #fff; |
540 | margin: 0; | 581 | margin: 0; |
@@ -587,7 +628,55 @@ a.original { | |||
587 | #article { | 628 | #article { |
588 | font-size: 20px; | 629 | font-size: 20px; |
589 | margin: 0 auto; | 630 | margin: 0 auto; |
590 | max-width: 40em; | 631 | max-width: 45em; |
632 | } | ||
633 | |||
634 | #article article { | ||
635 | color: #424242; | ||
636 | font-size: 18px; | ||
637 | line-height: 1.7em; | ||
638 | } | ||
639 | |||
640 | #article article h1, | ||
641 | #article article h2, | ||
642 | #article article h3, | ||
643 | #article article h4, | ||
644 | #article article h5, | ||
645 | #article article h6 { | ||
646 | color: #212121; | ||
647 | } | ||
648 | |||
649 | #article article h1 strong, | ||
650 | #article article h2 strong, | ||
651 | #article article h3 strong, | ||
652 | #article article h4 strong, | ||
653 | #article article h5 strong, | ||
654 | #article article h6 strong { | ||
655 | font-weight: 500; | ||
656 | } | ||
657 | |||
658 | #article article h6 { | ||
659 | font-size: 1.2rem; | ||
660 | } | ||
661 | |||
662 | #article article h5 { | ||
663 | font-size: 1.6rem; | ||
664 | } | ||
665 | |||
666 | #article article h4 { | ||
667 | font-size: 1.9rem; | ||
668 | } | ||
669 | |||
670 | #article article h3 { | ||
671 | font-size: 2.2rem; | ||
672 | } | ||
673 | |||
674 | #article article h2 { | ||
675 | font-size: 2.5rem; | ||
676 | } | ||
677 | |||
678 | #article article h1 { | ||
679 | font-size: 2.7rem; | ||
591 | } | 680 | } |
592 | 681 | ||
593 | #article img, | 682 | #article img, |
@@ -596,6 +685,46 @@ a.original { | |||
596 | height: auto; | 685 | height: auto; |
597 | } | 686 | } |
598 | 687 | ||
688 | #article article a { | ||
689 | border-bottom: 1px dotted #03a9f4; | ||
690 | text-decoration: none; | ||
691 | } | ||
692 | |||
693 | #article article a:hover { | ||
694 | border-bottom-style: solid; | ||
695 | } | ||
696 | |||
697 | #article article ul { | ||
698 | padding-left: 30px; | ||
699 | } | ||
700 | |||
701 | #article article ul, | ||
702 | #article article ul li { | ||
703 | list-style-type: disc; | ||
704 | } | ||
705 | |||
706 | #article article blockquote { | ||
707 | font-style: italic; | ||
708 | } | ||
709 | |||
710 | #article article strong { | ||
711 | font-weight: bold; | ||
712 | } | ||
713 | |||
714 | #article article pre { | ||
715 | box-sizing: border-box; | ||
716 | margin: 0 0 1.75em; | ||
717 | border: #e3f2fd 1px solid; | ||
718 | width: 100%; | ||
719 | padding: 10px; | ||
720 | font-family: monospace; | ||
721 | font-size: 0.8em; | ||
722 | white-space: pre; | ||
723 | overflow: auto; | ||
724 | background: #f5f5f5; | ||
725 | border-radius: 3px; | ||
726 | } | ||
727 | |||
599 | #article > header > h1 { | 728 | #article > header > h1 { |
600 | font-size: 2em; | 729 | font-size: 2em; |
601 | margin: 2.1rem 0 0.68rem; | 730 | margin: 2.1rem 0 0.68rem; |
@@ -691,6 +820,14 @@ article aside .tools li { | |||
691 | width: auto; | 820 | width: auto; |
692 | } | 821 | } |
693 | 822 | ||
823 | .nav-panels .action { | ||
824 | padding-right: 0.75rem; | ||
825 | } | ||
826 | |||
827 | .nav-panel-buttom { | ||
828 | justify-content: space-around; | ||
829 | } | ||
830 | |||
694 | #article { | 831 | #article { |
695 | max-width: 35em; | 832 | max-width: 35em; |
696 | margin-left: auto; | 833 | margin-left: auto; |
@@ -727,11 +864,13 @@ article aside .tools li { | |||
727 | .pagination li.next { | 864 | .pagination li.next { |
728 | width: auto; | 865 | width: auto; |
729 | } | 866 | } |
730 | } | ||
731 | 867 | ||
732 | @media only screen and (min-width: 400px) { | 868 | .drag-target + .drag-target { |
733 | .nav-panel-buttom { | 869 | height: 50%; |
734 | float: right; | 870 | } |
871 | |||
872 | .drag-target + .drag-target + .drag-target { | ||
873 | top: 50%; | ||
735 | } | 874 | } |
736 | } | 875 | } |
737 | 876 | ||