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/. */
5 /* === BEGIN common.inc.css === */
7 @namespace html "http://www.w3.org/1999/xhtml";
8 @namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
12 font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
13 -moz-appearance: none;
14 background-color: #000000;
35 xul|caption > xul|label {
41 padding: 40px 48px 48px;
45 xul|prefpane > xul|*.content-box {
52 -moz-appearance: none;
57 -moz-padding-start: 0;
62 xul|groupbox xul|label {
63 / !important needed to override toolkit !important rule /
64 -moz-margin-start: 0 !important;
65 -moz-margin-end: 0 !important;
68 /* tabpanels and tabs */
71 -moz-appearance: none;
76 background-color: transparent;
82 border-top: 1px solid #c1c1c1;
83 border-bottom: 1px solid #c1c1c1;
84 background-color: #fbfbfb;
93 -moz-appearance: none;
98 background-color: #fbfbfb;
100 transition: background-color 50ms ease 0s;
104 background-color: #ebebeb;
108 background-color: #ebebeb;
109 padding-bottom: 0; / compensate the 4px border /
110 border-bottom: 4px solid #ff9500;
121 border-radius: 300px;
123 background-color: #C09070;
125 /* override forms.css */
129 /* xul buttons and menulists */
132 xul|colorpicker[type="button"],
134 -moz-appearance: none;
138 border: 1px solid #c1c1c1;
139 -moz-border-top-colors: none !important;
140 -moz-border-right-colors: none !important;
141 -moz-border-bottom-colors: none !important;
142 -moz-border-left-colors: none !important;
144 background-color: #fbfbfb;
147 html|button:enabled:hover,
148 xul|button:not([disabled="true"]):hover,
149 xul|colorpicker[type="button"]:not([disabled="true"]):hover,
150 xul|menulist:not([disabled="true"]):hover {
151 background-color: #FFCF00;
155 html|button:enabled:hover:active,
156 xul|button:not([disabled="true"]):hover:active,
157 xul|colorpicker[type="button"]:not([disabled="true"]):hover:active,
158 xul|menulist[open="true"]:not([disabled="true"]) {
159 background-color: #FF9F00;
163 html|button:disabled,
164 xul|button[disabled="true"],
165 xul|colorpicker[type="button"][disabled="true"],
166 xul|menulist[disabled="true"] {
168 background-color: #402858;
172 xul|colorpicker[type="button"] {
177 xul|button > xul|*.button-box,
178 xul|menulist > xul|*.menulist-label-box {
179 padding-right: 10px !important;
180 padding-left: 10px !important;
183 xul|menulist > xul|*.menulist-label-box > xul|*.menulist-icon {
184 -moz-margin-end: 5px;
187 xul|button[type="menu"] > xul|*.button-box > xul|*.button-menu-dropmarker {
188 -moz-appearance: none;
190 -moz-margin-start: 10px;
195 background-color: transparent;
196 list-style-image: url("chrome://global/skin/in-content/dropdown.svg#dropdown");
204 border: 1px solid #c1c1c1;
205 background-color: #ffcb00;
206 background-image: none;
209 list-style-image: url("chrome://global/skin/in-content/help-glyph.svg");
212 xul|*.help-button:not([disabled="true"]):hover {
213 background-color: #f4c200;
214 background-image: none;
217 xul|*.help-button:not([disabled="true"]):hover:active {
218 background-color: #eaba00;
219 background-image: none;
222 xul|*.close-icon > xul|*.button-box,
223 xul|*.help-button > xul|*.button-box {
226 padding-right: 0 !important;
227 padding-left: 0 !important;
230 xul|*.help-button > xul|*.button-box > xul|*.button-icon {
235 xul|*.help-button > xul|*.button-box > xul|*.button-text {
239 xul|*.spinbuttons-button {
240 -moz-margin-start: 10px !important;
241 -moz-margin-end: 2px !important;
244 xul|*.spinbuttons-up {
245 margin-top: 2px !important;
246 border-radius: 1px 1px 0 0;
249 xul|*.spinbuttons-down {
250 margin-bottom: 2px !important;
251 border-radius: 0 0 1px 1px;
254 xul|*.spinbuttons-button > xul|*.button-box {
255 padding: 1px 5px 2px !important;
258 xul|*.spinbuttons-up > xul|*.button-box > xul|*.button-icon {
259 list-style-image: url("chrome://global/skin/arrow/arrow-up.gif");
262 xul|*.spinbuttons-up[disabled="true"] > xul|*.button-box > xul|*.button-icon {
263 list-style-image: url("chrome://global/skin/arrow/arrow-up-dis.gif");
266 xul|*.spinbuttons-down > xul|*.button-box > xul|*.button-icon {
267 list-style-image: url("chrome://global/skin/arrow/arrow-dn.gif");
270 xul|*.spinbuttons-down[disabled="true"] > xul|*.button-box > xul|*.button-icon {
271 list-style-image: url("chrome://global/skin/arrow/arrow-dn-dis.gif");
274 xul|menulist:not([editable="true"]) > xul|*.menulist-dropmarker {
275 -moz-appearance: none;
276 -moz-margin-end: 4px;
279 background-color: transparent;
280 list-style-image: url("chrome://global/skin/in-content/dropdown.svg#dropdown");
283 xul|menulist:not([editable="true"]) > xul|*.menulist-dropmarker > xul|*.dropmarker-icon {
288 xul|menulist[disabled="true"]:not([editable="true"]) > xul|*.menulist-dropmarker {
289 list-style-image: url("chrome://global/skin/in-content/dropdown.svg#dropdown-disabled")
292 xul|menulist > xul|menupopup,
293 xul|button[type="menu"] > xul|menupopup {
294 -moz-appearance: none;
295 border: 1px solid rgba(23,50,77,0.4);
297 background-color: #fff;
300 xul|menulist > xul|menupopup xul|menu,
301 xul|menulist > xul|menupopup xul|menuitem,
302 xul|button[type="menu"] > xul|menupopup xul|menu,
303 xul|button[type="menu"] > xul|menupopup xul|menuitem {
304 -moz-appearance: none;
308 padding-bottom: 0.2em;
309 -moz-padding-start: 10px;
310 -moz-padding-end: 30px;
313 xul|menulist > xul|menupopup > xul|menu[_moz-menuactive="true"],
314 xul|menulist > xul|menupopup > xul|menuitem[_moz-menuactive="true"],
315 xul|button[type="menu"] > xul|menupopup > xul|menu[_moz-menuactive="true"],
316 xul|button[type="menu"] > xul|menupopup > xul|menuitem[_moz-menuactive="true"] {
318 background-color: rgba(0,149,221,0.25);
321 xul|menulist > xul|menupopup > xul|menu[selected="true"],
322 xul|menulist > xul|menupopup > xul|menuitem[selected="true"],
323 xul|button[type="menu"] > xul|menupopup > xul|menu[selected="true"],
324 xul|button[type="menu"] > xul|menupopup > xul|menuitem[selected="true"] {
326 background-color: #0095DD;
329 xul|menulist > xul|menupopup xul|menuseparator,
330 xul|button[type="menu"] > xul|menupopup xul|menuseparator {
331 -moz-appearance: none;
335 border-top: 1px solid rgba(23,50,77,0.4);
342 -moz-appearance: none;
346 text-shadow: 0 1px 1px #fefffe;
349 border: 1px solid #c1c1c1;
350 -moz-border-top-colors: none !important;
351 -moz-border-right-colors: none !important;
352 -moz-border-bottom-colors: none !important;
353 -moz-border-left-colors: none !important;
355 background-color: #fff;
359 xul|textbox[focused] {
360 border-color: #0095dd;
363 html|textbox:disabled,
364 xul|textbox[disabled="true"] {
373 /* font-size: 1.25rem;
376 text-decoration: none;
380 xul|*.text-link:hover,
381 xul|*.inline-link:hover {
383 text-decoration: underline;
387 xul|*.text-link:hover:active,
388 xul|*.inline-link:hover:active {
390 text-decoration: underline;
393 /* Checkboxes and radio buttons */
396 -moz-margin-start: 0;
399 xul|*.checkbox-check {
400 -moz-appearance: none;
404 border: 1px solid #c1c1c1;
405 -moz-margin-end: 10px;
406 background-color: #f1f1f1;
407 background-image: linear-gradient(#fff, rgba(255,255,255,0.8));
408 background-position: center center;
409 background-repeat: no-repeat;
410 box-shadow: 0 1px 1px 0 #fff, inset 0 2px 0 0 rgba(0,0,0,0.03);
413 xul|checkbox:not([disabled="true"]):hover > xul|*.checkbox-check {
414 border-color: #0095dd;
417 xul|*.checkbox-check[checked] {
418 background-image: url("chrome://global/skin/in-content/check.png"),
419 / * !important needed to override toolkit !important rule * /
420 linear-gradient(#fff, rgba(255,255,255,0.8)) !important;
423 xul|checkbox[disabled="true"] > xul|*.checkbox-check {
427 xul|*.checkbox-label-box {
428 -moz-margin-start: -1px; / * negative margin for the transparent border * /
429 -moz-padding-start: 0;
432 @media (min-resolution: 2dppx) {
433 xul|*.checkbox-check[checked] {
434 background-size: 12px 12px, auto;
435 background-image: url("chrome://global/skin/in-content/check@2x.png"),
436 linear-gradient(#fff, rgba(255,255,255,0.8)) !important;
440 xul|richlistitem > xul|*.checkbox-check {
445 -moz-appearance: none;
448 border: 1px solid #c1c1c1;
450 -moz-margin-end: 10px;
451 background-color: #f1f1f1;
452 background-image: linear-gradient(#fff, rgba(255,255,255,0.80));
453 box-shadow: 0 1px 1px 0 #fff, inset 0 2px 0 0 rgba(0,0,0,0.03);
456 xul|radio:not([disabled="true"]):hover > xul|*.radio-check {
457 border-color: #0095dd;
460 xul|*.radio-check[selected] {
461 background-image: radial-gradient(circle, rgb(23,146,229),
462 rgb(76,177,255) 5.5px, rgba(76,177,255,0.2) 6px,
464 linear-gradient(rgb(255,255,255), rgba(255,255,255,0.8));
467 xul|radio[disabled="true"] > xul|*.radio-check {
471 xul|*.radio-label-box {
472 -moz-margin-start: -1px; / * negative margin for the transparent border * /
473 -moz-margin-end: 10px;
474 -moz-padding-start: 0;
480 -moz-appearance: none;
481 background-color: #424f5a;
487 -moz-appearance: none;
489 -moz-border-end-width: 0;
490 -moz-padding-start: 15px;
491 -moz-padding-end: 21px;
493 transition: background-color 150ms;
496 xul|*.category:hover {
497 background-color: #5e6972;
500 xul|*.category[selected] {
501 background-color: #343f48;
503 -moz-padding-start: 11px; / compensate the 4px border /
504 -moz-border-start: solid 4px #ff9500;
507 xul|*#categories[keyboard-navigation="true"]:-moz-focusring > xul|*.category[current] {
508 border-top: 1px #ffffff dotted;
509 border-bottom: 1px #ffffff dotted;
516 -moz-padding-start: 9px;
528 /* border-bottom: 1px solid #A09090;
530 padding-bottom: 15px; */
543 -moz-appearance: none;
544 background-color: transparent;
549 xul|*.fileFieldContentBox {
550 background-color: transparent;
553 xul|*.fileFieldIcon {
554 -moz-margin-start: 10px;
558 xul|*.fileFieldLabel {
559 -moz-margin-start: -26px;
560 -moz-padding-start: 36px;
563 xul|textbox:-moz-locale-dir(rtl),
564 xul|*.fileFieldLabel:-moz-locale-dir(rtl),
565 xul|textbox + xul|button:-moz-locale-dir(ltr),
566 xul|filefield + xul|button:-moz-locale-dir(ltr) {
567 border-top-left-radius: 0;
568 border-bottom-left-radius: 0;
571 xul|textbox:-moz-locale-dir(ltr),
572 xul|*.fileFieldLabel:-moz-locale-dir(ltr),
573 xul|textbox + xul|button:-moz-locale-dir(rtl),
574 xul|filefield + xul|button:-moz-locale-dir(rtl) {
575 border-top-right-radius: 0;
576 border-bottom-right-radius: 0;
579 xul|textbox + xul|button,
580 xul|filefield + xul|button {
581 -moz-border-start: none;
584 /* === END common.inc.css === */
587 background-color: transparent;
591 xul|colorpicker[type="button"],
596 xul|menulist:not([editable="true"]) > xul|*.menulist-dropmarker {
602 -moz-padding-start: 0;
606 -moz-binding: url("chrome://global/content/bindings/radio.xml#radio");
607 -moz-margin-start: 0;
608 -moz-padding-start: 0;
612 xul|*.checkbox-icon {
616 html|a:-moz-focusring,
617 xul|*.text-link:-moz-focusring,
618 xul|*.inline-link:-moz-focusring {
619 /* Don't specify the outline-color, we should always use initial value. */