third 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 height: 30px;
444 color: var(--in-content-text-color);
445 line-height: 20px;
446 padding-right: 10px;
447 padding-left: 10px;
448 border: 1px solid var(--in-content-box-border-color);
449 -moz-border-top-colors: none !important;
450 -moz-border-right-colors: none !important;
451 -moz-border-bottom-colors: none !important;
452 -moz-border-left-colors: none !important;
453 border-radius: 2px;
454 background-color: var(--in-content-box-background);
455}
456
457xul|textbox {
458 min-height: 30px;
459 padding-right: 10px;
460 padding-left: 10px;
461}
462
463html|input[type="text"],
464html|textarea {
465 font-family: inherit;
466 font-size: inherit;
467 padding: 5px 10px;
468}
469
470html|input[type="text"]:focus,
471html|textarea:focus,
472xul|textbox[focused] {
473 border-color: var(--in-content-border-focus);
474}
475
476html|input[type="text"]:disabled,
477html|textarea:disabled,
478xul|textbox[disabled="true"] {
479 opacity: 0.5;
480}
481*/
482/* Links */
483
484html|a,
485.text-link,
486.inline-link {
487 color: var(--in-content-link-color);
488 text-decoration: none;
489}
490
491html|a:hover,
492.text-link:hover,
493.inline-link:hover {
494 color: var(--in-content-link-color-hover);
495 text-decoration: underline;
496}
497
498html|a:visited {
499 color: var(--in-content-link-color-visited);
500}
501
502html|a:hover:active,
503.text-link:hover:active,
504.inline-link:hover:active {
505 color: var(--in-content-link-color-active);
506 text-decoration: underline;
507}
508
509/* Checkboxes and radio buttons */
510/* Hide the actual checkbox */
511html|input[type="checkbox"] {
512 visibility: hidden;
513 position: absolute;
514}
515
516/* Create a box to style as the checkbox */
517html|input[type="checkbox"] + html|label:before {
518 display: inline-block;
519 content: "";
520 vertical-align: middle;
521}
522
523html|input[type="checkbox"] + html|label {
524 line-height: 0px;
525}
526/*
527xul|checkbox {
528 -moz-margin-start: 0;
529}
530*/
531/* xul|*.checkbox-check, */
532html|input[type="checkbox"] + html|label:before {
533 -moz-appearance: none;
534 width: 23px;
535 height: 23px;
536 border-radius: 0;
537 border: 1px solid var(--in-content-box-border-color);
538 -moz-margin-end: 10px;
539 background-color: var(--in-content-box-background);
540 background-position: center center;
541 background-repeat: no-repeat;
542}
543
544/* xul|checkbox:not([disabled="true"]):hover > xul|*.checkbox-check, */
545html|input[type="checkbox"]:not(:disabled) + html|label:hover:before {
546 border-color: var(--in-content-border-focus);
547}
548html|input[type="checkbox"]:not(:disabled) + html|label:hover {
549 color: var(--in-content-link-color-hover);
550}
551/*
552xul|*.checkbox-check[checked] {
553 background-image: url("chrome://global/skin/in-content/check.png"),
554 / * !important needed to override toolkit !important rule * /
555 linear-gradient(#fff, rgba(255,255,255,0.8)) !important;
556}
557*/
558html|input[type="checkbox"]:checked + html|label:before {
559 background-image: url("chrome://global/skin/in-content/check.svg#check");
560}
561
562/*xul|checkbox[checked][disabled="true"] > xul|*.checkbox-check,*/
563html|input[type="checkbox"]:checked:disabled + html|label:before {
564 background-image: url("chrome://global/skin/in-content/check.svg#check-disabled");
565}
566html|input[type="checkbox"]:not(:disabled) + html|label:hover:before {
567 background-image: url("chrome://global/skin/in-content/check.svg#check-hover");
568}
569html|input[type="checkbox"]:disabled + html|label:before {
570 border-color: var(--in-content-border-disabled);
571}
572html|input[type="checkbox"]:disabled + html|label {
573 color: var(--in-content-disabled-text);
574}
575/*
576xul|*.checkbox-label-box {
577 -moz-margin-start: -1px; / * negative margin for the transparent border * /
578 -moz-padding-start: 0;
579}
580
581xul|richlistitem > xul|*.checkbox-check {
582 margin: 3px 6px;
583}
584
585xul|radio {
586 -moz-margin-start: 0;
587}
588
589xul|*.radio-check {
590 -moz-appearance: none;
591 width: 23px;
592 height: 23px;
593 border: 1px solid var(--in-content-box-border-color);
594 border-radius: 50%;
595 -moz-margin-end: 10px;
596 background-color: #f1f1f1;
597 background-image: linear-gradient(#fff, rgba(255,255,255,0.80));
598 box-shadow: 0 1px 1px 0 #fff, inset 0 2px 0 0 rgba(0,0,0,0.03);
599}
600
601xul|radio:not([disabled="true"]):hover > xul|*.radio-check {
602 border-color: var(--in-content-border-focus);
603}
604
605xul|*.radio-check[selected] {
606 list-style-image: url("chrome://global/skin/in-content/radio.svg#radio");
607}
608
609xul|radio[disabled="true"] > xul|*.radio-check {
610 opacity: 0.5;
611}
612
613xul|*.radio-label-box {
614 -moz-margin-start: -1px; / * negative margin for the transparent border * /
615 -moz-margin-end: 10px;
616 -moz-padding-start: 0;
617}
618*/
619/* Category List */
620
621*|*#categories {
622 background-color: var(--in-content-categorylist-background);
623 padding-top: 4em;
624 margin: 0;
625 border-radius: 1em 0 0 0;
626 border: none;
627}
628
629*|*.category {
630 background-color: var(--in-content-category-background);
631 color: var(--in-content-category-text);
632 -moz-border-end-width: 0;
633 -moz-padding-start: 15px;
634 -moz-padding-end: 21px;
635 min-height: 40px;
636 transition: background-color 150ms;
637}
638
639*|*.category:hover {
640 background-color: var(--in-content-category-background-hover);
641 color: var(--in-content-category-text-selected);
642}
643
644*|*.category[selected] {
645 background-color: var(--in-content-category-background-active);
646 color: var(--in-content-category-text-selected);
647}
648
649*|*#categories[keyboard-navigation="true"]:-moz-focusring > xul|*.category[current] {
650 border-top: var(--in-content-category-border-focus);
651 border-bottom: var(--in-content-category-border-focus);
652}
653
654*|*.category-name {
655 line-height: 22px;
656 font-size: 1.25rem;
657 padding-bottom: 2px;
658 -moz-padding-start: 9px;
659 margin: 0;
660 -moz-user-select: none;
661}
662
663*|*.category-icon {
664 width: 24px;
665 height: 24px;
666}
667
668/* header */
669
670*|*.header {
671/* -moz-margin-end: 4px; / add the 4px end-margin of other elements /
672 border-bottom: 1px solid var(--in-content-header-border-color);
673 margin-bottom: 15px;
674 padding-bottom: 15px; */
675}
676
677*|*.header-name {
678 font-size: 2.5rem;
679 font-weight: normal;
680 line-height: 40px;
681 margin: 0;
682 -moz-user-select: none;
683}
684
685/* File fields */
686/*
687xul|filefield {
688 -moz-appearance: none;
689 background-color: transparent;
690 border: none;
691 padding: 0;
692}
693
694xul|*.fileFieldContentBox {
695 background-color: transparent;
696}
697
698xul|*.fileFieldIcon {
699 -moz-margin-start: 10px;
700 -moz-margin-end: 0;
701}
702
703xul|*.fileFieldLabel {
704 -moz-margin-start: -26px;
705 -moz-padding-start: 36px;
706}
707
708xul|textbox:-moz-locale-dir(rtl),
709xul|*.fileFieldLabel:-moz-locale-dir(rtl),
710xul|textbox + xul|button:-moz-locale-dir(ltr),
711xul|filefield + xul|button:-moz-locale-dir(ltr) {
712 border-top-left-radius: 0;
713 border-bottom-left-radius: 0;
714}
715
716xul|textbox:-moz-locale-dir(ltr),
717xul|*.fileFieldLabel:-moz-locale-dir(ltr),
718xul|textbox + xul|button:-moz-locale-dir(rtl),
719xul|filefield + xul|button:-moz-locale-dir(rtl) {
720 border-top-right-radius: 0;
721 border-bottom-right-radius: 0;
722}
723
724xul|textbox + xul|button,
725xul|filefield + xul|button {
726 -moz-border-start: none;
727}
728*/
729/* List boxes */
730/*
731xul|richlistbox,
732xul|listbox {
733 -moz-appearance: none;
734 -moz-margin-start: 0;
735 background-color: var(--in-content-box-background);
736 border: 1px solid var(--in-content-box-border-color);
737 color: var(--in-content-text-color);
738}
739
740xul|treechildren::-moz-tree-row,
741xul|listbox xul|listitem {
742 padding: 0.3em;
743 margin: 0;
744 border: none;
745 border-radius: 0;
746 background-image: none;
747}
748
749xul|treechildren::-moz-tree-row(hover),
750xul|listbox xul|listitem:hover {
751 background-color: var(--in-content-item-hover);
752}
753
754xul|treechildren::-moz-tree-row(selected),
755xul|listbox xul|listitem[selected="true"] {
756 background-color: var(--in-content-item-selected);
757 color: var(--in-content-selected-text);
758}
759
760/ This is the only way to increase the height of a tree row unfortunately /
761xul|treechildren::-moz-tree-row {
762 min-height: 2em;
763}
764
765/ Color needs to be set on tree cell in order to be applied /
766xul|treechildren::-moz-tree-cell-text {
767 color: #333;
768}
769
770xul|treechildren::-moz-tree-cell-text(selected) {
771 color: #fff;
772}
773*/
774/* Trees */
775/*
776xul|tree {
777 -moz-appearance: none;
778 font-size: 1em;
779 border: 1px solid var(--in-content-box-border-color);
780 background-color: var(--in-content-box-background);
781 margin: 0;
782}
783
784xul|tree:-moz-focusring,
785xul|richlistbox:-moz-focusring {
786 border: 1px dotted var(--in-content-border-focus);
787}
788
789xul|listheader,
790xul|treecols {
791 -moz-appearance: none;
792 border: none;
793 border-bottom: 1px solid var(--in-content-border-color);
794 padding: 0;
795}
796
797xul|treecol:not([hideheader="true"]),
798xul|treecolpicker {
799 -moz-appearance: none;
800 border: none;
801 background-color: var(--in-content-box-background-hover);
802 color: #808080;
803 padding: 5px 10px;
804}
805
806xul|treecol:not([hideheader="true"]):not([sortable="false"]):hover,
807xul|treecolpicker:hover {
808 background-color: var(--in-content-box-background-active);
809 color: var(--in-content-text-color);
810}
811
812xul|treecol:not([hideheader="true"]):not(:first-child),
813xul|treecolpicker {
814 -moz-border-start-width: 1px;
815 -moz-border-start-style: solid;
816 border-image: linear-gradient(transparent 0%, transparent 20%, #c1c1c1 20%, #c1c1c1 80%, transparent 80%, transparent 100%) 1 1;
817}
818
819xul|treecol:not([hideheader="true"]) > xul|*.treecol-sortdirection[sortDirection] {
820 list-style-image: url("chrome://global/skin/in-content/dropdown.svg#dropdown");
821 width: 18px;
822 height: 18px;
823}
824
825xul|treecol:not([hideheader="true"]) > xul|*.treecol-sortdirection[sortDirection="ascending"] {
826 transform: scaleY(-1);
827}
828
829/ This is the only way to increase the height of a tree row unfortunately /
830xul|treechildren::-moz-tree-row {
831 min-height: 2em;
832}
833
834/ Color needs to be set on tree cell in order to be applied /
835xul|treechildren::-moz-tree-cell-text {
836 color: var(--in-content-text-color);
837}
838
839xul|treechildren::-moz-tree-cell-text(selected) {
840 color: var(--in-content-selected-text);
841}
842*/
843/* === END common.inc.css === */
844/*
845xul|caption {
846 background-color: transparent;
847}
848
849xul|button,
850html|button,
851xul|colorpicker[type="button"],
852xul|menulist {
853 margin: 2px 4px;
854}
855
856xul|menulist:not([editable="true"]) > xul|*.menulist-dropmarker {
857 margin-top: 1px;
858 margin-bottom: 1px;
859}
860
861xul|checkbox {
862 -moz-padding-start: 0;
863}
864
865xul|radio {
866 -moz-binding: url("chrome://global/content/bindings/radio.xml#radio");
867 -moz-padding-start: 0;
868}
869
870xul|*.radio-icon,
871xul|*.checkbox-icon {
872 -moz-margin-end: 0;
873}
874*/
875.text-link:-moz-focusring,
876.inline-link:-moz-focusring {
877 /* Don't specify the outline-color, we should always use initial value. */
878 outline: 1px dotted;
879}