sync both themes with toolkit windows theme changes in Mozilla 39 cycle - missing...
[themes.git] / LCARStrek / browser / preferences / in-content / preferences.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 file,
3 - You can obtain one at http://mozilla.org/MPL/2.0/. */
4
5/* === BEGIN shared/in-content/preferences.css === */
6
7@namespace html "http://www.w3.org/1999/xhtml";
8
9.main-content {
10 padding: 1.5em 0 0; /* That padding needs to match the upper stripe. */
11 overflow: auto;
12
13 /* This actually results in two black boxes extending to the right and bottom,
14 * leaving the LCARS-gray background only in a top stripe and
15 * a bit larger area on the top left.
16 * The prefpane will overlay that with the rounded shape we want. */
17 background-color: #A09090;
18 background-position: 3em 1.5em, 0px 5em;
19 background-image: linear-gradient(0deg, #000, #000), linear-gradient(0deg, #000, #000);
20 background-repeat: no-repeat;
21}
22
23#mainPrefPane {
24 padding: 10px 20px 0px;
25 border-radius: 1em 0 0 0;
26 background-color: #000000;
27
28 max-width: 800px;
29 font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif;
30 font-size: 1.25rem;
31 line-height: 22px;
32 color: #FF9F00;
33}
34
35* {
36 -moz-user-select: text;
37}
38
39button,
40treecol {
41 /* override the * rule */
42 -moz-user-select: none;
43}
44
45/* Category List */
46
47#categories {
48 max-height: 100vh;
49
50 background-color: #A09090;
51 padding-top: 4em;
52 margin: 0;
53 border-radius: 1em 0 0 0;
54 border: none;
55}
56
57#categories > scrollbox {
58 overflow-x: hidden !important;
59}
60
61.category {
62 background-color: #000000;
63 color: #FFCF00;
64 -moz-border-end-width: 0;
65 -moz-padding-start: 15px;
66 -moz-padding-end: 21px;
67 min-height: 40px;
68 transition: background-color 150ms;
69}
70
71.category:hover {
72 background-color: #FFCF00;
73 color: #000000;
74}
75
76.category[selected] {
77 background-color: #008484;
78 color: #000000;
79}
80
81#categories[keyboard-navigation="true"]:-moz-focusring > .category[current] {
82 border-top: 1px dotted #000000;
83 border-bottom: 1px dotted #000000;
84}
85
86.category-name {
87 line-height: 22px;
88 font-size: 1.25rem;
89 padding-bottom: 2px;
90 -moz-padding-start: 9px;
91 margin: 0;
92}
93
94/**
95 * We want the last category to always have non-0 getBoundingClientRect().bottom
96 * so we can use the value to figure out the max-height of the list in
97 * preferences.js, so use collapse instead of display: none; if it's hidden
98 */
99#categories > .category[hidden="true"] {
100 display: -moz-box;
101 visibility: collapse;
102}
103
104.category-icon {
105 width: 24px;
106 height: 24px;
107}
108
109#category-general > .category-icon {
110 list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#general");
111}
112
113#category-general:hover > .category-icon,
114#category-general[selected] > .category-icon {
115 list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#general-active");
116}
117
118#category-search > .category-icon {
119 list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#search");
120}
121
122#category-search:hover > .category-icon,
123#category-search[selected] > .category-icon {
124 list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#search-active");
125}
126
127#category-content > .category-icon {
128 list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#content");
129}
130
131#category-content:hover > .category-icon,
132#category-content[selected] > .category-icon {
133 list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#content-active");
134}
135
136#category-application > .category-icon {
137 list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#applications");
138}
139
140#category-application:hover > .category-icon,
141#category-application[selected] > .category-icon {
142 list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#applications-active");
143}
144
145#category-privacy > .category-icon {
146 list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#privacy");
147}
148
149#category-privacy:hover > .category-icon,
150#category-privacy[selected] > .category-icon {
151 list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#privacy-active");
152}
153
154#category-security > .category-icon {
155 list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#security");
156}
157
158#category-security:hover > .category-icon,
159#category-security[selected] > .category-icon {
160 list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#security-active");
161}
162
163#category-sync > .category-icon {
164 list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#sync");
165}
166
167#category-sync:hover > .category-icon,
168#category-sync[selected] > .category-icon {
169 list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#sync-active");
170}
171
172#category-advanced > .category-icon {
173 list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#advanced");
174}
175
176#category-advanced:hover > .category-icon,
177#category-advanced[selected] > .category-icon {
178 list-style-image: url("chrome://browser/skin/preferences/in-content/icons.svg#advanced-active");
179}
180
181@media (max-width: 800px) {
182 .category-name {
183 display: none;
184 }
185}
186
187/* header */
188
189#header-advanced {
190 border-bottom: none;
191 padding-bottom: 0;
192}
193
194.indent {
195 margin-top: 7px;
196 margin-bottom: 7px;
197}
198
199/* General Pane */
200
201#startupTable {
202 border-collapse: collapse;
203}
204
205#startupTable > tr > td {
206 padding: 0; /* remove the padding from html.css */
207}
208
209#startupTable > tr:not(:first-child) > td {
210 padding-top: 0.5em; /* add a spacing between the rows */
211}
212
213#startupTable > tr > .label-cell {
214 text-align: end;
215 width: 0; /* make the column as small as possible */
216}
217
218#startupTable > tr > .label-cell > label {
219 white-space: nowrap;
220}
221
222#startupTable > tr > .content-cell > menulist,
223#startupTable > tr > .content-cell > textbox {
224 width: calc(100% - 8px);
225 margin-left: 4px;
226 margin-right: 4px;
227}
228
229#startupTable > tr > .homepage-buttons {
230 display: flex;
231 flex-wrap: wrap;
232}
233
234#startupTable > tr > .homepage-buttons > .content-cell-item {
235 flex-grow: 1;
236}
237
238#useFirefoxSync {
239 font-size: 90%;
240 -moz-margin-end: 8px !important;
241}
242
243#getStarted {
244 font-size: 90%;
245}
246
247#isNotDefaultLabel {
248 font-weight: bold;
249}
250
251/* Content pane */
252#playDRMContentLink {
253 /* Line up with the buttons in the other grid bits: */
254 margin-left: 4px !important;
255 margin-right: 4px !important;
256}
257
258/* Applications Pane Styles */
259
260#applicationsContent {
261 padding: 15px 0;
262}
263
264#filter {
265 -moz-margin-start: 0;
266}
267
268#handlersView {
269 height: 25em;
270}
271
272#handlersView > richlistitem {
273 min-height: 36px !important;
274}
275
276.typeIcon {
277 -moz-margin-start: 10px !important;
278 -moz-margin-end: 9px !important;
279}
280
281.actionIcon {
282 -moz-margin-start: 11px !important;
283 -moz-margin-end: 8px !important;
284}
285
286.actionsMenu {
287 min-height: 36px;
288}
289
290.actionsMenu > menupopup > menuitem {
291 -moz-padding-start: 10px !important;
292}
293
294.actionsMenu > menupopup > menuitem > .menu-iconic-left {
295 -moz-margin-end: 8px !important;
296}
297
298/* Collapse the non-active vboxes in decks to use only the height the
299 active vbox needs */
300#historyPane:not([selectedIndex="1"]) > #historyDontRememberPane,
301#historyPane:not([selectedIndex="2"]) > #historyCustomPane,
302#weavePrefsDeck:not([selectedIndex="1"]) > #hasAccount,
303#weavePrefsDeck:not([selectedIndex="2"]) > #needsUpdate,
304#weavePrefsDeck:not([selectedIndex="3"]) > #fxaDeterminingStatus,
305#weavePrefsDeck:not([selectedIndex="4"]) > #noFxaAccount,
306#weavePrefsDeck:not([selectedIndex="5"]) > #hasFxaAccount,
307#fxaLoginStatus:not([selectedIndex="1"]) > #fxaLoginUnverified,
308#fxaLoginStatus:not([selectedIndex="2"]) > #fxaLoginRejected {
309 visibility: collapse;
310}
311
312/* XXX This style is for bug 740213 and should be removed once that
313 bug has a solution. */
314description > html|a {
315 cursor: pointer;
316}
317
318#noFxaAccount {
319 /* Overriding the margins from the base preferences.css theme file.
320 These overrides can be simplified by fixing bug 1027174 */
321 margin: 0;
322}
323
324#weavePrefsDeck > vbox > label,
325#weavePrefsDeck > vbox > groupbox,
326#weavePrefsDeck > vbox > description,
327#weavePrefsDeck > vbox > #pairDevice > label,
328#weavePrefsDeck > #needsUpdate > hbox > #loginError,
329#weavePrefsDeck > #hasFxaAccount > hbox:not(#tosPP-normal) > label,
330#weavePrefsDeck > #hasFxaAccount > hbox:not(#tosPP-small) > label {
331 /* no margin-start for elements at the begin of a line */
332 -moz-margin-start: 0;
333}
334
335#advancedPrefs {
336 padding-bottom: 0; /* no padding needed in inContent prefs */
337}
338
339#tabsElement {
340/* -moz-margin-end: 4px; / add the 4px end-margin of other elements */
341}
342
343#telemetryLearnMore,
344#FHRLearnMore,
345#crashReporterLearnMore {
346 /* provide some margin between the links and the label text */
347 /* !important is needed to override the rules defined in common.css */
348 -moz-margin-start: 20px !important;
349 /* center the links */
350 margin-top: 8px;
351 margin-bottom: 8px;
352}
353
354#trackingProtectionImage {
355 width: 16px;
356 height: 16px;
357 list-style-image: url("chrome://browser/skin/bad-content-blocked-16.png");
358}
359
360@media (min-resolution: 2dppx) {
361 #trackingProtectionImage {
362 list-style-image: url("chrome://browser/skin/bad-content-blocked-16@2x.png");
363 }
364}
365
366#showUpdateHistory {
367 -moz-margin-start: 0;
368}
369
370/**
371 * Dialog
372 */
373
374#dialogOverlay {
375 background-color: rgba(0,0,0,0.75);
376 visibility: hidden;
377}
378
379#dialogBox {
380 background-color: #000000;
381 background-clip: content-box;
382 color: #FF9F00;
383 /* font-size: 14px; */
384 border: 1px solid #9C9CFF;
385 border-radius: 10px;
386 display: -moz-box;
387 margin: 0;
388 padding-right: 6px;
389 padding-left: 6px;
390}
391
392#dialogBox[resizable="true"] {
393 resize: both;
394 overflow: hidden;
395 min-height: 20em;
396 min-width: 66ch;
397}
398
399#dialogBox > .groupbox-title {
400 -moz-margin-start: 0;
401 -moz-margin-end: 0;
402/* padding: 3.5px 0;
403 background-color: #F1F1F1; */
404}
405
406#dialogTitle {
407 text-align: center;
408}
409
410.close-icon {
411 background-color: transparent !important;
412 border: none;
413 box-shadow: none;
414 height: 18px;
415 padding: 0;
416 min-width: 18px;
417}
418
419#dialogBox > .groupbox-title > caption {
420 margin: 0;
421 border-radius: 1000px;
422 background-color: #A09090;
423}
424
425#dialogBox > .groupbox-body {
426 -moz-appearance: none;
427 padding: 0;
428}
429
430#dialogFrame {
431 -moz-box-flex: 1;
432 /* Default dialog dimensions */
433 height: 20em;
434 width: 66ch;
435}
436
437.largeDialogContainer.doScroll {
438 overflow-y: auto;
439 -moz-box-flex: 1;
440}
441
442/**
443 * End Dialog
444 */
445
446/**
447 * Font dialog menulist fixes
448 */
449
450#defaultFontType,
451#serif,
452#sans-serif,
453#monospace {
454 min-width: 30ch;
455}
456
457/**
458 * Sync migration
459 */
460#sync-migrate-upgrade-description {
461 /* description elts need a min-width to wrap correctly - bug 630864? */
462 min-width: 100px
463}
464
465#sync-migration {
466 border: 1px solid #9C9CFF;
467 background-color: #000000;
468 color: #A09090;
469 text-shadow: none;
470 margin: 5px 0 0 0;
471 animation: fadein 3000ms;
472}
473
474@keyframes fadein {
475 from { opacity: 0; }
476 to { opacity: 1; }
477}
478
479/* === END shared/in-content/preferences.css === */
480
481caption {
482}
483
484.indent-small {
485 -moz-margin-start: 10px;
486}
487
488@media (min-resolution: 2dppx) {
489 checkbox:hover::before,
490 checkbox[checked]::before {
491 }
492
493 checkbox[checked]::before {
494 }
495}