X-Git-Url: https://git-public.kairo.at/?p=themes.git;a=blobdiff_plain;f=EarlyBlue%2Fmozapps%2Fextensions%2Fextensions.css;h=36c7fb71287f6bace79e4e892704a9488d4dc570;hp=992786d7d189b34e904d4add7e8889dce9a40f93;hb=d471380e99d65fcd126e0f04b94c1d3a8004cf3d;hpb=8a933f1e2b148a1d5f6aa95950206026caa5513d diff --git a/EarlyBlue/mozapps/extensions/extensions.css b/EarlyBlue/mozapps/extensions/extensions.css index 992786d7..36c7fb71 100644 --- a/EarlyBlue/mozapps/extensions/extensions.css +++ b/EarlyBlue/mozapps/extensions/extensions.css @@ -1,80 +1,21 @@ -/* ***** BEGIN LICENSE BLOCK ***** - * Version: MPL 1.1/GPL 2.0/LGPL 2.1 - * - * The contents of this file are subject to the Mozilla Public License Version - * 1.1 (the "License"); you may not use this file except in compliance with - * the License. You may obtain a copy of the License at - * http://www.mozilla.org/MPL/ - * - * Software distributed under the License is distributed on an "AS IS" basis, - * WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License - * for the specific language governing rights and limitations under the - * License. - * - * The Original Code is the Extension Manager UI. - * - * The Initial Developer of the Original Code is - * the Mozilla Foundation. - * Portions created by the Initial Developer are Copyright (C) 2010 - * the Initial Developer. All Rights Reserved. - * - * Contributor(s): - * Blair McBride - * - * Alternatively, the contents of this file may be used under the terms of - * either the GNU General Public License Version 2 or later (the "GPL"), or - * the GNU Lesser General Public License Version 2.1 or later (the "LGPL"), - * in which case the provisions of the GPL or the LGPL are applicable instead - * of those above. If you wish to allow use of your version of this file only - * under the terms of either the GPL or the LGPL, and not to allow others to - * use your version of this file under the terms of the MPL, indicate your - * decision by deleting the provisions above and replace them with the notice - * and other provisions required by the GPL or the LGPL. If you do not delete - * the provisions above, a recipient may use your version of this file under - * the terms of any one of the MPL, the GPL or the LGPL. - * - * ***** END LICENSE BLOCK ***** */ - -#addons-page { - background-color: #CCD0DD; - color: #000000; - margin: 20px; -} +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ -#view-port-container { - /* Needed to allow the radius to clip the inner content, see bug 595656 */ - overflow: hidden; - background-color: #FFFFFF; - border: 1px solid #666699; -} +@import url("chrome://global/skin/in-content/common.css"); -.nav-button { - list-style-image: url("chrome://communicator/skin/icons/communicatoricons.png"); - min-width: 0; -} - -#forward-btn { - -moz-border-start: none; -} - -#back-btn:-moz-locale-dir(ltr), -#forward-btn:-moz-locale-dir(rtl) { - -moz-image-region: rect(42px 25px 63px 0px); -} - -#back-btn[disabled="true"]:-moz-locale-dir(ltr), -#forward-btn[disabled="true"]:-moz-locale-dir(rtl) { - -moz-image-region: rect(42px 50px 63px 25px); +.main-content { + padding-top: 0; + -moz-padding-end: 0; } -#back-btn:-moz-locale-dir(rtl), -#forward-btn:-moz-locale-dir(ltr) { - -moz-image-region: rect(63px 25px 84px 0px); +#nav-header { + min-height: 39px; + background-color: #9999CC; } -#back-btn[disabled="true"]:-moz-locale-dir(rtl), -#forward-btn[disabled="true"]:-moz-locale-dir(ltr) { - -moz-image-region: rect(63px 50px 84px 25px); +.view-pane > .list > scrollbox { + -moz-padding-end: 48px; } /*** global warnings ***/ @@ -99,7 +40,7 @@ border-bottom: 1px solid #9999CC; } -@media all and (max-width: 600px) { +@media (max-width: 600px) { .global-warning-text { display: none; } @@ -111,6 +52,8 @@ } } +/*** global informations ***/ + /* Plugins aren't yet disabled by safemode (bug 342333), so don't show that warning when viewing plugins. */ #addons-page[warning="safemode"] .view-pane[type="plugin"] .global-warning-container, @@ -122,34 +65,31 @@ /*** notification icons ***/ -.warning-icon { - list-style-image: url("chrome://global/skin/icons/warning-16.png"); +.warning-icon, +.error-icon, +.pending-icon, +.info-icon { width: 16px; height: 16px; - margin: 3px 0; + margin: 1px 0; +} + +.warning-icon { + list-style-image: url("chrome://global/skin/icons/warning-16.png"); } .error-icon { list-style-image: url("chrome://global/skin/icons/error-16.png"); - width: 16px; - height: 16px; - margin: 3px 0; } .pending-icon, .info-icon { list-style-image: url("chrome://global/skin/icons/information-16.png"); - width: 16px; - height: 16px; - margin: 3px 0; } .addon-view[pending="disable"] .pending-icon, .addon-view[pending="uninstall"] .pending-icon { list-style-image: url("chrome://global/skin/icons/warning-16.png"); - width: 16px; - height: 15px; - margin: 3px 0; } @@ -157,6 +97,7 @@ .alert-container { -moz-box-align: center; + -moz-margin-end: 48px; } .alert-spacer-before { @@ -174,6 +115,7 @@ border: 1px inset #CCD0DD; border-radius: 8px; background-color: #CCD0DD; + background-clip: padding-box; } .alert .alert-title { @@ -182,7 +124,7 @@ margin-bottom: 15px; } -.alert .addon-control { +.alert button { margin: 1em 2em; } @@ -196,51 +138,26 @@ /*** category selector ***/ #categories { - -moz-appearance: none; - border: none; - -moz-margin-end: -1px; - background-color: transparent; - position: relative; - margin-top: 31px; -} - -.category { - background-color: transparent; - color: #404040; - min-height: 0; - padding: 10px 4px; - border-width: 1px; - border-style: solid; - border-color: transparent; - -moz-box-align: center; - overflow: hidden; + padding-top: 0; } .category[disabled] { + overflow: hidden; height: 0; + min-height: 0; opacity: 0; - -moz-transition-property: height, opacity; - -moz-transition-duration: 1s, 0.8s; + transition-property: min-height, opacity; + transition-duration: 1s, 0.8s; } .category:not([disabled]) { - height: 52px; - -moz-transition-property: height, opacity; - -moz-transition-duration: 1s, 0.8s; -} - -.category[selected] { - background-color: #FFFFFF; - color: #000000; - border-color: #666699; -} - -.category-name { - font-size: 150%; + min-height: 40px; + transition-property: min-height, opacity; + transition-duration: 1s, 0.8s; } /* Maximize the size of the viewport when the window is small */ -@media all and (max-width: 800px) { +@media (max-width: 800px) { .category-name { display: none; } @@ -250,20 +167,15 @@ background-color: #666699; padding: 2px 8px; margin: 6px 0; - border: 1px outset #666699; + -moz-margin-start: 6px; + border-radius: 100%; color: #FFFFFF; font-weight: bold; text-align: center; } .category-badge[value="0"] { - visibility: hidden; -} - -.category-icon { - width: 32px; - height: 32px; - -moz-margin-start: 6px; + display: none; } #category-search > .category-icon { @@ -272,21 +184,30 @@ #category-discover > .category-icon { list-style-image: url("chrome://mozapps/skin/extensions/category-discover.png"); } -#category-languages > .category-icon { +#category-locale > .category-icon { list-style-image: url("chrome://mozapps/skin/extensions/category-languages.png"); } -#category-searchengines > .category-icon { +#category-searchengine > .category-icon { list-style-image: url("chrome://mozapps/skin/extensions/category-searchengines.png"); } -#category-extensions > .category-icon { +#category-extension > .category-icon { list-style-image: url("chrome://mozapps/skin/extensions/category-extensions.png"); } -#category-themes > .category-icon { +#category-service > .category-icon { + list-style-image: url("chrome://mozapps/skin/extensions/category-service.png"); +} +#category-theme > .category-icon { list-style-image: url("chrome://mozapps/skin/extensions/category-themes.png"); } -#category-plugins > .category-icon { +#category-plugin > .category-icon { list-style-image: url("chrome://mozapps/skin/extensions/category-plugins.png"); } +#category-dictionary > .category-icon { + list-style-image: url("chrome://mozapps/skin/extensions/category-dictionaries.png"); +} +#category-experiment > .category-icon { + list-style-image: url("chrome://mozapps/skin/extensions/category-experiments.png"); +} #category-availableUpdates > .category-icon { list-style-image: url("chrome://mozapps/skin/extensions/category-available.png"); } @@ -298,40 +219,70 @@ /*** header ***/ #header { - margin-bottom: 18px; - height: 2em; + margin-top: 20px; + margin-bottom: 20px; + -moz-margin-end: 48px; } -#header-search { - color: #000000; - border: 1px inset #CCD0DD; - padding: 3px; - background-color: #CCD0DD; +@media (max-width: 600px) { + #header-search { + width: 12em; + } +} + +.view-header { margin: 0; + -moz-margin-end: 48px; + border-bottom: 1px solid #666699; } -#header-search .textbox-input:-moz-placeholder { - color: #808080; +#header-utils-btn { + list-style-image: url("chrome://mozapps/skin/extensions/utilities.svg#utilities"); + -moz-margin-end: 16px; } -#header-search[focused="true"] { - background-color: #FFFFFF; +.header-button { } -#header-utils-btn { - min-width: 4.5em; - list-style-image: url("chrome://mozapps/skin/extensions/utilities.png"); - -moz-margin-end: 18px; +.header-button[disabled="true"] > .toolbarbutton-icon { } -.view-header { - background-color: #9999CC; - padding: 4px; - margin: 0; - min-height: 31px; - border-bottom: 1px solid #666699; +.header-button:not([disabled="true"]):hover, +#header-utils-btn:not([disabled="true"]):hover { + cursor: pointer; +} + +.header-button > .toolbarbutton-text { + display: none; +} + +.nav-button { + list-style-image: url("chrome://communicator/skin/icons/communicatoricons.png"); } +#forward-btn { + -moz-border-start: none; +} + +#back-btn:-moz-locale-dir(ltr), +#forward-btn:-moz-locale-dir(rtl) { + -moz-image-region: rect(42px 25px 63px 0px); +} + +#back-btn[disabled="true"]:-moz-locale-dir(ltr), +#forward-btn[disabled="true"]:-moz-locale-dir(rtl) { + -moz-image-region: rect(42px 50px 63px 25px); +} + +#back-btn:-moz-locale-dir(rtl), +#forward-btn:-moz-locale-dir(ltr) { + -moz-image-region: rect(63px 25px 84px 0px); +} + +#back-btn[disabled="true"]:-moz-locale-dir(rtl), +#forward-btn[disabled="true"]:-moz-locale-dir(ltr) { + -moz-image-region: rect(63px 50px 84px 25px); +} /*** sorters ***/ @@ -379,20 +330,66 @@ } +/*** discover view ***/ + +.discover-spacer-before, +.discover-spacer-after { + -moz-box-flex: 1; +} + +#discover-error .alert { + max-width: 45em; + -moz-box-flex: 1; +} + +.discover-logo { + list-style-image: url("chrome://mozapps/skin/extensions/discover-logo.png"); + -moz-margin-end: 15px; +} + +.discover-title { + font-weight: bold; + font-size: 24px; + /* font-family: MetaWebPro-Book, "Trebuchet MS", sans-serif; */ + margin: 0 0 15px 0; +} + +.discover-description { + text-align: justify; + margin: 0 0 15px 0; +} + +.discover-footer { + text-align: justify; +} + + /*** list ***/ .list { margin: 0; - border: none; + border-width: 0 !important; background-color: transparent; } +.list > scrollbox > .scrollbox-innerbox { + border: 1px dotted transparent; +} + +.list:-moz-focusring > scrollbox > .scrollbox-innerbox { + border-color: #9999CC; +} + .addon { border-bottom: 1px solid #9999CC; padding: 5px; background-origin: border-box; } +.addon:not(:only-child):last-child { + border-bottom-width: 0; +} + .details { cursor: pointer; margin: 0; @@ -402,11 +399,9 @@ .icon-container { width: 48px; height: 48px; - margin: 22px 7px 7px 7px; -} - -.addon[active="false"] .icon { -/* filter: url("chrome://mozapps/skin/extensions/extensions.svg#greyscale"); */ + margin: 3px 7px; + -moz-box-align: center; + -moz-box-pack: center; } .icon { @@ -415,6 +410,14 @@ max-height: 48px; } +.content-inner-container { + -moz-margin-end: 5px; +} + +.addon[active="false"] .icon { + filter: grayscale(1); +} + .addon-view[type="theme"] .icon { list-style-image: url("chrome://mozapps/skin/extensions/themeGeneric.png"); } @@ -427,24 +430,28 @@ list-style-image: url("chrome://mozapps/skin/plugins/pluginGeneric.png"); } +.addon-view[type="dictionary"] .icon { + list-style-image: url("chrome://mozapps/skin/extensions/dictionaryGeneric.png"); +} + +.addon-view[type="experiment"] .icon { + list-style-image: url("chrome://mozapps/skin/extensions/experimentGeneric.png"); +} + .name-container { font-size: 150%; font-weight: bold; - color: #404040; - margin-bottom: 0; + -moz-box-align: end; + -moz-box-flex: 1; } .creator { font-weight: bold; } -.creator .text-link { - /* color: #0066CC; */ -} - .description-container { - margin-top: 8px; -moz-margin-start: 6px; + -moz-box-align: center; } .description { @@ -453,10 +460,46 @@ .warning, .pending, -.error, -.info { +.error { -moz-margin-start: 48px; font-weight: bold; + -moz-box-align: center; +} + +.content-container, +.basicinfo-container { + -moz-box-align: start; +} + +.addon[status="installing"] > .content-container { + -moz-box-align: stretch; +} + +.update-info-container { + -moz-box-align: center; +} + +.update-available { + -moz-box-align: end; +} + +.install-status-container { + -moz-box-pack: end; + -moz-box-align: end; +} + +.name-outer-container { + -moz-box-pack: center; +} + +.relnotes-toggle-container, +.icon-outer-container { + -moz-box-pack: start; +} + +.status-container, +.control-container { + -moz-box-pack: end; } .addon-view .warning { @@ -482,14 +525,14 @@ height: 0; overflow: hidden; opacity: 0; - -moz-transition-property: height, opacity; - -moz-transition-duration: 0.5s, 0.5s; + transition-property: height, opacity; + transition-duration: 0.5s, 0.5s; } .addon[show-relnotes] .relnotes-container { opacity: 1; - -moz-transition-property: height, opacity; - -moz-transition-duration: 0.5s, 0.5s; + transition-property: height, opacity; + transition-duration: 0.5s, 0.5s; } .addon .relnotes-header { @@ -514,15 +557,6 @@ list-style-image: url("chrome://global/skin/arrow/arrow-up.gif"); } -.addon[active="false"] { - /* background-color: rgba(135, 135, 135, 0.1); */ -} - -.addon-view[active="false"], -.addon-view[active="false"] .name-container { - color: #666699; -} - .addon-view[notification="warning"] { background-color: #FFFFCC; } @@ -561,12 +595,12 @@ color: #FFFFFF; } -.addon[active="false"][selected] { - color: #000000; +.addon[active="false"] > .content-container > .content-inner-container { + color: #666699; } -.addon[active="false"][selected] .name-container { - color: #222233; +.addon[active="false"][selected] > .content-container > .content-inner-container { + color: #AAAAAA; } @@ -593,8 +627,7 @@ #search-filter { padding: 5px 20px; - -moz-box-align: center; - background-color: #FFFFFF; + -moz-margin-end: 48px; font-size: 120%; border-bottom: 1px solid #666699; overflow-x: hidden; @@ -603,26 +636,7 @@ #search-filter-label { font-weight: bold; color: #808080; -} - -.search-filter-radio { - -moz-appearance: none; - padding: 0 6px; - margin: 0 3px; - border-radius: 10000px; -} - -.search-filter-radio[selected] { - background-color: #3366699; - color: #000000; -} - -.search-filter-radio .radio-check-box1 { - display: none; -} - -.search-filter-radio .radio-icon { - display: none; + -moz-margin-end: 10px; } #search-allresults-link { @@ -630,21 +644,28 @@ margin-bottom: 2em; } + /*** detail view ***/ +#detail-view { + -moz-margin-end: 48px; +} + #detail-view .loading { opacity: 0; } #detail-view[loading-extended] .loading { opacity: 1; - -moz-transition-property: opacity; - -moz-transition-duration: 1s; + transition-property: opacity; + transition-duration: 1s; } .detail-view-container { - padding: 0 2em 2em 2em; + -moz-padding-end: 2em; + padding-bottom: 2em; font-size: 110%; + color: #000000; } #detail-notifications { @@ -658,9 +679,13 @@ -moz-margin-start: 0; } -#detail-icon { +#detail-icon-container { + width: 64px; -moz-margin-end: 10px; margin-top: 6px; +} + +#detail-icon { max-width: 64px; max-height: 64px; } @@ -673,10 +698,24 @@ font-size: 200%; } -#detail-screenshot { +#detail-screenshot-box { -moz-margin-end: 2em; +} + +#detail-screenshot { max-width: 300px; max-height: 300px; + background-color: #FFFFFF; +} + +#detail-screenshot[loading] { + background-image: url("chrome://communicator/skin/brand/throbber-anim.gif"); + background-position: 50% 50%; + background-repeat: no-repeat; +} + +#detail-screenshot[loading="error"] { + background-image: url("chrome://global/skin/icons/alert-error.gif"); } #detail-desc-container { @@ -727,19 +766,23 @@ margin-bottom: 2em; } +#detail-grid > columns > column:first-child { + min-width: 15em; + max-width: 25em; +} + .detail-row[first-row="true"], -.detail-row-complex[first-row="true"] { +.detail-row-complex[first-row="true"], +setting[first-row="true"] { border-top: none; } .detail-row, -.detail-row-complex { +.detail-row-complex, +setting { border-top: 1px solid #808080; -moz-box-align: center; -} - -.detail-row-value { - -moz-margin-start: 0; + min-height: 30px; } #detail-controls { @@ -750,6 +793,36 @@ /* background-color: foo; */ } +setting[first-row="true"] { + margin-top: 2em; +} + +setting { + -moz-box-align: start; +} + +.preferences-alignment { + min-height: 30px; + -moz-box-align: center; +} + +.preferences-description { + font-size: 90.9%; + color: #808080; + margin-top: -2px; + -moz-margin-start: 2em; + white-space: pre-wrap; +} + +.preferences-description:empty { + display: none; +} + +setting[type="radio"] > radiogroup { + -moz-box-orient: horizontal; +} + + /*** creator ***/ .creator > label { @@ -766,7 +839,6 @@ /*** rating ***/ .meta-rating { - -moz-margin-start: 0; -moz-margin-end: 0; padding-top: 2px; } @@ -784,15 +856,16 @@ /*** download progress ***/ .download-progress { - background-color: #CCD0DD; border: 1px solid #808080; + border-radius: 2px; + background-color: #CCD0DD; width: 200px; height: 21px; margin: 0 8px; } -.download-progress[mode="undetermined"] .status-container { - padding: 0 2px; +.download-progress[mode="undetermined"] { + border-color: #666699; } .download-progress .start-cap, @@ -803,8 +876,6 @@ } .download-progress .progress .progress-bar { - border-left-width: 0; - border-right-width: 0; min-height: 21px; } @@ -815,26 +886,27 @@ border: none; } -.download-progress .start-cap, .download-progress .end-cap { - width: 12px; +.download-progress .start-cap, +.download-progress .end-cap { + width: 4px; } .download-progress .start-cap:-moz-locale-dir(ltr), .download-progress .end-cap:-moz-locale-dir(rtl) { - border-radius: 3px 0 0 3px; + border-radius: 1px 0 0 1px; } .download-progress .end-cap:-moz-locale-dir(ltr), .download-progress .start-cap:-moz-locale-dir(rtl) { - border-radius: 0 3px 3px 0; + border-radius: 0 1px 1px 0; } .download-progress .cancel { -moz-appearance: none; - background-color: #CCD0DD; - border: 1px solid #666699; padding: 3px; min-width: 0; + width: 20px; + height: 20px; margin: 3px; } @@ -890,18 +962,92 @@ margin: 12px; } + /*** buttons ***/ -.addon-control[disabled="true"] { +.addon-control[disabled="true"]:not(.no-auto-hide) { display: none; } -.button-link { +.no-auto-hide .addon-control { + display: block !important; +} + +button.button-link { background: transparent; border: none; - text-decoration: underline; + box-shadow: none; color: #0000FF; cursor: pointer; min-width: 0; + min-height: 20px; margin: 0 6px; } + +button.button-link:not(:-moz-focusring) > .button-box { + border-width: 0; + margin: 1px; +} + +button.button-link:hover { + background-color: transparent; + color: #336699; + text-decoration: underline; +} + +/* Needed to override normal button style from inContent.css */ +button.button-link:not([disabled="true"]):active:hover { +} + +/*** telemetry experiments ***/ + +#detail-experiment-container { + font-size: 80%; + margin-bottom: 1em; +} + +#detail-experiment-bullet-container, +#detail-experiment-state, +#detail-experiment-time, +.experiment-bullet-container, +.experiment-state, +.experiment-time { + vertical-align: middle; + display: inline-block; +} + +.addon .experiment-bullet, +#detail-experiment-bullet { + fill: #808080; +} + +.addon[active="true"] .experiment-bullet, +#detail-view[active="true"] #detail-experiment-bullet { + fill: #336699; +} + +/*** info UI for add-ons that have been disabled for being unsigned ***/ + +#show-disabled-unsigned-extensions:not(:hover) { + background-color: #FFFFCC; +} + +#disabled-unsigned-addons-info { + margin-bottom: 2em; + -moz-margin-end: 48px; +} + +#disabled-unsigned-addons-heading { + font-size: 1.4em; + font-weight: bold; + margin-bottom: .5em; +} + +#signing-dev-info { + font-style: italic; +} + +#detail-findUpdates-btn[hidden] { + display: -moz-box; + visibility: hidden; +}