1 /* ***** BEGIN LICENSE BLOCK *****
2 * Version: MPL 1.1/GPL 2.0/LGPL 2.1
4 * The contents of this file are subject to the Mozilla Public License Version
5 * 1.1 (the "License"); you may not use this file except in compliance with
6 * the License. You may obtain a copy of the License at
7 * http://www.mozilla.org/MPL/
9 * Software distributed under the License is distributed on an "AS IS" basis,
10 * WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
11 * for the specific language governing rights and limitations under the
14 * The Original Code is the Extension Manager UI.
16 * The Initial Developer of the Original Code is
17 * the Mozilla Foundation.
18 * Portions created by the Initial Developer are Copyright (C) 2010
19 * the Initial Developer. All Rights Reserved.
22 * Blair McBride <bmcbride@mozilla.com>
24 * Alternatively, the contents of this file may be used under the terms of
25 * either the GNU General Public License Version 2 or later (the "GPL"), or
26 * the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
27 * in which case the provisions of the GPL or the LGPL are applicable instead
28 * of those above. If you wish to allow use of your version of this file only
29 * under the terms of either the GPL or the LGPL, and not to allow others to
30 * use your version of this file under the terms of the MPL, indicate your
31 * decision by deleting the provisions above and replace them with the notice
32 * and other provisions required by the GPL or the LGPL. If you do not delete
33 * the provisions above, a recipient may use your version of this file under
34 * the terms of any one of the MPL, the GPL or the LGPL.
36 * ***** END LICENSE BLOCK ***** */
39 background-color: #000000;
43 #view-port-container {
44 /* Needed to allow the radius to clip the inner content, see bug 595656 */
46 border: 1px solid #9C9CFF;
51 list-style-image: url("chrome://communicator/skin/icons/communicatoricons.png");
56 #back-btn:-moz-locale-dir(ltr),
57 #forward-btn:-moz-locale-dir(rtl) {
58 -moz-image-region: rect(42px 25px 63px 0px);
61 #back-btn[disabled="true"]:-moz-locale-dir(ltr),
62 #forward-btn[disabled="true"]:-moz-locale-dir(rtl) {
63 -moz-image-region: rect(42px 50px 63px 25px);
66 #back-btn:-moz-locale-dir(rtl),
67 #forward-btn:-moz-locale-dir(ltr) {
68 -moz-image-region: rect(63px 25px 84px 0px);
71 #back-btn[disabled="true"]:-moz-locale-dir(rtl),
72 #forward-btn[disabled="true"]:-moz-locale-dir(ltr) {
73 -moz-image-region: rect(63px 50px 84px 25px);
76 /*** global warnings ***/
79 -moz-box-align: center;
85 #addons-page[warning] .global-warning-container {
86 background-color: #FFCF00;
89 #detail-view .global-warning {
91 border-bottom: 3px solid #000000;
94 /*** notification icons ***/
97 list-style-image: url("chrome://global/skin/icons/warning-16.png");
104 list-style-image: url("chrome://global/skin/icons/error-16.png");
112 list-style-image: url("chrome://global/skin/icons/information-16.png");
118 /*** category selector ***/
121 -moz-appearance: none;
123 -moz-margin-end: -1px;
124 background-color: transparent;
130 -moz-border-end-width: 0;
132 border-color: transparent;
134 -moz-box-align: center;
139 .category:-moz-locale-dir(ltr) {
140 border-top-left-radius: 5px;
141 border-bottom-left-radius: 5px;
144 .category:-moz-locale-dir(rtl) {
145 border-top-right-radius: 5px;
146 border-bottom-right-radius: 5px;
149 .category[disabled] {
152 -moz-transition-property: height, opacity;
153 -moz-transition-duration: 1s, 0.8s;
156 .category:not([disabled]) {
158 -moz-transition-property: height, opacity;
159 -moz-transition-duration: 1s, 0.8s;
162 .category[selected] {
164 border-color: #9C9CFF;
172 background-color: #E7ADE7;
175 border-radius: 10000px;
181 .category-badge[value="0"] {
188 -moz-margin-start: 6px;
191 #category-search > .category-icon {
192 list-style-image: url("chrome://mozapps/skin/extensions/category-search.png");
194 #category-discover > .category-icon {
195 list-style-image: url("chrome://mozapps/skin/extensions/category-discover.png");
197 #category-languages > .category-icon {
198 list-style-image: url("chrome://mozapps/skin/extensions/category-languages.png");
200 #category-searchengines > .category-icon {
201 list-style-image: url("chrome://mozapps/skin/extensions/category-searchengines.png");
203 #category-extensions > .category-icon {
204 list-style-image: url("chrome://mozapps/skin/extensions/category-extensions.png");
206 #category-themes > .category-icon {
207 list-style-image: url("chrome://mozapps/skin/extensions/category-themes.png");
209 #category-plugins > .category-icon {
210 list-style-image: url("chrome://mozapps/skin/extensions/category-plugins.png");
212 #category-availableUpdates > .category-icon {
213 list-style-image: url("chrome://mozapps/skin/extensions/category-available.png");
215 #category-recentUpdates > .category-icon {
216 list-style-image: url("chrome://mozapps/skin/extensions/category-recent.png");
227 #header-name, #header-link {
236 -moz-appearance: none;
238 background: transparent;
241 list-style-image: url("chrome://mozapps/skin/extensions/go-back.png");
244 #header-link .button-icon {
245 -moz-margin-end: 6px;
249 list-style-image: url("chrome://global/skin/icons/loading.gif");
254 list-style-image: url("chrome://mozapps/skin/extensions/utilities.png");
257 #header-utils-btn:hover,
258 #header-utils-btn:hover:active,
259 #header-utils-btn[open="true"] {
260 list-style-image: url("chrome://mozapps/skin/extensions/utilities-hover.png");
263 #header-utils-btn:-moz-focusring > .button-box {
267 #header-utils-btn > .button-box > .button-menu-dropmarker {
269 background: transparent;
272 #header-utils-btn:hover > .button-box > .button-menu-dropmarker {
273 list-style-image: url("chrome://global/skin/arrow/arrow-down-hover.gif");
286 -moz-appearance: none;
287 border-right: 3px solid #000000;
291 -moz-appearance: none;
293 border-left: 3px solid #000000;
294 background-color: transparent;
298 -moz-padding-start: 6px;
299 -moz-padding-end: 3px;
301 min-width: 12px !important;
302 -moz-box-direction: reverse;
305 background-color: #FFCF00;
309 .sorter[checkState="1"],
310 .sorter[checkState="2"] {
311 background-color: #008484;
315 .sorter[checkState="1"] {
316 list-style-image: url("chrome://global/skin/arrow/arrow-down.gif");
319 .sorter[checkState="2"] {
320 list-style-image: url("chrome://global/skin/arrow/arrow-up.gif");
323 .sorter .button-icon {
324 -moz-margin-start: 4px;
328 /*** empty list notification ***/
331 -moz-box-align: center;
334 .empty-list-notice > button {
344 background-color: transparent;
348 border-bottom: 1px solid #9C9CFF;
352 .addon[status="installing"] {
353 -moz-box-align: center;
359 -moz-margin-start: 10px;
369 list-style-image: url("chrome://mozapps/skin/extensions/extensionGeneric.png");
374 .addon-view[type="theme"] .icon {
375 list-style-image: url("chrome://mozapps/skin/extensions/themeGeneric.png");
378 .addon-view[type="locale"] .icon {
379 list-style-image: url("chrome://mozapps/skin/extensions/localeGeneric.png");
382 .addon-view[type="plugin"] .icon {
383 list-style-image: url("chrome://mozapps/skin/plugins/pluginGeneric.png");
391 .description-container {
393 -moz-margin-start: 6px;
400 .warning, .pending, .error, .info {
401 -moz-margin-start: 48px;
404 .addon-view:not([selected]) .warning {
408 .addon-view:not([selected]) .error {
412 .addon-view:not([selected]) .pending {
416 .addon-view[notification="warning"] {
417 background-color : #FFCF00;
421 .addon-view[notification="warning"] .warning {
425 .addon-view[notification="error"] {
426 background-color: #FF0000;
430 .addon-view[notification="error"] .error {
434 .addon-view[notification="info"] {
435 background-color: #9C9CFF;
439 .addon-view[pending="enable"],
440 .addon-view[pending="upgrade"],
441 .addon-view[pending="install"] {
442 background-color: #008484;
445 .addon-view[pending="enable"] .pending,
446 .addon-view[pending="upgrade"] .pending,
447 .addon-view[pending="install"] .pending {
451 .addon-view[pending="disable"],
452 .addon-view[pending="uninstall"] {
456 .addon .relnotes-container {
457 -moz-box-align: start;
461 -moz-transition-property: height, opacity;
462 -moz-transition-duration: 0.5s, 0.5s;
465 .addon[show-relnotes] .relnotes-container {
467 -moz-transition-property: height, opacity;
468 -moz-transition-duration: 0.5s, 0.5s;
471 .addon .relnotes-header {
476 .addon .relnotes-toggle {
478 background: transparent;
480 -moz-box-direction: reverse;
482 list-style-image: url("chrome://global/skin/arrow/arrow-down.gif");
485 .addon .relnotes-toggle > .button-box > .button-icon {
486 -moz-padding-start: 4px;
489 .addon[show-relnotes] .relnotes-toggle {
490 list-style-image: url("chrome://global/skin/arrow/arrow-up.gif");
494 /*** item - uninstalled ***/
496 .addon[status="uninstalled"] {
500 .addon[status="uninstalled"] > .container {
501 -moz-box-align: center;
503 background-color: #8050B0;
508 .addon[status="uninstalled"][selected] {
509 background-color: transparent;
513 /*** search view ***/
517 -moz-box-align: center;
518 background-color: #000000;
522 #search-filter-label {
527 .search-filter-radio {
530 border-radius: 10000px;
533 .search-filter-radio[selected] {
534 background-color: #008484;
538 .search-filter-radio .radio-check-box1 {
542 .search-filter-radio .radio-icon {
546 #search-allresults-link {
551 /*** detail view ***/
553 #detail-view[active="false"] .fade {
557 #detail-view .loading {
561 #detail-view:not([loading]) .loading {
562 visibility: collapse;
565 #detail-view[loading-extended] .loading {
566 -moz-box-align: center;
567 -moz-box-pack: center;
569 -moz-transition-property: opacity;
570 -moz-transition-duration: 1s;
573 #detail-view .loading > image {
574 list-style-image: url("chrome://global/skin/icons/loading.gif");
577 .detail-view-container {
582 #detail-notifications {
586 #detail-notifications .warning,
587 #detail-notifications .pending,
588 #detail-notifications .error,
589 #detail-notifications .info {
590 -moz-margin-start: 0;
594 -moz-margin-end: 10px;
601 #detail-name-container {
606 -moz-margin-end: 2em;
609 #detail-desc-container {
614 -moz-margin-start: 6px;
615 white-space: pre-wrap;
616 /* This is necessary to fix layout issues with multi-line descriptions, see
618 outline: solid transparent;
621 #detail-contributions {
623 border: 1px solid #9C9CFF;
629 #detail-contrib-description {
634 #detail-contrib-suggested {
638 #detail-contrib-button {
639 list-style-image: url("chrome://mozapps/skin/extensions/heart.png");
642 #detail-contrib-button .button-icon {
643 -moz-margin-end: 3px;
650 .detail-row[first-row="true"],
651 .detail-row-complex[first-row="true"] {
656 .detail-row-complex {
657 border-top: 1px solid #9C9CFF;
658 -moz-box-align: center;
662 -moz-margin-start: 0;
669 -moz-margin-start: 0px;
670 -moz-margin-end: 0px;
673 .creator > .text-link {
682 -moz-margin-start: 0px;
683 -moz-margin-end: 0px;
684 vertical-align: text-top;
687 .meta-rating[showrating="average"] > .star {
688 list-style-image: url("chrome://mozapps/skin/extensions/rating-not-won.png");
692 .meta-rating[showrating="user"] > .star {
693 list-style-image: url("chrome://mozapps/skin/extensions/rating-unrated.png");
697 .meta-rating > .star[on="true"],
698 .meta-rating[showrating="user"] > .star[hover] {
699 list-style-image: url("chrome://mozapps/skin/extensions/rating-won.png");
704 /*** download progress ***/
707 background-color: #000000;
708 border-radius: 10000px;
709 border: 1px solid #FF9F00;
715 .download-progress .start-cap,
716 .download-progress[complete] .end-cap,
717 .download-progress .progress .progress-bar {
718 background-color: #008484;
721 .download-progress .progress {
722 background-color: transparent;
725 .download-progress .start-cap, .download-progress .end-cap {
729 .download-progress .start-cap:-moz-locale-dir(ltr),
730 .download-progress .end-cap:-moz-locale-dir(rtl) {
731 border-radius: 10000px 0 0 10000px;
734 .download-progress .end-cap:-moz-locale-dir(ltr),
735 .download-progress .start-cap:-moz-locale-dir(rtl) {
736 border-radius: 0 10000px 10000px 0;
739 .download-progress .progress {
740 -moz-appearance: none;
746 .download-progress .pause, .download-progress .cancel {
747 -moz-appearance: none;
748 background-color: #8050B0;
749 border-width: 1px 0px 0px 1px;
752 border-radius: 10000px;
759 .download-progress .pause {
760 list-style-image: url('chrome://mozapps/skin/extensions/pause.png');
763 .download-progress .cancel {
764 list-style-image: url('chrome://mozapps/skin/extensions/cancel.png');
767 .download-progress .status-container {
768 -moz-box-align: center;
772 /*** install status ***/
775 -moz-box-align: center;
779 /*** check for updates ***/
782 -moz-box-align: center;
785 #updates-installed, #updates-downloaded {
796 .addon-control[disabled="true"] {
801 background: transparent;
803 text-decoration: underline;