fix a parsing error and add some modification to support current Nightly (when it...
[themes.git] / LCARStrek / mozapps / extensions / extensions.css
CommitLineData
9099c61d
RK
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/. */
4c18c82c 4
5d891ecf 5@import url("chrome://global/skin/in-content/common.css");
c1f7cc84 6
f2e2cfd1
RK
7#addons-page {
8 padding: 3px;
9 margin: 0;
10}
11
5d891ecf
RK
12.main-content {
13 padding: 0;
0de07750
RK
14}
15
5d891ecf
RK
16#nav-header {
17 min-height: 39px;
0de07750
RK
18}
19
5d891ecf
RK
20.view-pane > .list > scrollbox {
21 border-radius: 1em 0 0 0;
dae45075
RK
22/* padding-right: 48px;
23 padding-left: 48px; */
0de07750
RK
24}
25
5d891ecf
RK
26#search-list > scrollbox {
27 border-radius: 0;
0de07750
RK
28}
29
569543b3 30/*** global warnings ***/
a67d7bb0 31
72a6fd39
RK
32.global-warning-container {
33 overflow-x: hidden;
34}
35
569543b3
RK
36.global-warning {
37 -moz-box-align: center;
38 padding: 0 8px;
39 color: #000000;
40 font-weight: bold;
41}
42
43#addons-page[warning] .global-warning-container {
44 background-color: #FFCF00;
45}
46
47#detail-view .global-warning {
48 padding: 4px 12px;
f993773d 49 border-bottom: 3px solid #000000;
569543b3
RK
50}
51
f777a4f1 52@media (max-width: 600px) {
72a6fd39
RK
53 .global-warning-text {
54 display: none;
55 }
56
57 .global-warning .warning-icon {
58 /* background-color: #FFF;
59 box-shadow: 0px 0px 2px 5px #FFF;
60 border-radius: 10px; */
61 }
62}
63
f993773d 64/*** global informations ***/
f993773d 65
e1313d59
RK
66/* Plugins aren't yet disabled by safemode (bug 342333),
67 so don't show that warning when viewing plugins. */
68#addons-page[warning="safemode"] .view-pane[type="plugin"] .global-warning-container,
69#addons-page[warning="safemode"] #detail-view[loading="true"] .global-warning-container {
70 background-color: inherit;
71 background-image: none;
72}
73
569543b3
RK
74/*** notification icons ***/
75
5d891ecf
RK
76.warning-icon,
77.error-icon,
78.pending-icon,
79.info-icon {
569543b3
RK
80 width: 16px;
81 height: 16px;
ae19a7b3 82 margin: 1px 0;
569543b3
RK
83}
84
5d891ecf 85.warning-icon {
7729765c 86 list-style-image: url("chrome://mozapps/skin/extensions/alerticon-warning.svg");
5d891ecf
RK
87}
88
569543b3 89.error-icon {
7729765c 90 list-style-image: url("chrome://mozapps/skin/extensions/alerticon-error.svg");
569543b3
RK
91}
92
93.pending-icon,
94.info-icon {
7729765c 95 list-style-image: url("chrome://mozapps/skin/extensions/alerticon-info-positive.svg");
569543b3 96}
4c18c82c 97
72a6fd39
RK
98.addon-view[pending="disable"] .pending-icon,
99.addon-view[pending="uninstall"] .pending-icon {
7729765c 100 list-style-image: url("chrome://mozapps/skin/extensions/alerticon-info-negative.svg");
72a6fd39
RK
101}
102
72a6fd39
RK
103/*** view alert boxes ***/
104
105.alert-container {
106 -moz-box-align: center;
dae45075
RK
107 margin-right: 48px;
108 margin-left: 48px;
6598e84c 109 padding-top: .5em;
72a6fd39
RK
110}
111
112.alert-spacer-before {
113 -moz-box-flex: 1;
114}
115
116.alert-spacer-after {
117 -moz-box-flex: 3;
118}
119
120.alert {
121 -moz-box-align: center;
122 padding: 10px;
123 color: #FF9F00;
124 border: 1px solid #9C9CFF;
125 border-radius: 8px;
126 background-color: #000000;
38b75e2e 127 background-clip: padding-box;
72a6fd39
RK
128}
129
130.alert .alert-title {
131 font-weight: bold;
132 font-size: 200%;
133 margin-bottom: 15px;
134}
135
154ee8b3 136.alert button {
72a6fd39
RK
137 margin: 1em 2em;
138}
139
140.loading {
7c1e433b 141 list-style-image: url("chrome://global/skin/icons/loading.png");
72a6fd39
RK
142 padding-left: 20px;
143 padding-right: 20px;
144}
145
7c1e433b
RK
146@media (min-resolution: 1.1dppx) {
147 .loading > image {
148 width: 16px;
149 list-style-image: url("chrome://global/skin/icons/loading@2x.png");
150 }
151}
152
7729765c
RK
153button.warning {
154 list-style-image: url("chrome://mozapps/skin/extensions/alerticon-warning.svg");
155}
72a6fd39 156
4c18c82c
RK
157/*** category selector ***/
158
159#categories {
5d891ecf 160 padding-top: 0;/*31px;*/
706c344c
RK
161}
162
4c18c82c 163.category[disabled] {
5d891ecf 164 min-height: 0;
4c18c82c 165 opacity: 0;
5d891ecf 166 transition-property: min-height, opacity;
71a617ff 167 transition-duration: 1s, 0.8s;
e10e7add
RK
168}
169
4c18c82c 170.category:not([disabled]) {
5d891ecf
RK
171 min-height: 40px;
172 transition-property: min-height, opacity;
71a617ff 173 transition-duration: 1s, 0.8s;
e10e7add
RK
174}
175
72a6fd39 176/* Maximize the size of the viewport when the window is small */
f777a4f1 177@media (max-width: 800px) {
72a6fd39
RK
178 .category-name {
179 display: none;
180 }
181}
182
4c18c82c
RK
183.category-badge {
184 background-color: #E7ADE7;
185 padding: 2px 8px;
72a6fd39 186 margin: 6px 0;
dae45075 187 margin-inline-start: 6px;
5d891ecf 188 border-radius: 100%;
4c18c82c
RK
189 color: #000000;
190 font-weight: bold;
191 text-align: center;
e10e7add
RK
192}
193
4c18c82c 194.category-badge[value="0"] {
5d891ecf 195 display: none;
e10e7add
RK
196}
197
4c18c82c
RK
198#category-search > .category-icon {
199 list-style-image: url("chrome://mozapps/skin/extensions/category-search.png");
200}
201#category-discover > .category-icon {
202 list-style-image: url("chrome://mozapps/skin/extensions/category-discover.png");
203}
f993773d 204#category-locale > .category-icon {
4c18c82c
RK
205 list-style-image: url("chrome://mozapps/skin/extensions/category-languages.png");
206}
f993773d 207#category-extension > .category-icon {
4c18c82c
RK
208 list-style-image: url("chrome://mozapps/skin/extensions/category-extensions.png");
209}
89eb2c89
RK
210#category-service > .category-icon {
211 list-style-image: url("chrome://mozapps/skin/extensions/category-service.png");
212}
f993773d 213#category-theme > .category-icon {
4c18c82c
RK
214 list-style-image: url("chrome://mozapps/skin/extensions/category-themes.png");
215}
f993773d 216#category-plugin > .category-icon {
4c18c82c 217 list-style-image: url("chrome://mozapps/skin/extensions/category-plugins.png");
e10e7add 218}
1e29db46
RK
219#category-dictionary > .category-icon {
220 list-style-image: url("chrome://mozapps/skin/extensions/category-dictionaries.png");
221}
2e88f3cc
RK
222#category-experiment > .category-icon {
223 list-style-image: url("chrome://mozapps/skin/extensions/category-experiments.png");
224}
0de07750
RK
225#category-availableUpdates > .category-icon {
226 list-style-image: url("chrome://mozapps/skin/extensions/category-available.png");
227}
228#category-recentUpdates > .category-icon {
229 list-style-image: url("chrome://mozapps/skin/extensions/category-recent.png");
230}
e10e7add 231
f2e2cfd1
RK
232/*** main content ***/
233
234#addons-page > hbox {
5d891ecf 235 /* This applies to the box surrounding all content. */
f2e2cfd1 236 background-color: #A09090;
5d891ecf 237 border-radius: 1em 0 0 0;
f2e2cfd1
RK
238}
239
240.main-content {
f2e2cfd1 241 border: none;
7729765c 242 padding-bottom: 0;
5d891ecf
RK
243}
244
245#view-port {
6598e84c
RK
246}
247
248#headered-views-content {
f2e2cfd1 249 border-radius: 1em 0 0 0;
6598e84c 250 background-color: #000000;
f2e2cfd1 251}
4c18c82c
RK
252
253/*** header ***/
254
255#header {
706c344c 256 height: 2em;
f2e2cfd1 257 padding: 3px;
5d891ecf 258 background-color: #A09090;
3327253e
RK
259}
260
89eb2c89
RK
261@media (max-width: 600px) {
262 #header-search {
263 width: 12em;
264 }
265}
266
0de07750 267#header-utils-btn {
e6947267 268 list-style-image: url("chrome://mozapps/skin/extensions/utilities.svg#utilities");
dae45075 269 margin-inline-end: 16px;
0de07750
RK
270}
271
ae19a7b3
RK
272#header-utils-btn:hover,
273#header-utils-btn:hover:active,
274#header-utils-btn[open="true"] {
e6947267 275 list-style-image: url("chrome://mozapps/skin/extensions/utilities.svg#utilities-hover");
ae19a7b3
RK
276}
277
ae19a7b3
RK
278#header-utils-btn > .button-box > .button-menu-dropmarker {
279 border: none;
280 background: transparent;
281}
282
283#header-utils-btn:hover > .button-box > .button-menu-dropmarker {
284 list-style-image: url("chrome://global/skin/arrow/arrow-down-hover.gif");
285}
286
4c18c82c 287.view-header {
dae45075 288 margin: 0 48px;
a67d7bb0
RK
289 background-color: #9C9CFF;
290 color: #000000;
569543b3 291 border-radius: 8px;
ae19a7b3 292 padding: 0px 1em;
4c18c82c 293 margin: 3px;
e10e7add
RK
294}
295
5d891ecf
RK
296.header-button {
297}
298
299.header-button[disabled="true"] > .toolbarbutton-icon {
300}
301
302.header-button:not([disabled="true"]):hover,
303#header-utils-btn:not([disabled="true"]):hover {
304 cursor: pointer;
305}
306
307.header-button > .toolbarbutton-text {
308 display: none;
309}
310
311.nav-button {
312 list-style-image: url("chrome://communicator/skin/icons/communicatoricons.png");
313}
314
315#forward-btn {
dae45075 316 border-inline-start: none;
5d891ecf
RK
317}
318
319#back-btn:-moz-locale-dir(ltr),
320#forward-btn:-moz-locale-dir(rtl) {
321 -moz-image-region: rect(42px 25px 63px 0px);
322}
323
324#back-btn[disabled="true"]:-moz-locale-dir(ltr),
325#forward-btn[disabled="true"]:-moz-locale-dir(rtl) {
326 -moz-image-region: rect(42px 50px 63px 25px);
327}
328
329#back-btn:-moz-locale-dir(rtl),
330#forward-btn:-moz-locale-dir(ltr) {
331 -moz-image-region: rect(63px 25px 84px 0px);
332}
333
334#back-btn[disabled="true"]:-moz-locale-dir(rtl),
335#forward-btn[disabled="true"]:-moz-locale-dir(ltr) {
336 -moz-image-region: rect(63px 50px 84px 25px);
337}
4c18c82c
RK
338
339/*** sorters ***/
340
341.sort-controls {
ae19a7b3 342 border-right: 3px solid #000000;
4c18c82c
RK
343}
344
345.sorter {
4c18c82c
RK
346 border: none;
347 border-left: 3px solid #000000;
4c18c82c 348 background-color: transparent;
5d891ecf 349 color: #000000;
569543b3 350 border-radius: 0;
72a6fd39 351 margin: 0;
4c18c82c
RK
352 min-width: 12px !important;
353 -moz-box-direction: reverse;
354}
ae19a7b3
RK
355.sorter:hover {
356 background-color: #FFCF00;
357 color: #000000;
358}
4c18c82c 359
72a6fd39
RK
360.sorter .button-box {
361 padding-top: 0;
362 padding-bottom: 0;
363}
364
4c18c82c
RK
365.sorter[checkState="1"],
366.sorter[checkState="2"] {
e10e7add
RK
367 background-color: #008484;
368 color: #FFCF00;
369}
370
4c18c82c
RK
371.sorter[checkState="1"] {
372 list-style-image: url("chrome://global/skin/arrow/arrow-down.gif");
e10e7add
RK
373}
374
4c18c82c
RK
375.sorter[checkState="2"] {
376 list-style-image: url("chrome://global/skin/arrow/arrow-up.gif");
e10e7add
RK
377}
378
4c18c82c 379.sorter .button-icon {
dae45075 380 margin-inline-start: 6px;
e10e7add
RK
381}
382
4c18c82c 383
1169dad4
RK
384/*** discover view ***/
385
6598e84c
RK
386#discover-view {
387 background-image: linear-gradient(#A09090 28px, #000000 28px, #000000 100%);
388}
389
1169dad4
RK
390.discover-spacer-before,
391.discover-spacer-after {
392 -moz-box-flex: 1;
393}
394
395#discover-error .alert {
396 max-width: 45em;
397 -moz-box-flex: 1;
398}
399
400.discover-logo {
401 list-style-image: url("chrome://mozapps/skin/extensions/discover-logo.png");
dae45075 402 margin-inline-end: 15px;
1169dad4
RK
403}
404
405.discover-title {
406 font-weight: bold;
407 font-size: 24px;
408 /* font-family: MetaWebPro-Book, "Trebuchet MS", sans-serif; */
409 margin: 0 0 15px 0;
410}
411
412.discover-description {
413 text-align: justify;
414 margin: 0 0 15px 0;
415}
416
417.discover-footer {
418 text-align: justify;
419}
420
5d891ecf
RK
421#discover-browser {
422 border-radius: 1em 0px 0px;
423}
1169dad4 424
4c18c82c
RK
425/*** list ***/
426
427.list {
72a6fd39 428 margin: 0;
ed351b91 429 border-width: 0 !important;
706c344c 430 background-color: transparent;
4c18c82c
RK
431}
432
ed351b91
RK
433.list > scrollbox > .scrollbox-innerbox {
434 border: 1px dotted transparent;
435}
436
437.list:-moz-focusring > scrollbox > .scrollbox-innerbox {
438 border-color: #008484;
439}
440
706c344c
RK
441.addon {
442 border-bottom: 1px solid #9C9CFF;
443 padding: 5px;
72a6fd39 444 background-origin: border-box;
e10e7add
RK
445}
446
5d891ecf
RK
447.addon:not(:only-child):last-child {
448 border-bottom-width: 0;
449}
450
706c344c 451.details {
4c18c82c 452 cursor: pointer;
706c344c 453 margin: 0;
dae45075 454 margin-inline-start: 10px;
e10e7add
RK
455}
456
706c344c
RK
457.icon-container {
458 width: 48px;
459 height: 48px;
a0885fa2 460 margin: 3px 7px;
38b75e2e
RK
461 -moz-box-align: center;
462 -moz-box-pack: center;
e10e7add
RK
463}
464
706c344c 465.icon {
7729765c 466 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric.svg");
706c344c
RK
467 max-width: 48px;
468 max-height: 48px;
e10e7add
RK
469}
470
5d891ecf 471.content-inner-container {
dae45075 472 margin-inline-end: 5px;
5d891ecf
RK
473}
474
72a6fd39 475.addon[active="false"] .icon {
441d0294 476 filter: grayscale(1);
72a6fd39
RK
477}
478
569543b3 479.addon-view[type="theme"] .icon {
4c18c82c 480 list-style-image: url("chrome://mozapps/skin/extensions/themeGeneric.png");
e10e7add
RK
481}
482
569543b3 483.addon-view[type="locale"] .icon {
d15f39a1
RK
484 list-style-image: url("chrome://mozapps/skin/extensions/localeGeneric.png");
485}
486
569543b3 487.addon-view[type="plugin"] .icon {
4c18c82c 488 list-style-image: url("chrome://mozapps/skin/plugins/pluginGeneric.png");
e10e7add
RK
489}
490
1e29db46
RK
491.addon-view[type="dictionary"] .icon {
492 list-style-image: url("chrome://mozapps/skin/extensions/dictionaryGeneric.png");
493}
494
2e88f3cc
RK
495.addon-view[type="experiment"] .icon {
496 list-style-image: url("chrome://mozapps/skin/extensions/experimentGeneric.png");
497}
498
8a933f1e 499.name-container {
7729765c 500 font-size: 1.3rem;
72a6fd39 501 font-weight: bold;
a67d7bb0 502 color: #9C9CFF;
72a6fd39 503 margin-bottom: 0;
38b75e2e 504 -moz-box-align: end;
c1f7cc84 505 -moz-box-flex: 1;
72a6fd39
RK
506}
507
1a44a283
RK
508.legacy-warning {
509 background-color: #FFCF00;
510 color: #000000;
511 padding: 4px 5px 3px;
512 font-size: 0.9rem;
513 font-weight: 600;
514 -moz-user-focus: ignore;
515}
516
517.legacy-warning:hover {
518 background-color: #FF9F00;
519 color: #000000;
520 text-decoration: none;
521}
522
523#detail-view .legacy-warning {
524 margin-top: 0.78rem;
525}
526
72a6fd39
RK
527.creator {
528 font-weight: bold;
529}
530
706c344c 531.description-container {
dae45075 532 margin-inline-start: 6px;
38b75e2e 533 -moz-box-align: center;
7729765c 534 font-size: 1.25rem;
e10e7add
RK
535}
536
706c344c
RK
537.description {
538 margin: 0;
539}
540
72a6fd39
RK
541.warning,
542.pending,
543.error,
544.info {
dae45075 545 margin-inline-start: 48px;
72a6fd39 546 font-weight: bold;
38b75e2e
RK
547 -moz-box-align: center;
548}
549
550.content-container,
551.basicinfo-container {
552 -moz-box-align: start;
553}
554
555.addon[status="installing"] > .content-container {
556 -moz-box-align: stretch;
557}
558
559.update-info-container {
560 -moz-box-align: center;
561}
562
38b75e2e
RK
563.update-available {
564 -moz-box-align: end;
565}
566
567.install-status-container {
568 -moz-box-pack: end;
569 -moz-box-align: end;
570}
571
572.name-outer-container {
573 -moz-box-pack: center;
574}
575
576.relnotes-toggle-container,
577.icon-outer-container {
578 -moz-box-pack: start;
579}
580
581.status-container,
582.control-container {
583 -moz-box-pack: end;
706c344c
RK
584}
585
72a6fd39 586.addon-view .warning {
706c344c
RK
587 color: #FFCF00;
588}
589
72a6fd39 590.addon-view .error {
4c18c82c 591 color: #FF0000;
706c344c
RK
592}
593
72a6fd39 594.addon-view .pending {
706c344c 595 color: #008484;
e10e7add
RK
596}
597
72a6fd39
RK
598.addon-view[pending="disable"] .pending,
599.addon-view[pending="uninstall"] .pending {
600 color: #FF9C00;
e10e7add
RK
601}
602
0de07750
RK
603.addon .relnotes-container {
604 -moz-box-align: start;
dae45075 605 margin-inline-start: 6px;
72a6fd39 606 height: 0;
0de07750
RK
607 overflow: hidden;
608 opacity: 0;
71a617ff
RK
609 transition-property: height, opacity;
610 transition-duration: 0.5s, 0.5s;
0de07750
RK
611}
612
613.addon[show-relnotes] .relnotes-container {
614 opacity: 1;
71a617ff
RK
615 transition-property: height, opacity;
616 transition-duration: 0.5s, 0.5s;
0de07750
RK
617}
618
619.addon .relnotes-header {
620 font-weight: bold;
72a6fd39 621 margin: 10px 0;
0de07750
RK
622}
623
624.addon .relnotes-toggle {
625 border: none;
626 background: transparent;
627 font-weight: bold;
628 -moz-box-direction: reverse;
629 cursor: pointer;
630 list-style-image: url("chrome://global/skin/arrow/arrow-down.gif");
631}
632
633.addon .relnotes-toggle > .button-box > .button-icon {
dae45075 634 padding-inline-start: 4px;
0de07750
RK
635}
636
637.addon[show-relnotes] .relnotes-toggle {
638 list-style-image: url("chrome://global/skin/arrow/arrow-up.gif");
639}
640
7729765c
RK
641.addon-view[notification],
642.addon-view[pending] {
643 --view-highlight-color: transparent;
644 /*
645 background-image: radial-gradient(at 50% 0%,
646 var(--view-highlight-color) 0%,
647 transparent 75%);
648 */
649 background-color: var(--view-highlight-color);
650}
651
72a6fd39 652.addon-view[notification="warning"] {
7729765c 653 --view-highlight-color: #FFCF00;
72a6fd39
RK
654 color: #000000;
655}
656
657.addon-view[notification="warning"] .warning {
658 color: #000000;
659}
660
a67d7bb0
RK
661.addon-view[notification="warning"] .name-container {
662 color: #000000;
663}
664
5d891ecf
RK
665.addon-view[notification="warning"] .text-link:hover {
666 color: #000000;
667}
668
72a6fd39 669.addon-view[notification="error"] {
7729765c 670 --view-highlight-color: #FF0000;
72a6fd39
RK
671 color: #000000;
672}
673
674.addon-view[notification="error"] .error {
675 color: #000000;
676}
677
678.addon-view[notification="info"] {
7729765c 679 --view-highlight-color: #9C9CFF;
72a6fd39
RK
680 color: #000000;
681}
682
683.addon-view[pending="enable"],
684.addon-view[pending="upgrade"],
685.addon-view[pending="install"] {
7729765c 686 --view-highlight-color: #008484;
72a6fd39
RK
687}
688
34aa92fd
RK
689.addon-view[pending="enable"] .pending,
690.addon-view[pending="upgrade"] .pending,
691.addon-view[pending="install"] .pending {
692 color: #000000;
693}
694
72a6fd39
RK
695.addon-view[pending="disable"],
696.addon-view[pending="uninstall"] {
697 color: #8050B0;
698}
699
0de07750 700
4c18c82c
RK
701/*** item - uninstalled ***/
702
703.addon[status="uninstalled"] {
704 border: none;
e10e7add
RK
705}
706
4c18c82c
RK
707.addon[status="uninstalled"] > .container {
708 -moz-box-align: center;
709 padding: 4px 20px;
710 background-color: #8050B0;
569543b3 711 border-radius: 8px;
4c18c82c 712 font-size: 120%;
e10e7add
RK
713}
714
4c18c82c
RK
715.addon[status="uninstalled"][selected] {
716 background-color: transparent;
e10e7add
RK
717}
718
72a6fd39
RK
719.addon[selected] {
720 background-color: #008484;
a67d7bb0 721 color: #FF9F00;
72a6fd39
RK
722}
723
724.addon[selected] .name-container {
a67d7bb0
RK
725 color: #FFCF00;
726}
727
5d891ecf
RK
728.addon[active="false"] {
729 background-color: #8050B0;
730 color: #E7ADE7;
731}
732
733.addon-view[active="false"] .name-container {
734 color: #E7ADE7;
735 color: #000000;
736}
737
a67d7bb0
RK
738.addon[active="false"][selected] {
739 color: #E7ADE7;
72a6fd39
RK
740}
741
742.addon[active="false"][selected] .name-container {
a67d7bb0 743 color: #E7ADE7;
72a6fd39
RK
744}
745
4c18c82c 746
4c18c82c
RK
747/*** search view ***/
748
706c344c
RK
749#search-filter {
750 padding: 5px 20px;
dae45075
RK
751/* margin-right: 48px;
752 margin-left: 48px;*/
4c18c82c
RK
753 -moz-box-align: center;
754 background-color: #000000;
755 font-size: 120%;
72a6fd39
RK
756 border-bottom: 1px solid #9C9CFF;
757 overflow-x: hidden;
e10e7add
RK
758}
759
706c344c
RK
760#search-filter-label {
761 font-weight: bold;
762 color: #FFCF00;
dae45075 763 margin-inline-end: 10px;
706c344c 764}
4c18c82c 765
0de07750
RK
766#search-allresults-link {
767 margin-top: 1em;
768 margin-bottom: 2em;
769}
770
4c18c82c
RK
771/*** detail view ***/
772
569543b3 773#detail-view .loading {
4c18c82c 774 opacity: 0;
e10e7add
RK
775}
776
569543b3 777#detail-view[loading-extended] .loading {
4c18c82c 778 opacity: 1;
71a617ff
RK
779 transition-property: opacity;
780 transition-duration: 1s;
e10e7add
RK
781}
782
4c18c82c 783.detail-view-container {
72a6fd39 784 padding: 0 2em 2em 2em;
7729765c 785 font-size: 1.25rem;
e10e7add
RK
786}
787
569543b3 788#detail-notifications {
72a6fd39 789 margin-top: 1em;
569543b3 790 margin-bottom: 2em;
e10e7add
RK
791}
792
569543b3
RK
793#detail-notifications .warning,
794#detail-notifications .pending,
72a6fd39 795#detail-notifications .error {
dae45075 796 margin-inline-start: 0;
e10e7add
RK
797}
798
f777a4f1
RK
799#detail-icon-container {
800 width: 64px;
dae45075 801 margin-inline-end: 10px;
72a6fd39 802 margin-top: 6px;
f777a4f1
RK
803}
804
805#detail-icon {
72a6fd39
RK
806 max-width: 64px;
807 max-height: 64px;
e10e7add
RK
808}
809
569543b3
RK
810#detail-summary {
811 margin-bottom: 2em;
e10e7add
RK
812}
813
569543b3 814#detail-name-container {
7729765c
RK
815 font-size: 2.5rem;
816 font-weight: normal;
d15f39a1
RK
817}
818
5d891ecf 819#detail-screenshot-box {
dae45075 820 margin-inline-end: 2em;
7c1e433b 821/* background-color: white;*/
5d891ecf
RK
822}
823
824
825#detail-screenshot {
6831f2a0
RK
826 max-width: 300px;
827 max-height: 300px;
18f5421a
RK
828}
829
904e5040 830#detail-screenshot[loading] {
7c1e433b 831 background-image: url("chrome://global/skin/icons/loading.png");
904e5040
RK
832 background-position: 50% 50%;
833 background-repeat: no-repeat;
834}
835
7c1e433b
RK
836@media (min-resolution: 1.1dppx) {
837 #detail-screenshot[loading] {
838 background-image: url("chrome://global/skin/icons/loading@2x.png");
839 background-size: 16px;
840 }
841}
842
904e5040
RK
843#detail-screenshot[loading="error"] {
844 background-image: url("chrome://global/skin/icons/alert-error.gif");
845}
846
569543b3
RK
847#detail-desc-container {
848 margin-bottom: 2em;
e10e7add
RK
849}
850
8a933f1e 851#detail-desc, #detail-fulldesc {
dae45075 852 margin-inline-start: 6px;
569543b3 853 white-space: pre-wrap;
9162a092
RK
854 /* This is necessary to fix layout issues with multi-line descriptions, see
855 bug 592712*/
856 outline: solid transparent;
72a6fd39 857 min-width: 8em;
569543b3
RK
858}
859
8a933f1e
RK
860#detail-fulldesc {
861 margin-top: 1em;
862}
863
569543b3
RK
864#detail-contributions {
865 border-radius: 5px;
866 border: 1px solid #9C9CFF;
867 margin-bottom: 2em;
868 padding: 1em;
72a6fd39 869 background-color: #FFCF00;
4c18c82c
RK
870}
871
569543b3
RK
872#detail-contrib-description {
873 font-style: italic;
874 margin-bottom: 1em;
72a6fd39 875 color: #000000;
4c18c82c
RK
876}
877
569543b3 878#detail-contrib-suggested {
72a6fd39
RK
879 color: #8050B0;
880 font-weight: bold;
4c18c82c
RK
881}
882
72a6fd39 883#detail-contrib-btn {
569543b3
RK
884 list-style-image: url("chrome://mozapps/skin/extensions/heart.png");
885}
886
72a6fd39 887#detail-contrib-btn .button-icon {
dae45075 888 margin-inline-end: 3px;
569543b3
RK
889}
890
891#detail-grid {
f777a4f1 892 min-width: 15em;
569543b3
RK
893 margin-bottom: 2em;
894}
895
f620f94d
RK
896#detail-grid > columns > column:first-child {
897 max-width: 25em;
898}
899
9162a092 900.detail-row[first-row="true"],
f620f94d
RK
901.detail-row-complex[first-row="true"],
902setting[first-row="true"] {
9162a092
RK
903 border-top: none;
904}
905
569543b3 906.detail-row,
f620f94d
RK
907.detail-row-complex,
908setting {
9162a092 909 border-top: 1px solid #9C9CFF;
4c18c82c 910 -moz-box-align: center;
5d891ecf 911 min-height: 35px;
5d891ecf 912 line-height: 20px;
e10e7add
RK
913}
914
72a6fd39
RK
915#detail-controls {
916 margin-bottom: 1em;
917}
918
7729765c 919.inline-options-browser,
f620f94d
RK
920setting[first-row="true"] {
921 margin-top: 2em;
922}
923
a62af8a9
RK
924setting {
925 -moz-box-align: start;
926}
927
928.preferences-alignment {
929 min-height: 30px;
930 -moz-box-align: center;
931}
932
f620f94d
RK
933.preferences-description {
934 font-size: 90.9%;
935 color: #808080;
936 margin-top: -2px;
dae45075 937 margin-inline-start: 2em;
a62af8a9 938 white-space: pre-wrap;
f620f94d
RK
939}
940
a62af8a9
RK
941.preferences-description:empty {
942 display: none;
f620f94d
RK
943}
944
154ee8b3
RK
945setting[type="radio"] > radiogroup {
946 -moz-box-orient: horizontal;
947}
948
4c18c82c
RK
949/*** creator ***/
950
951.creator > label {
dae45075 952 margin-inline-end: 0;
e10e7add
RK
953}
954
4c18c82c
RK
955.creator > .text-link {
956 margin-top: 1px;
957 margin-bottom: 1px;
e10e7add
RK
958}
959
4c18c82c
RK
960
961/*** rating ***/
962
963.meta-rating {
dae45075 964 margin-inline-end: 0;
72a6fd39 965 padding-top: 2px;
e10e7add
RK
966}
967
72a6fd39 968.meta-rating > .star {
4c18c82c 969 list-style-image: url("chrome://mozapps/skin/extensions/rating-not-won.png");
72a6fd39 970 padding: 0 1px;
e10e7add
RK
971}
972
72a6fd39 973.meta-rating > .star[on="true"] {
4c18c82c 974 list-style-image: url("chrome://mozapps/skin/extensions/rating-won.png");
e10e7add
RK
975}
976
4c18c82c
RK
977
978/*** download progress ***/
979
980.download-progress {
981 background-color: #000000;
5d891ecf 982 border-radius: 2px;
4c18c82c
RK
983 border: 1px solid #FF9F00;
984 width: 200px;
5d891ecf
RK
985 height: 30px;
986 margin: 2px 4px;
e10e7add
RK
987}
988
5d891ecf
RK
989.download-progress[mode="undetermined"] {
990 border-color: #A09090;
e1313d59
RK
991}
992
4c18c82c
RK
993.download-progress .start-cap,
994.download-progress[complete] .end-cap,
e1313d59 995.download-progress[mode="undetermined"] .end-cap,
4c18c82c
RK
996.download-progress .progress .progress-bar {
997 background-color: #008484;
e10e7add
RK
998}
999
e1313d59
RK
1000.download-progress .progress .progress-bar {
1001 border-left-width: 0;
1002 border-right-width: 0;
1003 min-height: 21px;
1004}
1005
4c18c82c
RK
1006.download-progress .progress {
1007 background-color: transparent;
72a6fd39
RK
1008 padding: 0;
1009 margin: 0;
1010 border: none;
e10e7add
RK
1011}
1012
4c18c82c
RK
1013.download-progress .start-cap, .download-progress .end-cap {
1014 width: 12px;
e10e7add
RK
1015}
1016
941d657f
RK
1017.download-progress .start-cap:-moz-locale-dir(ltr),
1018.download-progress .end-cap:-moz-locale-dir(rtl) {
5d891ecf 1019 border-radius: 1px 0 0 1px;
e10e7add
RK
1020}
1021
941d657f
RK
1022.download-progress .end-cap:-moz-locale-dir(ltr),
1023.download-progress .start-cap:-moz-locale-dir(rtl) {
5d891ecf 1024 border-radius: 0 1px 1px 0;
e10e7add
RK
1025}
1026
72a6fd39 1027.download-progress .cancel {
4c18c82c 1028 -moz-appearance: none;
72a6fd39
RK
1029 background-color: #8050B0;
1030 border: 1px solid #9C9CFF;
1031 padding: 3px;
72a6fd39 1032 min-width: 0;
5d891ecf
RK
1033 width: 20px;
1034 height: 20px;
72a6fd39
RK
1035 margin: 3px;
1036}
1037
72a6fd39
RK
1038.download-progress .cancel .button-box {
1039 padding: 0;
4c18c82c 1040 border: none;
e10e7add
RK
1041}
1042
72a6fd39
RK
1043.download-progress .cancel .button-text {
1044 display: none;
1045}
1046
72a6fd39 1047.download-progress .cancel .button-icon {
dae45075 1048 margin-inline-start: 0;
e10e7add
RK
1049}
1050
d15f39a1
RK
1051.download-progress .cancel {
1052 list-style-image: url('chrome://mozapps/skin/extensions/cancel.png');
1053}
1054
4c18c82c
RK
1055.download-progress .status-container {
1056 -moz-box-align: center;
1057}
1058
72a6fd39
RK
1059.download-progress .status {
1060/* text-shadow: #FFF 0 0 2px; */
1061}
4c18c82c
RK
1062
1063/*** install status ***/
1064
1065.install-status {
1066 -moz-box-align: center;
e10e7add
RK
1067}
1068
4c18c82c
RK
1069
1070/*** check for updates ***/
1071
1072#updates-container {
1073 -moz-box-align: center;
e10e7add
RK
1074}
1075
72a6fd39
RK
1076#updates-container .button-link {
1077 font-weight: bold;
1078}
1079
1080#updates-installed,
1081#updates-downloaded {
4c18c82c
RK
1082 color: #008484;
1083 font-weight: bold;
e10e7add
RK
1084}
1085
569543b3
RK
1086#update-selected {
1087 margin: 12px;
e10e7add
RK
1088}
1089
569543b3 1090/*** buttons ***/
4c18c82c 1091
702d3d61 1092.addon-control[disabled="true"]:not(.no-auto-hide) {
0de07750
RK
1093 display: none;
1094}
1095
702d3d61
RK
1096.no-auto-hide .addon-control {
1097 display: block !important;
1098}
1099
154ee8b3 1100button.button-link {
4c18c82c
RK
1101 background: transparent;
1102 border: none;
1103 text-decoration: underline;
dbd844cb 1104 color: #3333FF;
4c18c82c
RK
1105 cursor: pointer;
1106 min-width: 0;
706c344c 1107 margin: 0 6px;
e10e7add 1108}
154ee8b3
RK
1109
1110/* Needed to override normal button style from inContent.css */
1111button.button-link:not([disabled="true"]):active:hover {
1112}
2e88f3cc
RK
1113
1114/*** telemetry experiments ***/
1115
1116#detail-experiment-container {
1117 font-size: 80%;
1118 margin-bottom: 1em;
1119}
1120
1121#detail-experiment-bullet-container,
1122#detail-experiment-state,
1123#detail-experiment-time,
1124.experiment-bullet-container,
1125.experiment-state,
1126.experiment-time {
1127 vertical-align: middle;
1128 display: inline-block;
1129}
1130
1131.addon .experiment-bullet,
1132#detail-experiment-bullet {
1133 fill: #8050B0;
1134}
1135
1136.addon[active="true"] .experiment-bullet,
1137#detail-view[active="true"] #detail-experiment-bullet {
1138 fill: #FFCF00;
1139}
5d891ecf
RK
1140
1141/*** info UI for add-ons that have been disabled for being unsigned ***/
1142
1143#show-disabled-unsigned-extensions:not(:hover) {
1144 background-color: #FF0000;
1145}
1146
1147#disabled-unsigned-addons-info {
1148 margin-bottom: 2em;
689d5552
RK
1149 margin-right: 48px;
1150 margin-left: 48px;
5d891ecf
RK
1151}
1152
1153#disabled-unsigned-addons-heading {
1154 font-size: 1.4em;
1155 font-weight: bold;
1156 margin-bottom: .5em;
1157}
1158
1159#signing-dev-info {
1160 font-style: italic;
1161}