]> git.wh0rd.org - tt-rss.git/blob - css/tt-rss.css
toolbar css fixes (2)
[tt-rss.git] / css / tt-rss.css
1 body#ttrssMain, body#ttrssPrefs, body#ttrssLogin, body {
2 background : white;
3 color : black;
4 margin : 0px;
5 padding : 0px;
6 font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
7 font-size: 14px;
8 }
9
10 body#ttrssPrefs {
11 background-color : #ecf4ff;
12 }
13
14 body#ttrssPrefs #footer, body#ttrssPrefs #header {
15 background-color : #ecf4ff;
16 padding-left : 8px;
17 padding-right : 8px;
18 }
19
20 div.postReply {
21 padding : 0px;
22 }
23
24 div.postReply div.postHeader {
25 padding : 5px;
26 margin-right : 4px;
27 color : #909090;
28 border-width : 0px 0px 1px 0px;
29 border-color : #ddd;
30 border-style : solid;
31 }
32
33 div.postReply div.postTitle {
34 overflow : hidden;
35 text-overflow: ellipsis;
36 white-space : nowrap;
37 font-weight : 600;
38 text-rendering: optimizelegibility;
39 font-family : "Segoe WP Semibold", "Segoe UI Semibold",
40 "Segoe UI Web Semibold", "Segoe UI", "Helvetica Neue",
41 Helvetica, Arial, sans-serif;
42 }
43
44 div.postReply div.postDate {
45 padding-left : 10px;
46 }
47
48 div.postReply div.postContent {
49 padding : 10px;
50 }
51
52 div.postReply div.postContent img {
53 border-width : 0px;
54 max-width : 98%;
55 height: auto;
56 }
57
58 div.postReply div.postEnclosures {
59 margin-top : 1em;
60 color : #555;
61 }
62
63 div.postReply img.tagsPic {
64 width : 16px;
65 height : 16px;
66 margin-left : 4px;
67 vertical-align : middle;
68 }
69
70 div.articleNote {
71 background-color : #fff7d5;
72 padding : 5px;
73 margin : 5px;
74 border-style : solid;
75 border-color : #e7d796;
76 border-width : 1px;
77 background-color : #fff7d5;
78 color : #9a8c59;
79 }
80
81 div.articleNote div.noteEdit {
82 float : right;
83 cursor : pointer;
84 }
85
86 div.postReply span.author {
87 font-size : 12px;
88 }
89
90 h1 {
91 font-size : 18px;
92 font-weight : 600;
93 text-rendering: optimizelegibility;
94 font-family : "Segoe WP Semibold", "Segoe UI Semibold",
95 "Segoe UI Web Semibold", "Segoe UI", "Helvetica Neue",
96 Helvetica, Arial, sans-serif;
97 }
98
99 h2 {
100 font-size : 16px;
101 font-weight : 600;
102 border-width : 0px 0px 1px 0px;
103 border-style : solid;
104 border-color : #ecf4ff;
105 text-rendering: optimizelegibility;
106 font-family : "Segoe WP Semibold", "Segoe UI Semibold",
107 "Segoe UI Web Semibold", "Segoe UI", "Helvetica Neue",
108 Helvetica, Arial, sans-serif;
109 }
110
111 h3 {
112 font-size : 12px;
113 border-width : 0px 0px 1px 0px;
114 border-style : solid;
115 border-color : #ecf4ff;
116 font-weight : 600;
117 text-rendering: optimizelegibility;
118 font-family : "Segoe WP Semibold", "Segoe UI Semibold",
119 "Segoe UI Web Semibold", "Segoe UI", "Helvetica Neue",
120 Helvetica, Arial, sans-serif;
121 }
122
123 hr {
124 border-width : 0px 0px 1px 0px;
125 border-style : solid;
126 border-color : #ccc;
127 }
128
129 a {
130 color : #4684ff;
131 text-decoration : none;
132 }
133
134 a:hover {
135 color : #88b0f0;
136 }
137
138 #piggie {
139 z-index : 999;
140 position : absolute;
141 }
142
143 #notify {
144 bottom : 10px;
145 right : 20px;
146 border-width : 1px;
147 border-style : solid;
148 position : absolute;
149 font-size : 12px;
150 z-index : 99;
151 max-width : 200px;
152 min-width : 100px;
153 padding : 5px;
154 -width : 200px;
155 }
156
157 #notify img {
158 vertical-align : middle;
159 max-height : 14px;
160 }
161
162 #notify span.msg {
163 width : 100%;
164 }
165
166 #notify span.close {
167 text-align : right;
168 }
169
170 #notify span {
171 display : table-cell;
172 vertical-align : middle;
173 padding : 4px;
174 }
175
176 .notify {
177 border-color : #d7c47a;
178 background-color : #fff7d5;
179 }
180
181 .notify.progress {
182 border-color : #d7c47a;
183 background-color : #fff7d5;
184 }
185
186 .notify.info {
187 border-color : #88b0f0;
188 background-color : #ecf4ff;
189 }
190
191 .notify.error {
192 background-color : #ffcccc;
193 border-color : #ff0000;
194 }
195
196 .hl div.hlTitle a {
197 font-weight : 600;
198 text-rendering: optimizelegibility;
199 font-family : "Segoe WP Semibold", "Segoe UI Semibold",
200 "Segoe UI Web Semibold", "Segoe UI", "Helvetica Neue",
201 Helvetica, Arial, sans-serif;
202 color : #777;
203 }
204
205 .hl.Unread div.hlTitle a {
206 color : black;
207 }
208
209 .hl.active div.hlTitle a {
210 color : #4684ff;
211 text-shadow : 1px 1px 2px #fff;
212 }
213
214 .hl.Selected {
215 background : #f9fbff;
216 }
217
218 .hl.Grayed {
219 color : #909090;
220 }
221
222 .hl {
223 border-width : 0px 0px 1px 0px;
224 border-style : solid;
225 border-color : #ddd;
226 }
227
228 .hl.active {
229 background : #ecf4ff ! important;
230 }
231
232 div.filterTestHolder {
233 height : 300px;
234 overflow : auto;
235 border-color : #ddd;
236 border-style : solid;
237 margin : 0px 0px 5px 0px;
238 background-color : #f5f5f5;
239 border-width : 1px;
240 }
241
242
243 #content-insert blockquote, #headlines-frame blockquote, .dijitContentPane blockquote {
244 margin : 5px 0px 5px 0px;
245 color : #555;
246 padding-left : 10px;
247 border-width : 0px 0px 0px 4px;
248 border-color : #ccc;
249 border-style : solid;
250 }
251
252 #content-insert code, #headlines-frame code, .dijitContentPane code {
253 color : #009900;
254 font-family : monospace;
255 font-size : 12px;
256 }
257
258 #content-insert pre, #headlines-frame pre, .dijitContentPane pre {
259 margin : 5px 0px 5px 0px;
260 padding : 10px;
261 color : #555;
262 font-family : monospace;
263 font-size : 12px;
264 border-width : 0px;
265 border-color : #ccc;
266 border-style : solid;
267 background : #f5f5f5;
268 display : block;
269 max-width : 98%;
270 overflow : auto;
271 }
272
273 div.notice, div.warning, div.error {
274 padding : 4px 10px 4px 4px;
275 display : inline-block;
276 margin : 2px 0px 4px 0px;
277 font-size : 12px;
278 border-style : solid;
279 border-color : #ccc;
280 border-width : 1px;
281 }
282
283 div.notice div.inner, div.warning div.inner, div.error div.inner {
284 vertical-align : middle;
285 }
286
287 div.notice {
288 background : #ecf4ff;
289 border-color : #88b0f0;
290 }
291
292 div.warning {
293 background : #fff7d5;
294 border-color : #e7d796;;
295 }
296
297 div.error {
298 background : #ffcccc;
299 border-color : #ff0000;
300 }
301
302 div.warning img, div.notice img, div.error img {
303 margin : 4px;
304 vertical-align : middle;
305 }
306
307 div.warning span, div.notice span, div.error span {
308 display : table-cell;
309 vertical-align : middle;
310
311 }
312
313 ul.nomarks {
314 list-style-type : none;
315 margin : 0px;
316 padding : 10px;
317 }
318
319 div.prefHelp {
320 color : #555;
321 padding : 5px;
322 }
323
324 .insensitive {
325 color : #555;
326 }
327
328 #main-toolbar > * {
329 white-space : nowrap;
330 display : table-cell;
331 color : #999;
332 }
333
334 #main-toolbar > *,
335 #main-toolbar table *,
336 #main-toolbar .actionChooser * {
337 text-rendering: optimizelegibility;
338 font-family : "Segoe WP Semibold", "Segoe UI Semibold",
339 "Segoe UI Web Semibold", "Segoe UI", "Helvetica Neue",
340 Helvetica, Arial, sans-serif;
341 font-size : 12px;
342
343 }
344
345 #main-toolbar #headlines-toolbar .dijitDownArrowButton {
346 font-size : 11px;
347 }
348
349 #main-toolbar #headlines-toolbar {
350 padding-right : 4px;
351 width : 100%;
352 }
353
354 #main-toolbar #headlines-toolbar span.holder {
355 display : table;
356 width : 100%;
357 }
358
359 #main-toolbar #headlines-toolbar span.holder > * {
360 display : table-cell;
361 }
362
363 #main-toolbar #headlines-toolbar .main {
364 text-align : right;
365 }
366
367 #main-toolbar #headlines-toolbar .main,
368 #main-toolbar #headlines-toolbar .r {
369 line-height : 24px;
370 }
371
372 #headlines-toolbar span.r img {
373 margin-right : 4px;
374 position : relative;
375 top : 3px;
376 }
377
378 #headlines-toolbar span.r .error a {
379 color : red;
380 }
381
382 #main-toolbar #selected_prompt {
383 font-style : italic;
384 text-align : right;
385 margin-right : 4px;
386 }
387
388 span.contentPreview {
389 color : #999;
390 font-weight : normal;
391 text-shadow : 1px 1px 2px #fff;
392 font-size : 11px;
393 }
394
395 span.hlLabelRef {
396 background-color : #fff7d5;
397 font-size : 8px;
398 color : #063064;
399 font-weight : normal;
400 margin-left : 2px;
401 padding : 1px 4px 1px 4px;
402 display : inline-block;
403 vertical-align : middle;
404 white-space: nowrap;
405 border-radius : 4px;
406 }
407
408 div.postHeader div.postDate {
409 text-align : right;
410 color : #909090;
411 float : right;
412 }
413
414 div.postHeader div {
415 padding-bottom : 3px;
416 }
417
418 #feedUpdateErrors {
419 display : none;
420 }
421
422 #allEntryTags {
423 border-width : 0px 0px 1px 0px;
424 border-style : solid;
425 border-color : #ddd;
426 padding-bottom : 5px;
427 display : none;
428 }
429
430 a.hlFeed {
431 display : block;
432 white-space : nowrap;
433 font-size : 9px;
434 font-style : italic;
435 font-weight : normal;
436 display : inline-block;
437 padding : 1px 2px 1px 2px;
438 margin-bottom : 2px;
439 margin-top : 2px;
440 color : #555;
441 }
442
443 a.hlFeed:hover {
444 color : #4684ff;
445 }
446
447 img.markedPic, img.pubPic {
448 cursor : pointer;
449 vertical-align : middle;
450 opacity : 0.5;
451 -webkit-transition : opacity 0.25s;
452 transition : opacity 0.25s;
453 }
454
455 img.markedPic:hover, img.pubPic:hover {
456 opacity : 1;
457 }
458
459 img[src*='pub_set.png'], img[src*='mark_set.png'] {
460 opacity : 1;
461 }
462
463 div.tagCloudContainer {
464 border : 1px solid #ddd;
465 background-color : #f5f5f5;
466 margin : 5px 0px 5px 0px;
467 padding : 5px;
468 text-align : center;
469 }
470
471 div.errorExplained {
472 border : 1px solid #ddd;
473 background-color : #f5f5f5;
474 margin : 5px 0px 5px 0px;
475 padding : 5px;
476 }
477
478 ul.feedErrorsList {
479 max-height : 300px;
480 overflow : auto;
481 list-style-type : none;
482 border : 1px solid #ddd;
483 background-color : #f5f5f5;
484 margin : 0px 0px 5px 0px;
485 padding : 5px;
486 }
487
488 ul.feedErrorsList em {
489 color : #555;
490 }
491
492 ul.browseFeedList {
493 height : 300px;
494 overflow : auto;
495 border-width : 0px 1px 1px 1px;
496 border-color : #ddd;
497 border-style : solid;
498 margin : 0px 0px 5px 0px;
499 background-color : white;
500 list-style-type : none;
501 padding : 0px;
502
503 }
504
505 ul.browseFeedList li {
506 margin : 0px;
507 padding : 2px 4px 2px 4px;
508 }
509
510 span.subscribers {
511 color : #808080;
512 }
513
514 div.subscribers {
515 color : #808080;
516 font-size : 12px;
517 float : right;
518 }
519
520 div.browserDetails {
521 margin : 5px 5px 5px 5px;
522 padding : 5px;
523 }
524
525 ul.compact {
526 list-style-type : none;
527 margin : 0px;
528 padding : 0px;
529 }
530
531 ul.compact li {
532 margin : 0px;
533 padding : 0px;
534 }
535
536 .noborder {
537 border-width : 0px;
538 }
539
540 #overlay {
541 background : white;
542 left : 0;
543 top : 0;
544 height : 100%;
545 width : 100%;
546 z-index : 100;
547 position : absolute;
548 }
549
550 #overlay_inner {
551 font-weight : bold;
552 margin : 1em;
553 }
554
555 form {
556 margin : 0px;
557 padding : 0px;
558 }
559
560 div.loadingPrompt {
561 padding : 1em;
562 text-align : center;
563 font-weight : bold;
564 }
565
566 div.whiteBox {
567 margin-left : 1px;
568 text-align : center;
569 padding : 1em;
570 }
571
572 div.autocomplete {
573 position : absolute;
574 width : 250px;
575 background-color : white;
576 border :1px solid #778899;
577 margin : 0px;
578 padding : 0px;
579 }
580
581 div.autocomplete ul {
582 list-style-type : none;
583 margin : 0px;
584 padding : 0px;
585 }
586
587 div.autocomplete ul li.selected {
588 background-color : #fff7d5;
589 }
590
591 div.autocomplete ul li {
592 list-style-type : none;
593 display : block;
594 margin : 0;
595 padding : 2px;
596 height : 32px;
597 cursor : pointer;
598 }
599
600 .hlTitle {
601 overflow : hidden;
602 white-space : nowrap;
603 max-width : 500px;
604 text-overflow : ellipsis;
605 }
606
607 div#headlines-frame.wide .hlTitle {
608 max-width : auto;
609 overflow : visible;
610 white-space : normal;
611 }
612
613 .hl a.title.high, span.hlContent.high .contentPreview {
614 color : #00aa00;
615 }
616 .hl.Unread a.title.high, .hl.Unread span.hlContent.high .contentPreview {
617 color : #00dd00;
618 }
619
620 .hl a.title.low, span.hlContent.low .contentPreview,
621 .hl.Unread a.title.low, .hl.Unread span.hlContent.low .contentPreview {
622 color : #909090;
623 text-decoration : line-through;
624 }
625
626 img.hlScorePic {
627 vertical-align : middle;
628 width : 16px;
629 height : 16px;
630 }
631
632 div.dlgSec {
633 font-size : 12px;
634 color : #555;
635 font-weight : bold;
636 clear : both;
637 height : 20px;
638 }
639
640 div.dlgSecCont {
641 position : relative;
642 left : 150px;
643 top : -20px;
644 float : left;
645 font-size : 12px;
646 font-weight : normal;
647 }
648
649 div.dlgSecCont hr {
650 height : 0px;
651 line-height : 0px;
652 border : 0px solid transparent;
653 margin : 2px;
654 }
655
656 div.dlgSecCont > * {
657 position : relative;
658 top : -2px;
659 }
660
661 div.dlgButtons {
662 text-align : right;
663 clear : both;
664 }
665
666 span.labelColorIndicator {
667 height : 16px;
668 width : 16px;
669 border-radius : 4px;
670 line-height : 14px;
671 vertical-align : middle;
672 font-size : 9px;
673 display : inline-block;
674 border : 1px solid #ccc;
675 background-color : #fff7d5;
676 color : #063064;
677 text-align : center;
678 }
679
680 div#cmdline {
681 position : absolute;
682 left : 5px;
683 bottom : 5px;
684 font-size : 11px;
685 color : #555;
686 font-weight : bold;
687 background-color : white;
688 border : 1px solid #88b0f0;
689 padding : 3px 5px 3px 5px;
690 z-index : 5;
691 }
692
693 #feed_browser_spinner {
694 vertical-align : middle;
695 height : 18px;
696 width : 18px;
697 }
698
699 div.hlTitle {
700 display : table-cell;
701 cursor : pointer;
702 width : 100%;
703 vertical-align : middle;
704 padding-top : 4px;
705 padding-bottom : 4px;
706 }
707
708 div.hlLeft {
709 display : table-cell;
710 vertical-align : middle;
711 white-space: nowrap;
712 }
713
714 div.hlRight {
715 display : table-cell;
716 white-space: nowrap;
717 text-align : right;
718 vertical-align : middle;
719 }
720
721 div.hlRight img {
722 max-width : 16px;
723 max-height : 16px;
724 }
725
726 span.hlUpdated {
727 color : #555;
728 min-width : 100px;
729 display : table-cell;
730 width : 100%;
731 vertical-align : middle;
732 text-align : right;
733 font-size : 10px;
734 }
735
736 div.hlLeft {
737 padding-left : 8px;
738 }
739
740 div.hlLeft input {
741 margin-left : 4px;
742 margin-right : 4px;
743 }
744
745 div.hlLeft img, div.hlRight img {
746 margin : 0px 4px;
747 }
748
749 div.hlLeft img {
750 width : 16px;
751 height : 16px;
752 }
753
754 div.fatalError {
755 margin-bottom : 10px;
756 }
757
758 div.fatalError button {
759 margin-top : 5px;
760 }
761
762 div.fatalError textarea {
763 width : 100%;
764 height : 100px;
765 }
766
767 #ttrssMain #main {
768 border-width : 0px;
769 margin : 0px;
770 padding : 0px;
771 }
772
773 #header-wrap {
774 border-width : 0px;
775 margin : 0px;
776 padding : 0px;
777 }
778
779 #content-wrap {
780 padding : 0px;
781 border-width : 0px;
782 margin : 0px;
783 }
784
785 #feeds-holder {
786 padding : 0px;
787 border-width : 0px 1px 0px 0px;
788 border-style : solid;
789 border-color : #ddd;
790 overflow : hidden;
791 background : #f5f5f5;
792 }
793
794 #headlines-wrap-inner {
795 padding : 0px;
796 margin : 0px;
797 border-width : 0px;
798 }
799
800 #headlines-frame {
801 padding : 0px;
802 border-width : 0px;
803 margin-top : 0px;
804 }
805
806 #headlines-toolbar_splitter, #toolbar_splitter {
807 display : none;
808 }
809
810 #toolbar {
811 padding : 0px;
812 margin : 0px;
813 border-width : 0px;
814 white-space: nowrap;
815 font-size : 12px;
816 }
817
818 #main-toolbar {
819 background : white;
820 border-width : 0px 0px 1px 0px;
821 border-color : #ddd;
822 border-style : solid;
823 padding-left : 4px;
824 height : 26px;
825
826 }
827
828 #header {
829 border-width : 0px;
830 text-align : right;
831 color : #555;
832 padding : 5px 5px 0px 0px;
833 margin : 0px;
834 position : absolute;
835 right : 0px;
836 top : 0px;
837 z-index : 5;
838 }
839
840 #footer {
841 text-align : center;
842 color : #555;
843 padding : 4px 4px 8px 4px;
844 border-width : 0px;
845 }
846
847 #content-insert {
848 padding : 0px;
849 border-color : #ddd;
850 border-width : 0px;
851 line-height: 20px;
852 overflow : auto;
853 }
854
855 #feedTree .dijitTreeRow .dijitTreeLabel.Unread {
856 font-weight : bold;
857 }
858
859 #feedTree .dijitTreeRow.Error .dijitTreeLabel {
860 color : red;
861 }
862
863 img.feedIcon, img.tinyFeedIcon {
864 width : 16px;
865 height : 16px;
866 line-height : 16px;
867 vertical-align : middle;
868 display : inline-block;
869 }
870
871 .player {
872 display : inline-block;
873 color : #555;
874 font-size : 11px;
875 font-family : sans-serif;
876 border : 1px solid #555;
877 padding : 0px 4px 0px 4px;
878 margin : 0px 2px 0px 2px;
879 width : 50px;
880 text-align : center;
881 background : white;
882 }
883
884 .player.playing {
885 color : #00c000;
886 border-color : #00c000;
887 }
888
889 .player:hover {
890 background : #f0f0f0;
891 cursor : pointer;
892 }
893
894 #headlines-spacer {
895 height : 100%;
896 margin-left : 1px;
897 text-align : center;
898 padding : 1em;
899 color : #555;
900 }
901
902
903 ul#filterDlg_Matches, ul#filterDlg_Actions {
904 max-height : 100px;
905 overflow : auto;
906 list-style-type : none;
907 border-style : solid;
908 border-color : #ddd;
909 border-width : 0px 1px 1px 1px;
910 background-color : white;
911 margin : 0px 0px 5px 0px;
912 padding : 0px;
913 }
914
915 ul#filterDlg_Matches li, ul#filterDlg_Actions li {
916 cursor : pointer;
917 padding : 0px 0px 0px 5px;
918 }
919
920 ul.helpKbList {
921 max-height : 300px;
922 overflow : auto;
923 list-style-type : none;
924 border : 1px solid #ddd;
925 background-color : #f5f5f5;
926 margin : 0px 0px 5px 0px;
927 padding : 5px;
928 }
929
930 ul.helpKbList span.hksequence {
931 width : 6em;
932 margin-left : 20px;
933 color : #88b0f0;
934 font-weight : bold;
935 display : inline-block;
936 }
937
938 ul.helpKbList h2 {
939 margin-top : 0px;
940 }
941
942 span.collapseBtn {
943 cursor : pointer;
944 }
945
946 div.postContent p {
947 max-width : 650px;
948 -webkit-hyphens: auto;
949 -moz-hyphens: auto;
950 hyphens: auto;
951 }
952
953 div.postContent iframe {
954 min-width : 50%;
955 }
956
957 div.postHeader span.author {
958 color : #555;
959 font-size : 11px;
960 font-weight : normal;
961 }
962
963 select.attachments {
964 display : block;
965 margin-top : 10px;
966 max-width : 120px;
967 }
968
969 #selected_prompt {
970 margin-right : 25px;
971 }
972
973 #feedTree img.feedIcon {
974 position : relative;
975 top : -2px;
976 }
977
978 body#ttrssMain #feedTree .dijitTreeRow {
979 padding : 2px 0px 2px;
980 height : 22px;
981 border-width : 1px;
982 color : #333;
983 }
984
985 ul#filterDlg_Matches li div.dijitCheckBox, ul#filterDlg_Actions li div.dijitCheckBox {
986 margin-right : 5px;
987 }
988
989 body#ttrssMain #feedTree {
990 height : 100%;
991 overflow-x : hidden;
992 text-rendering: optimizelegibility;
993 font-family : "Segoe WP Semibold", "Segoe UI Semibold",
994 "Segoe UI Web Semibold", "Segoe UI", "Helvetica Neue",
995 Helvetica, Arial, sans-serif;
996 }
997
998 body#ttrssMain #feedTree .counterNode.aux {
999 background : #f0f0f0;
1000 color : #999;
1001 border-color : #f0f0f0;
1002 }
1003
1004 body#ttrssMain #feedTree .counterNode {
1005 font-weight : bold;
1006 display : inline-block;
1007 font-size : 9px;
1008 text-align : center;
1009 border : 1px solid #88b0f0;
1010 color : white;
1011 background : #88b0f0;
1012 border-radius : 4px;
1013 vertical-align : middle;
1014 float : right;
1015 position : relative;
1016 line-height : 14px;
1017 margin-right : 8px;
1018 margin-top : 3px;
1019 min-width : 23px;
1020 height : 14px;
1021 }
1022
1023 #feedTree img[src*='indicator_white.gif'] {
1024 position : relative;
1025 top : -2px;
1026 }
1027
1028 span.highlight {
1029 background-color : #ffff00;
1030 color : #cc90cc;
1031 }
1032
1033 /* body#ttrssMain #feedTree .dijitTreeRow .dijitTreeExpandoLeaf {
1034 display : none;
1035 } */
1036
1037 div.enclosure_title {
1038
1039 }
1040
1041 body#ttrssMain #headlines-frame .dijitCheckBox {
1042 border-width : 0px;
1043 }
1044
1045 :focus {
1046 outline: none;
1047 }