1 /* ==========================================================================
11 ========================================================================== */
18 background-color: #EEE;
22 background-color: #333;
31 background-color: #FFF;
33 box-shadow: 0 1px 8px rgba
(0,0,0,0.9);
48 /* ==========================================================================
50 ========================================================================== */
54 background-color: #000;
69 font-family: 'PT Sans', sans-serif
;
70 text-transform: uppercase
;
83 text-decoration: none
;
92 form input
[type
="text"], select
, form input
[type
="password"], form input
[type
="url"], form input
[type
="email"] {
93 border: 1px solid
#999;
99 @media screen and
(-webkit-min-device-pixel-ratio:0){
101 -webkit-appearance: none
;
103 background: #FFF url
(../img
/bg-select
.png
) no-repeat right center
;
108 display: inline-block
;
117 display: inline-block
;
127 margin-bottom: 0.5em;
130 form button
, input
[type
="submit"] {
132 background-color: #000;
136 display: inline-block
;
137 border:1px solid
#000;
140 form
button:hover
, form
button:focus
, input
[type
="submit"]:hover
, input
[type
="submit"]:focus
{
141 background-color: #FFF;
143 -webkit-transition: all
0.5s ease
;
144 -moz-transition: all
0.5s ease
;
145 -ms-transition: all
0.5s ease
;
146 -o-transition: all
0.5s ease
;
147 transition: all
0.5s ease
;
158 background-color: #000;
179 background-color: #333;
182 box-shadow:inset
-4px 0 20px rgba
(0,0,0,0.6);
196 padding: 0.5em 2em 0.5em 1em;
199 text-transform: uppercase
;
200 text-decoration: none
;
202 font-family: 'PT Sans', sans-serif
;
203 -webkit-transition: all
0.5s ease
;
204 -moz-transition: all
0.5s ease
;
205 -ms-transition: all
0.5s ease
;
206 -o-transition: all
0.5s ease
;
207 transition: all
0.5s ease
;
210 #links > li
> a:hover
, #links
> li
> a:focus
{
211 background-color: #999;
215 #links .current:after
{
222 border-color: transparent
#EEE transparent transparent
;
228 #links li:last-child
{
234 #links li:last-child
a:before
{
243 list-style-type: none
;
245 display: inline-block
;
259 vertical-align: middle
;
263 vertical-align: baseline
;
271 vertical-align: middle
;
278 display: inline-block
;
279 text-decoration: none
;
284 #listmode.tablemode
{
285 background-image: url
("../img/baggy/table.png");
286 background-repeat: no-repeat
;
287 background-position: bottom
;
290 background-image: url
("../img/baggy/list.png");
291 background-repeat: no-repeat
;
292 background-position: bottom
;
296 /* ==========================================================================
298 ========================================================================== */
326 width: 100%!important
;
327 margin-left: 0!important
;
330 .list-entries + .results {
334 .estimatedTime .reading-time {
341 .estimatedTime small {
347 background-color: #FFF;
348 letter-spacing:normal
;
349 box-shadow: 0 3px 7px rgba
(0,0,0,0.3);
350 display: inline-block
;
352 margin-bottom: 1.5em;
357 padding: 1.5em 1.5em 3em 1.5em;
359 /* Removing CSS transitions because they make the switch from list view to
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; */
374 border-color: transparent transparent
#000 transparent
;
380 -webkit-transition: all
0.5s ease
;
381 -moz-transition: all
0.5s ease
;
382 -ms-transition: all
0.5s ease
;
383 -o-transition: all
0.5s ease
;
384 transition: all
0.5s ease
;
394 background-color: #000;
395 -webkit-transition: all
0.5s ease
;
396 -moz-transition: all
0.5s ease
;
397 -ms-transition: all
0.5s ease
;
398 -o-transition: all
0.5s ease
;
399 transition: all
0.5s ease
;
402 .entrie:hover, .eselected {
403 box-shadow: 0 3px 10px rgba
(0,0,0,1);
406 .entrie:hover:after, .eselected:after {
410 .entrie:hover:before, .eselected:before {
414 .entrie:hover h2 a, .eselected h2 a {
419 text-transform: none
;
431 text-decoration: none
;
433 word-wrap: break-word
;
434 -webkit-transition: all
0.5s ease
;
435 -moz-transition: all
0.5s ease
;
436 -ms-transition: all
0.5s ease
;
437 -o-transition: all
0.5s ease
;
438 transition: all
0.5s ease
;
447 .entrie h2 a:first-letter {
448 text-transform: uppercase
;
457 padding-right: 0.5em;
459 -webkit-transition: all
0.5s ease
;
460 -moz-transition: all
0.5s ease
;
461 -ms-transition: all
0.5s ease
;
462 -o-transition: all
0.5s ease
;
463 transition: all
0.5s ease
;
466 .entrie:hover .tools, .eselected .tools {
473 text-decoration: none
;
478 .entrie .tools a:hover {
483 display: inline-block
;
486 .entrie:nth-child(3n+1) {
491 letter-spacing: -5px;
496 display: inline-block
;
498 letter-spacing: normal
;
514 display: inline-block
;
520 text-decoration: none
;
523 .pagination a:hover, .pagination a:focus {
524 text-decoration: underline
;
527 .pagination .disabled {
531 /* ==========================================================================
532 2.1 = "save a link" related styles
533 ========================================================================== */
536 background: rgba
(0,0,0,0.5);
544 margin-top: -30% !important
; /* TODO: get rid of !important here; overridden by .messages selector */
547 border-left: 1px #EEE solid
;
551 background-color: #FFF;
556 border: 10px solid
#000;
562 #bagit-form-form .addurl
{
568 background-color: #000;
575 text-decoration: none
;
580 .close-button:focus {
581 background-color: #999;
585 .close-button--popup {
586 display: inline-block
;
594 background-color: #999;
597 .active-current:after {
604 border-color: transparent
#EEE transparent transparent
;
614 .add-to-wallabag-link-after {
615 background-color: #000;
617 padding: 0 3px 2px 3px;
620 a
.add-to-wallabag-link-after
{
624 transition-duration: 2s;
625 transition-timing-function: ease-out
;
628 #article article
a:hover
+ a
.add-to-wallabag-link-after
, a
.add-to-wallabag-link-after:hover
{
631 transition-duration: .3s;
632 transition-timing-function: ease-in
;
635 a
.add-to-wallabag-link-after:after
{
644 /* ==========================================================================
646 ========================================================================== */
649 font-family: 'icomoon';
650 src:url
('../fonts/icomoon.eot?-s0mcsx');
651 src:url
('../fonts/icomoon.eot?#iefix-s0mcsx') format
('embedded-opentype'),
652 url
('../fonts/icomoon.woff?-s0mcsx') format
('woff'),
653 url
('../fonts/icomoon.ttf?-s0mcsx') format
('truetype'),
654 url
('../fonts/icomoon.svg?-s0mcsx#icomoon') format
('svg');
665 [class^
="icon-"]:before
, [class
*=" icon-"]:before
{
666 font-family: 'icomoon';
670 font-variant: normal
;
671 text-transform: none
;
674 /* Better Font Rendering =========== */
675 -webkit-font-smoothing: antialiased
;
676 -moz-osx-font-smoothing: grayscale
;
679 .icon-flattr:before {
685 .icon-up-open:before {
706 .icon-twitter:before {
709 .icon-down-open:before {
715 .icon-delete:before {
721 .icon-arrow-up-thick:before {
730 .icon-random:before {
733 .icon-reload:before {
736 .icon-evernote:before {
742 .icon-previous:before {
748 .icon-archiveandnext:before {
753 /* .icon-image class, for image-based icons
754 ========================================================================== */
757 background-size: 16px 16px;
758 background-repeat: no-repeat
;
759 background-position: center
;
760 padding-right: 1em !important
;
761 padding-left: 1em !important
;
764 /* Carrot (http://carrot.org) */
765 .icon-image--carrot {
766 background-image: url
('../../_global/img/icons/carrot-icon--white.png');
769 .icon-image--shaarli {
770 background-image: url
('../../_global/img/icons/shaarli.png');
774 .icon-image--diaspora {
775 background-image: url
('../../_global/img/icons/diaspora-icon--black.png');
778 /* ==========================================================================
780 ========================================================================== */
782 .icon-star.fav:before {
786 .icon-check.archive:before {
790 /* ==========================================================================
792 ========================================================================== */
799 .messages > * { display: inline-block
;}
827 /* ==========================================================================
829 ========================================================================== */
846 border:1px solid
#999;
847 background-color: #FFF;
856 #article h2
, #article h3
, #article h4
{
857 text-transform: none
;
889 #article_toolbar li
{
890 display: inline-block
;
894 background-color: #000;
895 padding: 0.3em 0.5em 0.2em;
897 text-decoration: none
;
900 #article_toolbar a:hover
, #article_toolbar
a:focus
{
901 background-color: #999;
905 text-decoration: none
;
920 background-color: #000;
922 padding: 0.2em 0.5em;
931 margin-bottom: 0.5em;
934 .list-tags .icon-rss:hover, .list-tags .icon-rss:focus {
935 background-color: #FFF;
937 text-decoration: none
;
941 text-decoration: none
;
944 .list-tags a:hover, .list-tags a:focus {
945 text-decoration: underline
;
949 font-family: "Courier New", Courier
, monospace
;
950 border: 1px solid
#ccc;
954 /* ==========================================================================
955 5.1 = Tags-related styles
956 ========================================================================== */
961 display: inline-block
;
964 #tagcloud .smallesttag
{
968 #tagcloud .smalltag
{
972 #tagcloud .mediumtag
{
976 #tagcloud .largetag
{
980 #tagcloud .largesttag
{
984 /* ==========================================================================
986 ========================================================================== */
988 @media screen and
(max-width: 1050px) {
992 .entrie:nth-child(3n+1) {
995 .entrie:nth-child(2n+1) {
1000 @media screen and
(max-width: 900px) {
1015 @media screen and
(max-width: 700px) {
1025 @media screen and
(max-width: 500px) {
1031 background-color: #333;
1038 #links li:last-child
{
1042 #links li:last-child
a:before
{
1065 margin-left: -37.5px;
1077 background-color: #999;
1080 .desktopHide:hover, .desktopHide:focus {
1081 background-color: #FFF;
1098 padding-right: 1.5em;
1102 #article_toolbar .topPosF
{
1106 #article_toolbar .leftPosF
{
1110 #article_toolbar .rightPosF
{
1121 #article_toolbar a
{
1122 padding: 0.3em 0.4em 0.2em;
1129 .popup-form, #bagit-form, #search-form {