second part of syncing LCARStrek with Firefox 39 windows theme changes
[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#defaultFontSizeLabel {
259 /* !important needed to override common !important rule */
260 -moz-margin-start: 4px !important;
261}
262
263/* Applications Pane Styles */
264
265#applicationsContent {
266 padding: 15px 0;
267}
268
269#filter {
270 -moz-margin-start: 0;
271}
272
273#handlersView {
274 height: 25em;
275}
276
277#handlersView > richlistitem {
278 min-height: 36px !important;
279}
280
281.typeIcon {
282 -moz-margin-start: 10px !important;
283 -moz-margin-end: 9px !important;
284}
285
286.actionIcon {
287 -moz-margin-start: 11px !important;
288 -moz-margin-end: 8px !important;
289}
290
291.actionsMenu {
292 min-height: 36px;
293}
294
295.actionsMenu > menupopup > menuitem {
296 -moz-padding-start: 10px !important;
297}
298
299.actionsMenu > menupopup > menuitem > .menu-iconic-left {
300 -moz-margin-end: 8px !important;
301}
302
303/* Collapse the non-active vboxes in decks to use only the height the
304 active vbox needs */
305#historyPane:not([selectedIndex="1"]) > #historyDontRememberPane,
306#historyPane:not([selectedIndex="2"]) > #historyCustomPane,
307#weavePrefsDeck:not([selectedIndex="1"]) > #hasAccount,
308#weavePrefsDeck:not([selectedIndex="2"]) > #needsUpdate,
309#weavePrefsDeck:not([selectedIndex="3"]) > #fxaDeterminingStatus,
310#weavePrefsDeck:not([selectedIndex="4"]) > #noFxaAccount,
311#weavePrefsDeck:not([selectedIndex="5"]) > #hasFxaAccount,
312#fxaLoginStatus:not([selectedIndex="1"]) > #fxaLoginUnverified,
313#fxaLoginStatus:not([selectedIndex="2"]) > #fxaLoginRejected {
314 visibility: collapse;
315}
316
317/* XXX This style is for bug 740213 and should be removed once that
318 bug has a solution. */
319description > html|a {
320 cursor: pointer;
321}
322
323#noFxaAccount {
324 /* Overriding the margins from the base preferences.css theme file.
325 These overrides can be simplified by fixing bug 1027174 */
326 margin: 0;
327}
328
329#weavePrefsDeck > vbox > label,
330#weavePrefsDeck > vbox > groupbox,
331#weavePrefsDeck > vbox > description,
332#weavePrefsDeck > vbox > #pairDevice > label,
333#weavePrefsDeck > #needsUpdate > hbox > #loginError,
334#weavePrefsDeck > #hasFxaAccount > hbox:not(#tosPP-normal) > label,
335#weavePrefsDeck > #hasFxaAccount > hbox:not(#tosPP-small) > label {
336 /* no margin-start for elements at the begin of a line */
337 -moz-margin-start: 0;
338}
339
340#advancedPrefs {
341 padding-bottom: 0; /* no padding needed in inContent prefs */
342}
343
344#tabsElement {
345/* -moz-margin-end: 4px; / add the 4px end-margin of other elements */
346}
347
348#telemetryLearnMore,
349#FHRLearnMore,
350#crashReporterLearnMore {
351 /* provide some margin between the links and the label text */
352 /* !important is needed to override the rules defined in common.css */
353 -moz-margin-start: 20px !important;
354 /* center the links */
355 margin-top: 8px;
356 margin-bottom: 8px;
357}
358
359#trackingProtectionImage {
360 width: 16px;
361 height: 16px;
362 list-style-image: url("chrome://browser/skin/bad-content-blocked-16.png");
363}
364
365@media (min-resolution: 2dppx) {
366 #trackingProtectionImage {
367 list-style-image: url("chrome://browser/skin/bad-content-blocked-16@2x.png");
368 }
369}
370
371#showUpdateHistory {
372 -moz-margin-start: 0;
373}
374
375/**
376 * Dialog
377 */
378
379#dialogOverlay {
380 background-color: rgba(0,0,0,0.75);
381 visibility: hidden;
382}
383
384#dialogBox {
385 background-color: #000000;
386 background-clip: content-box;
387 color: #FF9F00;
388 /* font-size: 14px; */
389 border: 1px solid #9C9CFF;
390 border-radius: 10px;
391 display: -moz-box;
392 margin: 0;
393 padding-right: 6px;
394 padding-left: 6px;
395}
396
397#dialogBox[resizable="true"] {
398 resize: both;
399 overflow: hidden;
400 min-height: 20em;
401 min-width: 66ch;
402}
403
404#dialogBox > .groupbox-title {
405 -moz-margin-start: 0;
406 -moz-margin-end: 0;
407/* padding: 3.5px 0;
408 background-color: #F1F1F1; */
409}
410
411#dialogTitle {
412 text-align: center;
413}
414
415.close-icon {
416 background-color: transparent !important;
417 border: none;
418 box-shadow: none;
419 height: 18px;
420 padding: 0;
421 min-width: 18px;
422}
423
424#dialogBox > .groupbox-title > caption {
425 margin: 0;
426 border-radius: 1000px;
427 background-color: #A09090;
428}
429
430#dialogBox > .groupbox-body {
431 -moz-appearance: none;
432 padding: 0;
433}
434
435#dialogFrame {
436 -moz-box-flex: 1;
437 /* Default dialog dimensions */
438 height: 20em;
439 width: 66ch;
440}
441
442.largeDialogContainer.doScroll {
443 overflow-y: auto;
444 -moz-box-flex: 1;
445}
446
447/**
448 * End Dialog
449 */
450
451/**
452 * Font dialog menulist fixes
453 */
454
455#defaultFontType,
456#serif,
457#sans-serif,
458#monospace {
459 min-width: 30ch;
460}
461
462/**
463 * Sync migration
464 */
465#sync-migrate-upgrade-description {
466 /* description elts need a min-width to wrap correctly - bug 630864? */
467 min-width: 100px
468}
469
470#sync-migration {
471 border: 1px solid #9C9CFF;
472 background-color: #000000;
473 color: #A09090;
474 text-shadow: none;
475 margin: 5px 0 0 0;
476 animation: fadein 3000ms;
477}
478
479@keyframes fadein {
480 from { opacity: 0; }
481 to { opacity: 1; }
482}
483
484/* === END shared/in-content/preferences.css === */
485
486caption {
487}
488
489.indent-small {
490 -moz-margin-start: 10px;
491}
492
493@media (min-resolution: 2dppx) {
494 checkbox:hover::before,
495 checkbox[checked]::before {
496 }
497
498 checkbox[checked]::before {
499 }
500}