1 /* ==========================================================================
14 ========================================================================== */
16 /* ==========================================================================
18 ========================================================================== */
27 font-family: 'Material Icons';
30 src: url
(../fonts
/MaterialIcons-Regular
.eot
);
33 src: local
("Material Icons"), local
("MaterialIcons-Regular"), url
(../fonts
/MaterialIcons-Regular
.woff2
) format
("woff2"), url
(../fonts
/MaterialIcons-Regular
.woff
) format
("woff"), url
(../fonts
/MaterialIcons-Regular
.ttf
) format
("truetype");
37 font-family: 'Material Icons';
40 font-size: 24px; /* Preferred icon size */
43 display: inline-block
;
46 letter-spacing: normal
;
51 /* Support for all WebKit browsers. */
52 -webkit-font-smoothing: antialiased
;
54 /* Support for Safari and Chrome. */
55 text-rendering: optimizeLegibility
;
57 /* Support for Firefox. */
58 -moz-osx-font-smoothing: grayscale
;
61 font-feature-settings: 'liga';
64 /* Rules for sizing the icon. */
65 .material-icons.md-18 { font-size: 18px; }
66 .material-icons.md-24 { font-size: 24px; }
67 .material-icons.md-36 { font-size: 36px; }
68 .material-icons.md-48 { font-size: 48px; }
70 /* Rules for using icons as black on a light background. */
71 .material-icons.md-dark { color: rgba
(0, 0, 0, 0.54); }
72 .material-icons.md-dark.md-inactive { color: rgba
(0, 0, 0, 0.26); }
74 /* Rules for using icons as white on a dark background. */
75 .material-icons.md-light { color: rgba
(255, 255, 255, 1); }
76 .material-icons.md-light.md-inactive { color: rgba
(255, 255, 255, 0.3); }
86 src: url
("../fonts/IcoMoon-Free.ttf");
91 [class^
="icon-"]::before
,
92 [class
*=" icon-"]::before
{
100 background-size: 24px;
102 /* Enable Ligatures ================ */
104 -webkit-font-feature-settings: "liga";
105 -moz-font-feature-settings: "liga=1";
106 -moz-font-feature-settings: "liga";
107 -ms-font-feature-settings: "liga" 1;
108 -o-font-feature-settings: "liga";
109 font-feature-settings: "liga";
111 /* Better Font Rendering =========== */
112 -webkit-font-smoothing: antialiased
;
113 -moz-osx-font-smoothing: grayscale
;
117 background-size: 16px;
118 background-repeat: no-repeat
;
119 padding-right: 1em !important
;
120 padding-left: 1em !important
;
127 .icon-no-eye::before {
131 .icon-calendar::before {
143 /* Carrot (http://carrot.org) */
144 .icon-image--carrot {
145 background-image: url
("../../_global/img/icons/carrot-icon--black.png");
149 .icon-image--diaspora {
150 background-image: url
("../../_global/img/icons/diaspora-icon--black.png");
154 .icon-image--unmark {
155 background-image: url
("../../_global/img/icons/unmark-icon--black.png");
159 .icon-image--shaarli {
160 background-image: url
("../../_global/img/icons/shaarli.png");
164 .icon-image--scuttle {
165 background-image: url
("../../_global/img/icons/scuttle.png");
171 flex-direction: column
;
181 border-bottom: 1px solid
#ddd;
204 .results
.nb-results
,
205 .results .pagination {
210 .results .nb-results {
211 display: inline-flex
;
223 margin: 0 !important
;
236 .pagination .disabled {
241 div
.pagination ul
.prev
.disabled
,
242 div
.pagination ul
.next
.disabled
{
246 .pagination li.active span {
253 .page-footer .footer-copyright {
255 height: auto
!important
;
256 line-height: 1em !important
;
259 .page-footer .footer-copyright p {
260 text-overflow: ellipsis
;
270 .picker__date-display {
283 /* ==========================================================================
285 ========================================================================== */
298 justify-content: space-between
;
302 .nav-wrapper .button-collapse {
313 justify-content: flex-end
;
316 .nav-panel-buttom li {
321 transition: background
0.2s ease
;
325 .nav-panel-search
.search
,
327 color: #444 !important
;
330 .nav-panels .action {
331 padding-left: 0.75rem;
336 .nav-panels .input-field input {
338 line-height: inherit
;
339 padding-left: 4rem !important
;
340 width: calc
(100% - 8rem);
343 .nav-panels .input-field input:focus {
344 background-color: #fff;
350 .input-field
.nav-panel-add label
,
351 .input-field.nav-panel-search label {
355 .input-field
.nav-panel-add
.close
,
356 .input-field.nav-panel-search .close {
363 transition: 0.3s color
;
374 .input-field
.nav-panel-add
,
375 .input-field
.nav-panel-add form
,
376 .input-field
.nav-panel-search
,
377 .input-field.nav-panel-search form {
382 /* ==========================================================================
384 ========================================================================== */
392 .side-nav
.collapsible-header
,
393 .side-nav.fixed .collapsible-header {
403 .side-nav > li.logo {
418 background: transparent
;
434 background-color: initial
;
437 /* ==========================================================================
439 * ========================================================================== */
446 .side-nav.fixed.right-aligned {
448 left: auto
!important
;
451 #filters div
.with-checkbox
{
456 /* ==========================================================================
458 ========================================================================== */
468 .data .card .card-body {
473 .card
.card-content
.card-title
,
474 .card .card-reveal .card-title {
478 font-family: roberto
, "Helvetica Neue", Helvetica
, Arial
, sans-serif
;
482 .card
.card-content
.activator
,
483 .card .card-reveal .activator {
485 font-family: "Material Icons";
488 .card
.card-content i
.right
,
489 .card .card-reveal i.right {
493 .card .card-content .original {
499 text-overflow: ellipsis
;
505 .card .card-entry-labels {
512 .card
.card-entry-labels li
,
513 .card-tag-labels li {
514 margin: 10px 10px 10px auto
;
515 padding: 5px 12px 5px 16px !important
;
516 background-color: rgba
(0, 151, 167, 0.85);
517 border-radius: 0 3px 3px 0;
522 text-overflow: ellipsis
;
526 .card .card-entry-labels-hidden {
530 .card .card-entry-labels-hidden li {
531 display: inline-block
;
532 background-color: rgba
(0, 151, 167, 0.85);
538 max-width: calc
(100% - 15px);
540 text-overflow: ellipsis
;
544 .card .card-entry-labels-hidden li:first-child {
549 .card-entry-labels a
,
551 .card-entry-labels-hidden a
,
553 text-decoration: none
;
558 .card .card-content .estimatedTime {
563 padding: 10px 5px 10px 15px;
566 .card .card-action ul.links {
572 .card .card-action ul.tools li a.tool {
573 margin-right: 5px !important
;
576 .card-stacked:hover ul.tools-list {
580 .card-stacked ul.tools-list {
584 .card .card-action a {
589 .card .card-action a:hover {
593 .card .card-action .reading-time {
594 display: inline-flex
;
595 vertical-align: middle
;
598 .quickstart
.card
.card-action a
,
599 .quickstart .card .card-action a:hover {
600 color: #fff !important
;
603 .settings .div_tabs {
604 padding-bottom: 15px;
617 .card .card-fullimage {
621 .card
.card-image
.preview
,
622 .card .card-fullimage .preview {
624 background-size: cover
;
625 background-repeat: no-repeat
;
626 background-position: 50%;
629 /* ==========================================================================
631 ========================================================================== */
650 #article article h6
{
654 #article article h1 strong
,
655 #article article h2 strong
,
656 #article article h3 strong
,
657 #article article h4 strong
,
658 #article article h5 strong
,
659 #article article h6 strong
{
663 #article article h6
{
667 #article article h5
{
671 #article article h4
{
675 #article article h3
{
679 #article article h2
{
683 #article article h1
{
694 border-bottom: 1px dotted
#03a9f4;
695 text-decoration: none
;
698 #article article
a:hover
{
699 border-bottom-style: solid
;
702 #article article ul
{
707 #article article ul li
{
708 list-style-type: disc
;
711 #article article blockquote
{
715 #article article strong
{
719 #article article pre
{
720 box-sizing: border-box
;
722 border: #e3f2fd 1px solid
;
725 font-family: monospace
;
733 #article > header
> h1
{
735 margin: 2.1rem 0 0.68rem;
739 width: 95px !important
;
740 transition: width
0.2s ease
;
744 width: 240px !important
;
747 .reader-mode .collapsible-body {
752 .reader-mode:hover .collapsible-body {
758 transition: opacity
0.2s ease
;
761 .reader-mode:hover span {
774 #article aside
.tools
{
781 article aside
.tools li
{
782 display: inline-flex
;
783 vertical-align: middle
;
786 #article aside
.tools a
{
788 text-decoration: none
;
791 #article aside #list
{
796 #article aside
.chip
{
797 background-color: rgba
(0, 151, 167, 0.85);
798 padding: 0 15px 0 10px;
802 #article aside
.chip a
,
803 #article aside
.chip i
{
807 /* ==========================================================================
809 ========================================================================== */
811 @media only screen and
(max-width: 992px) {
828 .nav-panels .action {
829 padding-right: 0.75rem;
833 justify-content: space-around
;
843 #article > header
> h1
{
848 width: 240px !important
;
856 display: inline-block
;
869 .pagination li.next {
873 .drag-target + .drag-target {
877 .drag-target + .drag-target + .drag-target {
882 @media only screen and
(min-width: 1200px) and
(max-width: 1650px) {
889 @media only screen and
(min-width: 993px) and
(max-width: 1200px) {
941 @media only screen and
(max-width: 350px) {
955 /* ==========================================================================
957 ========================================================================== */
959 .icon-google-plus2::before {
963 .icon-facebook2::before {
967 .icon-twitter::before {
971 .icon-apple::before {
975 .icon-android::before {
979 .icon-chrome::before {
983 .icon-firefox::before {
991 footer
[class^
="icon-"],
992 footer
[class
*=" icon-"] {
994 transition: text-shadow
0.2s ease
;
998 footer
[class^
="icon-"]:hover
,
999 footer
[class
*=" icon-"]:hover
{
1000 text-shadow: 0 0 10px rgba
(0, 0, 0, 0.3);
1003 /* ==========================================================================
1005 ========================================================================== */
1007 /* force height on non-input field in the settings page */
1008 div
.settings div
.input-field div
,
1009 div
.settings div
.input-field ul
{
1013 /* but avoid to kill all file input */
1014 div
.settings div
.file-field div
{
1015 margin-top: inherit
;
1018 .input-field label.active {
1022 nav
.input-field input
{