sixth part of syncing LCARStrek with Firefox 42-44 windows theme changes
[themes.git] / LCARStrek / global / in-content / common.css
... / ...
CommitLineData
1/* This Source Code Form is subject to the terms of the Mozilla Public
2 * License, v. 2.0. If a copy of the MPL was not distributed with this
3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
4
5/* === BEGIN common.inc.css === */
6
7@namespace html "http://www.w3.org/1999/xhtml";
8@namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
9
10*|*:root {
11 --in-content-page-color: #FF9F00;
12 --in-content-page-background: #000000;
13 --in-content-text-color: #FF9F00;
14 --in-content-selected-text: #000000;
15 ---in-content-header-border-color: #c8c8c8;
16 --in-content-button-background: #C09070;
17 --in-content-box-background: #000000;
18 ---in-content-box-background-odd: #f3f6fa;
19 --in-content-box-background-hover: #FFCF00;
20 --in-content-box-background-active: #FF9F00;
21 --in-content-box-background-disabled: #402858;
22 --in-content-box-border-color: #FF9F00;
23 ---in-content-item-hover: rgba(0,149,221,0.25);
24 ---in-content-item-selected: #0095dd;
25 ---in-content-border-highlight: #33FF33;
26 --in-content-border-focus: #FFCF00;
27 --in-content-border-color: #9C9CFF;
28 --in-content-border-disabled: #8050B0;
29 --in-content-category-text: #FFCF00;
30 --in-content-category-border-focus: 1px dotted #000000;
31 --in-content-category-text-selected: #000000;
32 --in-content-categorylist-background: #A09090;
33 --in-content-category-background: #000000;
34 --in-content-category-background-hover: #FFCF00;
35 --in-content-category-background-active: #008484;
36 ---in-content-tab-color: #424f5a;
37 --in-content-link-color: #3333FF;
38 --in-content-link-color-hover: #FFCF00;
39 --in-content-link-color-active: #FF9F00;
40 --in-content-link-color-visited: #6000CF;
41 --in-content-primary-button-background: #A06060;
42 --in-content-primary-button-background-hover: #FFCF00;
43 --in-content-primary-button-background-active: #FF9F00;
44 --in-content-table-border-dark-color: #9C9CFF;
45 --in-content-table-header-background: #A09090;
46 ---in-content-help-button-background: #ffcb00;
47 ---in-content-help-button-background-hover: #f4c200;
48 ---in-content-help-button-background-active: #eaba00;
49 --in-content-disabled-text: #8050B0;
50}
51
52@-moz-document url("about:privatebrowsing") {
53 #bar {
54 background-color: #6000CF !important;
55 color: #FFCF00 !important;
56 }
57
58 #tpEnabled {
59 background-color: #008484 !important;
60 color: #000000 !important;
61 }
62
63 #tpDisabled {
64 background-color: #FF0000 !important;
65 color: #000000 !important;
66 }
67
68 #trackingProtectionSection {
69 border-color: #A09090 !important;
70 }
71}
72
73html|html,
74xul|page,
75xul|window {
76 font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
77 -moz-appearance: none;
78 background-color: var(--in-content-page-background);
79 color: var(--in-content-page-color);
80}
81
82html|body {
83 font-size: 15px;
84 font-weight: normal;
85 margin: 0;
86}
87
88html|h1 {
89 font-size: 2.5em;
90 font-weight: lighter;
91 line-height: 1.2;
92 color: var(--in-content-text-color);
93 margin: 0;
94 margin-bottom: .5em;
95}
96
97html|hr {
98 border-style: solid none none none;
99 border-color: var(--in-content-border-color);
100}
101
102xul|caption {
103}
104
105xul|caption > xul|checkbox,
106xul|caption > xul|label {
107 margin-top: 0;
108 margin-bottom: 0;
109}
110
111*|*.main-content {
112 padding-top: 40px;
113 -moz-padding-end: 48px; /* orig is 44px to compensate the 4px margin of child elements */
114 padding-bottom: 48px;
115 -moz-padding-start: 48px;
116 overflow: auto;
117}
118
119xul|prefpane > xul|*.content-box {
120 overflow: visible;
121}
122
123/* groupboxes */
124/*
125xul|groupbox {
126 -moz-appearance: none;
127 border: none;
128 margin: 15px 0 0;
129 -moz-padding-start: 0;
130 -moz-padding-end: 0;
131 font-size: 1.25rem;
132}
133
134xul|groupbox xul|label,
135xul|groupbox xul|description {
136 / !important needed to override toolkit !important rule /
137 -moz-margin-start: 0 !important;
138 -moz-margin-end: 0 !important;
139}
140*/
141/* tabpanels and tabs */
142/*
143xul|tabpanels {
144 -moz-appearance: none;
145 font-size: 1.25rem;
146 line-height: 22px;
147 border: none;
148 padding: 0;
149 background-color: transparent;
150 color: inherit;
151}
152
153xul|tabs {
154 margin-bottom: 15px;
155 border-top: 1px solid var(--in-content-box-border-color);
156 border-bottom: 1px solid var(--in-content-box-border-color);
157 background-color: var(--in-content-page-background);
158}
159
160xul|*.tabs-left,
161xul|*.tabs-right {
162 border-bottom: none;
163}
164
165xul|tab {
166 -moz-appearance: none;
167 margin-top: 0;
168 padding: 4px 20px;
169 min-height: 44px;
170 color: var(--in-content-tab-color);
171 background-color: var(--in-content-page-background);
172 border-width: 0;
173 / !important overrides tabbox.css RTL and visuallyselected rules /
174 border-radius: 0 !important;
175 transition: background-color 50ms ease 0s;
176}
177
178xul|tab:hover {
179 background-color: var(--in-content-box-background-hover);
180}
181
182xul|tab[selected] {
183 background-color: var(--in-content-box-background-hover);
184 padding-bottom: 0; / compensate the 4px border /
185 border-bottom: 4px solid var(--in-content-border-highlight);
186}
187
188xul|*.tab-text {
189 font-size: 1.3rem;
190 line-height: 22px;
191}
192*/
193/* html buttons */
194
195html|button {
196 border-radius: 300px;
197 border: none;
198 background-color: var(--in-content-button-background);
199 color: var(--in-content-selected-text);
200 /* override forms.css */
201 font: inherit;
202}
203
204/* xul buttons and menulists */
205/*
206*|button,
207xul|colorpicker[type="button"],
208xul|menulist {
209 -moz-appearance: none;
210 min-height: 30px;
211 color: var(--in-content-text-color);
212 border: 1px solid var(--in-content-box-border-color);
213 -moz-border-top-colors: none !important;
214 -moz-border-right-colors: none !important;
215 -moz-border-bottom-colors: none !important;
216 -moz-border-left-colors: none !important;
217 border-radius: 2px;
218 background-color: var(--in-content-page-background);
219}
220*/
221html|button:enabled:hover,
222xul|button:not([disabled="true"]):hover,
223xul|colorpicker[type="button"]:not([disabled="true"]):hover,
224xul|menulist:not([disabled="true"]):hover {
225 background-color: var(--in-content-box-background-hover);
226 color: var(--in-content-selected-text);
227}
228
229html|button:enabled:hover:active,
230xul|button:not([disabled="true"]):hover:active,
231xul|colorpicker[type="button"]:not([disabled="true"]):hover:active,
232xul|menulist[open="true"]:not([disabled="true"]) {
233 background-color: var(--in-content-box-background-active);
234 color: var(--in-content-selected-text);
235}
236
237html|button:disabled,
238xul|button[disabled="true"],
239xul|colorpicker[type="button"][disabled="true"],
240xul|menulist[disabled="true"] {
241 cursor: not-allowed;
242 background-color: var(--in-content-box-background-disabled);
243 color: var(--in-content-selected-text);
244}
245
246*|button.primary {
247 background-color: var(--in-content-primary-button-background);
248}
249
250html|button.primary:enabled:hover,
251xul|button.primary:not([disabled="true"]):hover {
252 background-color: var(--in-content-primary-button-background-hover);
253}
254
255html|button.primary:enabled:hover:active,
256xul|button.primary:not([disabled="true"]):hover:active {
257 background-color: var(--in-content-primary-button-background-active);
258}
259/*
260xul|colorpicker[type="button"] {
261 padding: 6px;
262 width: 50px;
263}
264
265xul|button > xul|*.button-box,
266xul|menulist > xul|*.menulist-label-box {
267 padding-right: 10px !important;
268 padding-left: 10px !important;
269}
270
271xul|menulist > xul|*.menulist-label-box > xul|*.menulist-icon[src] {
272 -moz-margin-end: 5px;
273}
274
275xul|button[type="menu"] > xul|*.button-box > xul|*.button-menu-dropmarker {
276 -moz-appearance: none;
277 margin: 1px 0;
278 -moz-margin-start: 10px;
279 padding: 0;
280 width: 10px;
281 height: 16px;
282 border: none;
283 background-color: transparent;
284 list-style-image: url("chrome://global/skin/in-content/dropdown.svg#dropdown");
285}
286
287*/
288xul|*.help-button {
289/*
290 min-width: 30px;
291 border-radius: 2px;
292 border-width: 0;
293 background-color: #ffcb00;
294 background-image: none;
295 box-shadow: none;
296*/
297 list-style-image: url("chrome://global/skin/in-content/help-glyph.svg");
298}
299/*
300xul|*.help-button:not([disabled="true"]):hover {
301 background-color: #f4c200;
302 background-image: none;
303}
304
305xul|*.help-button:not([disabled="true"]):hover:active {
306 background-color: #eaba00;
307 background-image: none;
308}
309
310xul|*.close-icon > xul|*.button-box,
311xul|*.help-button > xul|*.button-box {
312 padding-top: 0;
313 padding-bottom: 0;
314 padding-right: 0 !important;
315 padding-left: 0 !important;
316}
317*/
318xul|*.help-button > xul|*.button-box > xul|*.button-icon {
319 width: 18px;
320 height: 18px;
321}
322
323xul|*.help-button > xul|*.button-box > xul|*.button-text {
324 display: none;
325}
326/*
327xul|*.spinbuttons-button {
328 min-height: initial;
329 -moz-margin-start: 10px !important;
330 -moz-margin-end: 2px !important;
331}
332
333xul|*.spinbuttons-up {
334 margin-top: 2px !important;
335 border-radius: 1px 1px 0 0;
336}
337
338xul|*.spinbuttons-down {
339 margin-bottom: 2px !important;
340 border-radius: 0 0 1px 1px;
341}
342
343xul|*.spinbuttons-button > xul|*.button-box {
344 padding: 1px 5px 2px !important;
345}
346
347xul|*.spinbuttons-up > xul|*.button-box > xul|*.button-icon {
348 list-style-image: url("chrome://global/skin/arrow/arrow-up.gif");
349}
350
351xul|*.spinbuttons-up[disabled="true"] > xul|*.button-box > xul|*.button-icon {
352 list-style-image: url("chrome://global/skin/arrow/arrow-up-dis.gif");
353}
354
355xul|*.spinbuttons-down > xul|*.button-box > xul|*.button-icon {
356 list-style-image: url("chrome://global/skin/arrow/arrow-dn.gif");
357}
358
359xul|*.spinbuttons-down[disabled="true"] > xul|*.button-box > xul|*.button-icon {
360 list-style-image: url("chrome://global/skin/arrow/arrow-dn-dis.gif");
361}
362
363xul|menulist:not([editable="true"]) > xul|*.menulist-dropmarker {
364 -moz-appearance: none;
365 -moz-margin-end: 4px;
366 padding: 0;
367 border: none;
368 background-color: transparent;
369 list-style-image: url("chrome://global/skin/in-content/dropdown.svg#dropdown");
370}
371
372xul|menulist:not([editable="true"]) > xul|*.menulist-dropmarker > xul|*.dropmarker-icon {
373 width: 18px;
374 height: 18px;
375}
376
377xul|menulist[disabled="true"]:not([editable="true"]) > xul|*.menulist-dropmarker {
378 list-style-image: url("chrome://global/skin/in-content/dropdown.svg#dropdown-disabled")
379}
380
381xul|menulist > xul|menupopup,
382xul|button[type="menu"] > xul|menupopup {
383 -moz-appearance: none;
384 border: 1px solid var(--in-content-box-border-color);
385 border-radius: 2px;
386 background-color: var(--in-content-box-background);
387}
388
389xul|menulist > xul|menupopup xul|menu,
390xul|menulist > xul|menupopup xul|menuitem,
391xul|button[type="menu"] > xul|menupopup xul|menu,
392xul|button[type="menu"] > xul|menupopup xul|menuitem {
393 -moz-appearance: none;
394 font-size: 1rem;
395 color: var(--in-content-text-color);
396 padding-top: 0.2em;
397 padding-bottom: 0.2em;
398 -moz-padding-start: 10px;
399 -moz-padding-end: 30px;
400}
401
402xul|menulist > xul|menupopup > xul|menu:not([disabled="true"])[_moz-menuactive="true"],
403xul|menulist > xul|menupopup > xul|menuitem:not([disabled="true"])[_moz-menuactive="true"],
404xul|button[type="menu"] > xul|menupopup > xul|menu:not([disabled="true"])[_moz-menuactive="true"],
405xul|button[type="menu"] > xul|menupopup > xul|menuitem:not([disabled="true"])[_moz-menuactive="true"] {
406 color: var(--in-content-text-color);
407 background-color: var(--in-content-item-hover);
408}
409
410xul|menulist > xul|menupopup > xul|menu:not([disabled="true"])[selected="true"],
411xul|menulist > xul|menupopup > xul|menuitem:not([disabled="true"])[selected="true"],
412xul|button[type="menu"] > xul|menupopup > xul|menu:not([disabled="true"])[selected="true"],
413xul|button[type="menu"] > xul|menupopup > xul|menuitem:not([disabled="true"])[selected="true"] {
414 color: var(--in-content-selected-text);
415 background-color: var(--in-content-item-selected);
416}
417
418xul|menulist > xul|menupopup > xul|menu[disabled="true"],
419xul|menulist > xul|menupopup > xul|menuitem[disabled="true"],
420xul|button[type="menu"] > xul|menupopup > xul|menu[disabled="true"],
421xul|button[type="menu"] > xul|menupopup > xul|menuitem[disabled="true"] {
422 color: #999;
423 / override the [_moz-menuactive="true"] background color from
424 global/menu.css /
425 background-color: transparent;
426}
427
428xul|menulist > xul|menupopup xul|menuseparator,
429xul|button[type="menu"] > xul|menupopup xul|menuseparator {
430 -moz-appearance: none;
431 margin: 0;
432 padding: 0;
433 border-top: 1px solid var(--in-content-box-border-color);
434 border-bottom: none;
435}
436*/
437/* textboxes */
438/*
439html|input[type="text"],
440html|textarea,
441xul|textbox {
442 -moz-appearance: none;
443 color: var(--in-content-text-color);
444 border: 1px solid var(--in-content-box-border-color);
445 -moz-border-top-colors: none !important;
446 -moz-border-right-colors: none !important;
447 -moz-border-bottom-colors: none !important;
448 -moz-border-left-colors: none !important;
449 border-radius: 2px;
450 background-color: var(--in-content-box-background);
451}
452
453xul|textbox {
454 min-height: 30px;
455 padding-right: 10px;
456 padding-left: 10px;
457}
458
459html|input[type="text"],
460html|textarea {
461 font-family: inherit;
462 font-size: inherit;
463 padding: 5px 10px;
464}
465
466html|input[type="text"]:focus,
467html|textarea:focus,
468xul|textbox[focused] {
469 border-color: var(--in-content-border-focus);
470}
471
472html|input[type="text"]:disabled,
473html|textarea:disabled,
474xul|textbox[disabled="true"] {
475 opacity: 0.5;
476}
477*/
478/* Links */
479
480html|a,
481.text-link,
482.inline-link {
483 color: var(--in-content-link-color);
484 text-decoration: none;
485}
486
487html|a:hover,
488.text-link:hover,
489.inline-link:hover {
490 color: var(--in-content-link-color-hover);
491 text-decoration: underline;
492}
493
494html|a:visited {
495 color: var(--in-content-link-color-visited);
496}
497
498html|a:hover:active,
499.text-link:hover:active,
500.inline-link:hover:active {
501 color: var(--in-content-link-color-active);
502 text-decoration: underline;
503}
504
505/* Checkboxes and radio buttons */
506/* Hide the actual checkbox */
507html|input[type="checkbox"] {
508 visibility: hidden;
509 position: absolute;
510}
511
512/* Create a box to style as the checkbox */
513html|input[type="checkbox"] + html|label:before {
514 display: inline-block;
515 content: "";
516 vertical-align: middle;
517}
518
519html|input[type="checkbox"] + html|label {
520 line-height: 0px;
521}
522/*
523xul|checkbox {
524 -moz-margin-start: 0;
525}
526*/
527/* xul|*.checkbox-check, */
528html|input[type="checkbox"] + html|label:before {
529 -moz-appearance: none;
530 width: 23px;
531 height: 23px;
532 border-radius: 0;
533 border: 1px solid var(--in-content-box-border-color);
534 -moz-margin-end: 10px;
535 background-color: var(--in-content-box-background);
536 background-position: center center;
537 background-repeat: no-repeat;
538}
539
540/* xul|checkbox:not([disabled="true"]):hover > xul|*.checkbox-check, */
541html|input[type="checkbox"]:not(:disabled) + html|label:hover:before {
542 border-color: var(--in-content-border-focus);
543}
544html|input[type="checkbox"]:not(:disabled) + html|label:hover {
545 color: var(--in-content-link-color-hover);
546}
547/*
548xul|*.checkbox-check[checked] {
549 background-image: url("chrome://global/skin/in-content/check.png"),
550 / * !important needed to override toolkit !important rule * /
551 linear-gradient(#fff, rgba(255,255,255,0.8)) !important;
552}
553*/
554html|input[type="checkbox"]:checked + html|label:before {
555 background-image: url("chrome://global/skin/in-content/check.svg#check");
556}
557
558/*xul|checkbox[checked][disabled="true"] > xul|*.checkbox-check,*/
559html|input[type="checkbox"]:checked:disabled + html|label:before {
560 background-image: url("chrome://global/skin/in-content/check.svg#check-disabled");
561}
562html|input[type="checkbox"]:not(:disabled) + html|label:hover:before {
563 background-image: url("chrome://global/skin/in-content/check.svg#check-hover");
564}
565html|input[type="checkbox"]:disabled + html|label:before {
566 border-color: var(--in-content-border-disabled);
567}
568html|input[type="checkbox"]:disabled + html|label {
569 color: var(--in-content-disabled-text);
570}
571/*
572xul|*.checkbox-label-box {
573 -moz-margin-start: -1px; / * negative margin for the transparent border * /
574 -moz-padding-start: 0;
575}
576
577xul|richlistitem > xul|*.checkbox-check {
578 margin: 3px 6px;
579}
580
581xul|radio {
582 -moz-margin-start: 0;
583}
584
585xul|*.radio-check {
586 -moz-appearance: none;
587 width: 23px;
588 height: 23px;
589 border: 1px solid var(--in-content-box-border-color);
590 border-radius: 50%;
591 -moz-margin-end: 10px;
592 background-color: #f1f1f1;
593 background-image: linear-gradient(#fff, rgba(255,255,255,0.80));
594 box-shadow: 0 1px 1px 0 #fff, inset 0 2px 0 0 rgba(0,0,0,0.03);
595}
596
597xul|radio:not([disabled="true"]):hover > xul|*.radio-check {
598 border-color: var(--in-content-border-focus);
599}
600
601xul|*.radio-check[selected] {
602 list-style-image: url("chrome://global/skin/in-content/radio.svg#radio");
603}
604
605xul|radio[disabled="true"] > xul|*.radio-check {
606 opacity: 0.5;
607}
608
609xul|*.radio-label-box {
610 -moz-margin-start: -1px; / * negative margin for the transparent border * /
611 -moz-margin-end: 10px;
612 -moz-padding-start: 0;
613}
614*/
615/* Category List */
616
617*|*#categories {
618 background-color: var(--in-content-categorylist-background);
619 padding-top: 4em;
620 margin: 0;
621 border-radius: 1em 0 0 0;
622 border: none;
623}
624
625*|*.category {
626 background-color: var(--in-content-category-background);
627 color: var(--in-content-category-text);
628 -moz-border-end-width: 0;
629 -moz-padding-start: 15px;
630 -moz-padding-end: 21px;
631 min-height: 40px;
632 transition: background-color 150ms;
633}
634
635*|*.category:hover {
636 background-color: var(--in-content-category-background-hover);
637 color: var(--in-content-category-text-selected);
638}
639
640*|*.category[selected] {
641 background-color: var(--in-content-category-background-active);
642 color: var(--in-content-category-text-selected);
643}
644
645*|*#categories[keyboard-navigation="true"]:-moz-focusring > xul|*.category[current] {
646 border-top: var(--in-content-category-border-focus);
647 border-bottom: var(--in-content-category-border-focus);
648}
649
650*|*.category-name {
651 line-height: 22px;
652 font-size: 1.25rem;
653 padding-bottom: 2px;
654 -moz-padding-start: 9px;
655 margin: 0;
656 -moz-user-select: none;
657}
658
659*|*.category-icon {
660 width: 24px;
661 height: 24px;
662}
663
664/* header */
665
666*|*.header {
667/* -moz-margin-end: 4px; / add the 4px end-margin of other elements /
668 border-bottom: 1px solid var(--in-content-header-border-color);
669 margin-bottom: 15px;
670 padding-bottom: 15px; */
671}
672
673*|*.header-name {
674 font-size: 2.5rem;
675 font-weight: normal;
676 line-height: 40px;
677 margin: 0;
678 -moz-user-select: none;
679}
680
681/* File fields */
682/*
683xul|filefield {
684 -moz-appearance: none;
685 background-color: transparent;
686 border: none;
687 padding: 0;
688}
689
690xul|*.fileFieldContentBox {
691 background-color: transparent;
692}
693
694xul|*.fileFieldIcon {
695 -moz-margin-start: 10px;
696 -moz-margin-end: 0;
697}
698
699xul|*.fileFieldLabel {
700 -moz-margin-start: -26px;
701 -moz-padding-start: 36px;
702}
703
704xul|textbox:-moz-locale-dir(rtl),
705xul|*.fileFieldLabel:-moz-locale-dir(rtl),
706xul|textbox + xul|button:-moz-locale-dir(ltr),
707xul|filefield + xul|button:-moz-locale-dir(ltr) {
708 border-top-left-radius: 0;
709 border-bottom-left-radius: 0;
710}
711
712xul|textbox:-moz-locale-dir(ltr),
713xul|*.fileFieldLabel:-moz-locale-dir(ltr),
714xul|textbox + xul|button:-moz-locale-dir(rtl),
715xul|filefield + xul|button:-moz-locale-dir(rtl) {
716 border-top-right-radius: 0;
717 border-bottom-right-radius: 0;
718}
719
720xul|textbox + xul|button,
721xul|filefield + xul|button {
722 -moz-border-start: none;
723}
724*/
725/* List boxes */
726/*
727xul|richlistbox,
728xul|listbox {
729 -moz-appearance: none;
730 -moz-margin-start: 0;
731 background-color: var(--in-content-box-background);
732 border: 1px solid var(--in-content-box-border-color);
733 color: var(--in-content-text-color);
734}
735
736xul|treechildren::-moz-tree-row,
737xul|listbox xul|listitem {
738 padding: 0.3em;
739 margin: 0;
740 border: none;
741 border-radius: 0;
742 background-image: none;
743}
744
745xul|treechildren::-moz-tree-row(hover),
746xul|listbox xul|listitem:hover {
747 background-color: var(--in-content-item-hover);
748}
749
750xul|treechildren::-moz-tree-row(selected),
751xul|listbox xul|listitem[selected="true"] {
752 background-color: var(--in-content-item-selected);
753 color: var(--in-content-selected-text);
754}
755
756/ This is the only way to increase the height of a tree row unfortunately /
757xul|treechildren::-moz-tree-row {
758 min-height: 2em;
759}
760
761/ Color needs to be set on tree cell in order to be applied /
762xul|treechildren::-moz-tree-cell-text {
763 color: #333;
764}
765
766xul|treechildren::-moz-tree-cell-text(selected) {
767 color: #fff;
768}
769*/
770/* Trees */
771/*
772xul|tree {
773 -moz-appearance: none;
774 font-size: 1em;
775 border: 1px solid var(--in-content-box-border-color);
776 background-color: var(--in-content-box-background);
777 margin: 0;
778}
779
780xul|tree:-moz-focusring,
781xul|richlistbox:-moz-focusring {
782 border: 1px dotted var(--in-content-border-focus);
783}
784
785xul|listheader,
786xul|treecols {
787 -moz-appearance: none;
788 border: none;
789 border-bottom: 1px solid var(--in-content-border-color);
790 padding: 0;
791}
792
793xul|treecol:not([hideheader="true"]),
794xul|treecolpicker {
795 -moz-appearance: none;
796 border: none;
797 background-color: var(--in-content-box-background-hover);
798 color: #808080;
799 padding: 5px 10px;
800}
801
802xul|treecol:not([hideheader="true"]):not([sortable="false"]):hover,
803xul|treecolpicker:hover {
804 background-color: var(--in-content-box-background-active);
805 color: var(--in-content-text-color);
806}
807
808xul|treecol:not([hideheader="true"]):not(:first-child),
809xul|treecolpicker {
810 -moz-border-start-width: 1px;
811 -moz-border-start-style: solid;
812 border-image: linear-gradient(transparent 0%, transparent 20%, #c1c1c1 20%, #c1c1c1 80%, transparent 80%, transparent 100%) 1 1;
813}
814
815xul|treecol:not([hideheader="true"]) > xul|*.treecol-sortdirection[sortDirection] {
816 list-style-image: url("chrome://global/skin/in-content/dropdown.svg#dropdown");
817 width: 18px;
818 height: 18px;
819}
820
821xul|treecol:not([hideheader="true"]) > xul|*.treecol-sortdirection[sortDirection="ascending"] {
822 transform: scaleY(-1);
823}
824
825/ This is the only way to increase the height of a tree row unfortunately /
826xul|treechildren::-moz-tree-row {
827 min-height: 2em;
828}
829
830/ Color needs to be set on tree cell in order to be applied /
831xul|treechildren::-moz-tree-cell-text {
832 color: var(--in-content-text-color);
833}
834
835xul|treechildren::-moz-tree-cell-text(selected) {
836 color: var(--in-content-selected-text);
837}
838*/
839/* === END common.inc.css === */
840/*
841xul|caption {
842 background-color: transparent;
843}
844
845xul|button,
846html|button,
847xul|colorpicker[type="button"],
848xul|menulist {
849 margin: 2px 4px;
850}
851
852xul|menulist:not([editable="true"]) > xul|*.menulist-dropmarker {
853 margin-top: 1px;
854 margin-bottom: 1px;
855}
856
857xul|checkbox {
858 -moz-padding-start: 0;
859}
860
861xul|radio {
862 -moz-binding: url("chrome://global/content/bindings/radio.xml#radio");
863 -moz-padding-start: 0;
864}
865
866xul|*.radio-icon,
867xul|*.checkbox-icon {
868 -moz-margin-end: 0;
869}
870*/
871.text-link:-moz-focusring,
872.inline-link:-moz-focusring {
873 /* Don't specify the outline-color, we should always use initial value. */
874 outline: 1px dotted;
875}