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