diff options
Diffstat (limited to 'toolkit/themes')
36 files changed, 1039 insertions, 521 deletions
diff --git a/toolkit/themes/linux/global/findBar.css b/toolkit/themes/linux/global/findBar.css index f04911402..e3e2ad086 100644 --- a/toolkit/themes/linux/global/findBar.css +++ b/toolkit/themes/linux/global/findBar.css @@ -7,6 +7,7 @@ findbar { border-top: 2px solid; -moz-border-top-colors: ThreeDShadow ThreeDHighlight; + padding-bottom: 1px; min-width: 1px; transition-property: margin-bottom, opacity, visibility; transition-duration: 150ms, 150ms, 0s; @@ -22,138 +23,66 @@ findbar[hidden] { transition-delay: 0s, 0s, 150ms; } -findbar[noanim] { - transition-duration: 0s !important; - transition-delay: 0s !important; -} - -.findbar-container { - padding-inline-start: 8px; - padding-top: 4px; - padding-bottom: 4px; -} - -.findbar-closebutton { - -moz-appearance: none; - width: 16px; - height: 16px; - margin: 0 8px; -} - -/* Search field */ - -.findbar-textbox { - -moz-appearance: none; - border: 1px solid ThreeDShadow; - box-shadow: 0 0 1px 0 ThreeDShadow inset; - margin: 0; - padding: 5px; - width: 14em; -} - -.findbar-textbox:-moz-locale-dir(ltr) { - border-radius: 3px 0 0 3px; - border-right-width: 0; -} - -.findbar-textbox:-moz-locale-dir(rtl) { - border-radius: 0 3px 3px 0; - border-left-width: 0; -} - -.findbar-textbox[focused="true"] { - border-color: Highlight; - box-shadow: 0 0 1px 0 Highlight inset; -} - -.findbar-textbox[status="notfound"] { - background-color: #f66; - color: white; -} - -.findbar-textbox[flash="true"] { - background-color: yellow; - color: black; -} - -.findbar-textbox.minimal { - border-width: 1px; - border-radius: 3px; -} - -.findbar-find-previous, -.findbar-find-next { - margin-inline-start: 0; - -moz-appearance: none; - background: linear-gradient(rgba(255,255,255,.8) 1px, rgba(255,255,255,.4) 1px, rgba(255,255,255,.1)); - border: 1px solid ThreeDShadow; - padding: 5px 9px; - line-height: 1em; -} +/* find-next button */ -.findbar-find-previous:focus, -.findbar-find-next:focus { - border-color: Highlight; - box-shadow: 0 0 1px 0 Highlight inset; +.findbar-find-next > .toolbarbutton-icon { + -moz-appearance: button-arrow-next; } -.findbar-find-previous:not([disabled]):active, -.findbar-find-next:not([disabled]):active { - background: rgba(23,50,76,.2); - border: 1px solid ThreeDShadow; - box-shadow: 0 1px 2px rgba(10,31,51,.2) inset; -} +/* find-previous button */ -.findbar-find-previous { - list-style-image: url(chrome://global/skin/icons/find-arrows.svg#glyph-find-previous); - border-inline-end-width: 0; +.findbar-find-previous > .toolbarbutton-icon { + -moz-appearance: button-arrow-previous; } -.findbar-find-next { - list-style-image: url(chrome://global/skin/icons/find-arrows.svg#glyph-find-next); -} +/* highlight button */ -.findbar-find-previous > .toolbarbutton-icon, -.findbar-find-next > .toolbarbutton-icon { - margin: 0; +.findbar-highlight { + list-style-image: url("chrome://global/skin/icons/find.png"); + -moz-image-region: rect(0px, 16px, 16px, 0px); } -.findbar-find-previous[disabled="true"] > .toolbarbutton-icon, -.findbar-find-next[disabled="true"] > .toolbarbutton-icon { - opacity: .5; +.findbar-highlight[disabled="true"] { + -moz-image-region: rect(16px, 16px, 32px, 0px); } -.findbar-find-next:-moz-locale-dir(ltr) { - border-top-right-radius: 2px; - border-bottom-right-radius: 2px; +.find-status-icon { + list-style-image: none; + margin-top: 2px; + margin-bottom: 0; + -moz-margin-start: 12px; + -moz-margin-end: 0; + width: 16px; + height: 16px; } -.findbar-find-next:-moz-locale-dir(rtl) { - border-top-left-radius: 2px; - border-bottom-left-radius: 2px; +.findbar-find-status, +.findbar-matches { + margin-top: 0 !important; + margin-bottom: 0 !important; + -moz-margin-start: 3px !important; + -moz-margin-end: 0 !important; + padding: 2px !important; } -.findbar-find-previous:focus + .findbar-find-next { - border-inline-start-width: 0; +.find-status-icon[status="notfound"] { + list-style-image: url("moz-icon://stock/gtk-dialog-error?size=menu"); } -.findbar-find-previous:focus { - border-inline-end-width: 1px; +.find-status-icon[status="pending"] { + list-style-image: url("chrome://global/skin/icons/loading_16.png"); } -.findbar-highlight, -.findbar-case-sensitive, -.findbar-entire-word { - margin-inline-start: 5px; +.findbar-textbox[status="notfound"] { + box-shadow: 0 0 0 1em #f66 inset; + color: white; } -.findbar-find-status, -.findbar-matches { - color: GrayText; - margin: 0 !important; - margin-inline-start: 12px !important; +.findbar-textbox[flash="true"] { + box-shadow: 0 0 0 1em yellow inset; + color: black; } -.find-status-icon[status="pending"] { - list-style-image: url("chrome://global/skin/icons/loading.png"); +.find-status-icon[status="wrapped"] { + list-style-image: url("chrome://global/skin/icons/wrap.png"); } diff --git a/toolkit/themes/linux/global/icons/find.png b/toolkit/themes/linux/global/icons/find.png Binary files differnew file mode 100644 index 000000000..cceed403e --- /dev/null +++ b/toolkit/themes/linux/global/icons/find.png diff --git a/toolkit/themes/linux/global/inContentUI.css b/toolkit/themes/linux/global/inContentUI.css new file mode 100644 index 000000000..afcef9274 --- /dev/null +++ b/toolkit/themes/linux/global/inContentUI.css @@ -0,0 +1,41 @@ +/* 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/. */ + +/* + * The default namespace for this file is XUL. Be sure to prefix rules that + * are applicable to both XUL and HTML with '*|'. + */ +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); +@namespace html url("http://www.w3.org/1999/xhtml"); + +/* Page background */ +*|*:root { + -moz-appearance: none; + padding: 18px; + background-color: Window; + background-image: /* Texture */ + url("chrome://global/skin/inContentUI/background-texture.png"); + color: WindowText; +} + +/* Use the new in-content colors for #contentAreaDownloadsView. After landing + of bug 989469 the colors can be moved to *|*:root */ +*|*#contentAreaDownloadsView { + background: #f1f1f1; + color: #424e5a; +} + +html|html { + font: message-box; +} + +/* Content */ +*|*.main-content { + /* Needed to allow the radius to clip the inner content, see bug 595656 */ + overflow: hidden; + background-color: -moz-Field; + color: -moz-FieldText; + border: 1px solid ThreeDShadow; + border-radius: 5px; +} diff --git a/toolkit/themes/linux/global/jar.mn b/toolkit/themes/linux/global/jar.mn index 5bde219fd..0efc8c5cf 100644 --- a/toolkit/themes/linux/global/jar.mn +++ b/toolkit/themes/linux/global/jar.mn @@ -16,6 +16,7 @@ toolkit.jar: skin/classic/global/findBar.css skin/classic/global/global.css skin/classic/global/groupbox.css + skin/classic/global/inContentUI.css skin/classic/global/listbox.css skin/classic/global/menu.css skin/classic/global/menulist.css @@ -43,6 +44,7 @@ toolkit.jar: skin/classic/global/icons/blacklist_favicon.png (icons/blacklist_favicon.png) skin/classic/global/icons/blacklist_large.png (icons/blacklist_large.png) skin/classic/global/icons/close.svg (icons/close.svg) + skin/classic/global/icons/find.png (icons/find.png) skin/classic/global/icons/resizer.png (icons/resizer.png) skin/classic/global/icons/sslWarning.png (icons/sslWarning.png) @@ -52,6 +54,6 @@ toolkit.jar: skin/classic/global/tree/twisty-clsd.png (tree/twisty-clsd.png) skin/classic/global/tree/twisty-open.png (tree/twisty-open.png) - skin/classic/global/console/console.css (console/console.css) - skin/classic/global/console/console.png (console/console.png) - skin/classic/global/console/console-toolbar.png (console/console-toolbar.png) + skin/classic/global/console/console.css (console/console.css) + skin/classic/global/console/console.png (console/console.png) + skin/classic/global/console/console-toolbar.png (console/console-toolbar.png) diff --git a/toolkit/themes/linux/mozapps/jar.mn b/toolkit/themes/linux/mozapps/jar.mn index d4997d36c..37325c0be 100644 --- a/toolkit/themes/linux/mozapps/jar.mn +++ b/toolkit/themes/linux/mozapps/jar.mn @@ -23,30 +23,33 @@ toolkit.jar: * skin/classic/mozapps/extensions/newaddon.css (webextensions/newaddon.css) skin/classic/mozapps/extensions/heart.png (webextensions/heart.png) #else -+ skin/classic/mozapps/extensions/extensions.css (extensions/extensions.css) -+ skin/classic/mozapps/extensions/category-search.png (extensions/category-search.png) -+ skin/classic/mozapps/extensions/category-discover.png (extensions/category-discover.png) -+ skin/classic/mozapps/extensions/category-languages.png (extensions/localeGeneric.png) -+ skin/classic/mozapps/extensions/category-extensions.png (extensions/extensionGeneric.png) -+ skin/classic/mozapps/extensions/category-themes.png (extensions/themeGeneric.png) -+ skin/classic/mozapps/extensions/category-plugins.png (extensions/category-plugins.png) -+ skin/classic/mozapps/extensions/category-service.png (extensions/category-service.png) -+ skin/classic/mozapps/extensions/category-dictionaries.png (extensions/category-dictionaries.png) -+ skin/classic/mozapps/extensions/category-experiments.png (extensions/category-experiments.png) -+ skin/classic/mozapps/extensions/category-recent.png (extensions/category-recent.png) -+ skin/classic/mozapps/extensions/category-available.png (extensions/category-available.png) -+ skin/classic/mozapps/extensions/extensionGeneric.png (extensions/extensionGeneric.png) -+ skin/classic/mozapps/extensions/extensionGeneric-16.png (extensions/extensionGeneric-16.png) -+ skin/classic/mozapps/extensions/dictionaryGeneric.png (extensions/dictionaryGeneric.png) -+ skin/classic/mozapps/extensions/dictionaryGeneric-16.png (extensions/dictionaryGeneric-16.png) -+ skin/classic/mozapps/extensions/experimentGeneric.png (extensions/experimentGeneric.png) -+ skin/classic/mozapps/extensions/themeGeneric.png (extensions/themeGeneric.png) -+ skin/classic/mozapps/extensions/themeGeneric-16.png (extensions/themeGeneric-16.png) -+ skin/classic/mozapps/extensions/localeGeneric.png (extensions/localeGeneric.png) -+ skin/classic/mozapps/extensions/newaddon.css (extensions/newaddon.css) -+ skin/classic/mozapps/extensions/selectAddons.css (extensions/selectAddons.css) -+ skin/classic/mozapps/xpinstall/xpinstallItemGeneric.png (extensions/extensionGeneric.png) + skin/classic/mozapps/extensions/extensions.css (extensions/extensions.css) + skin/classic/mozapps/extensions/category-search.png (extensions/category-search.png) + skin/classic/mozapps/extensions/category-discover.png (extensions/category-discover.png) + skin/classic/mozapps/extensions/category-languages.png (extensions/localeGeneric.png) + skin/classic/mozapps/extensions/category-extensions.png (extensions/extensionGeneric.png) + skin/classic/mozapps/extensions/category-themes.png (extensions/themeGeneric.png) + skin/classic/mozapps/extensions/category-plugins.png (extensions/category-plugins.png) + skin/classic/mozapps/extensions/category-service.png (extensions/category-service.png) + skin/classic/mozapps/extensions/category-dictionaries.png (extensions/category-dictionaries.png) + skin/classic/mozapps/extensions/category-experiments.png (extensions/category-experiments.png) + skin/classic/mozapps/extensions/category-recent.png (extensions/category-recent.png) + skin/classic/mozapps/extensions/category-available.png (extensions/category-available.png) + skin/classic/mozapps/extensions/extensionGeneric.png (extensions/extensionGeneric.png) + skin/classic/mozapps/extensions/extensionGeneric-16.png (extensions/extensionGeneric-16.png) + skin/classic/mozapps/extensions/dictionaryGeneric.png (extensions/dictionaryGeneric.png) + skin/classic/mozapps/extensions/dictionaryGeneric-16.png (extensions/dictionaryGeneric-16.png) + skin/classic/mozapps/extensions/experimentGeneric.png (extensions/experimentGeneric.png) + skin/classic/mozapps/extensions/themeGeneric.png (extensions/themeGeneric.png) + skin/classic/mozapps/extensions/themeGeneric-16.png (extensions/themeGeneric-16.png) + skin/classic/mozapps/extensions/localeGeneric.png (extensions/localeGeneric.png) + skin/classic/mozapps/extensions/newaddon.css (extensions/newaddon.css) + skin/classic/mozapps/extensions/selectAddons.css (extensions/selectAddons.css) + skin/classic/mozapps/xpinstall/xpinstallItemGeneric.png (extensions/extensionGeneric.png) #endif + skin/classic/mozapps/passwordmgr/key.png (passwordmgr/key.png) + skin/classic/mozapps/passwordmgr/key-16.png (passwordmgr/key-16.png) + skin/classic/mozapps/passwordmgr/key-64.png (passwordmgr/key-64.png) skin/classic/mozapps/plugins/pluginGeneric.png (plugins/pluginGeneric.png) skin/classic/mozapps/plugins/pluginBlocked.png (plugins/pluginBlocked.png) skin/classic/mozapps/plugins/pluginGeneric-16.png (plugins/pluginGeneric-16.png) diff --git a/toolkit/themes/linux/mozapps/passwordmgr/key-16.png b/toolkit/themes/linux/mozapps/passwordmgr/key-16.png Binary files differnew file mode 100644 index 000000000..ac135b847 --- /dev/null +++ b/toolkit/themes/linux/mozapps/passwordmgr/key-16.png diff --git a/toolkit/themes/linux/mozapps/passwordmgr/key-64.png b/toolkit/themes/linux/mozapps/passwordmgr/key-64.png Binary files differnew file mode 100644 index 000000000..0fb69f382 --- /dev/null +++ b/toolkit/themes/linux/mozapps/passwordmgr/key-64.png diff --git a/toolkit/themes/linux/mozapps/passwordmgr/key.png b/toolkit/themes/linux/mozapps/passwordmgr/key.png Binary files differnew file mode 100644 index 000000000..b5e8afefc --- /dev/null +++ b/toolkit/themes/linux/mozapps/passwordmgr/key.png diff --git a/toolkit/themes/osx/global/findBar.css b/toolkit/themes/osx/global/findBar.css index 4e775292f..44983d80f 100644 --- a/toolkit/themes/osx/global/findBar.css +++ b/toolkit/themes/osx/global/findBar.css @@ -9,6 +9,7 @@ findbar { background: @scopeBarBackground@; border-top: @scopeBarSeparatorBorder@; min-width: 1px; + padding: 4px 2px; transition-property: margin-bottom, opacity, visibility; transition-duration: 150ms, 150ms, 0s; transition-timing-function: ease-in-out, ease-in-out, linear; @@ -23,27 +24,16 @@ findbar[hidden] { transition-delay: 0s, 0s, 150ms; } -findbar[noanim] { - transition-duration: 0s !important; - transition-delay: 0s !important; -} - findbar:-moz-lwtheme { -moz-appearance: none; background: none; border-style: none; } -.findbar-container { - padding-inline-start: 2px; - padding-top: 4px; - padding-bottom: 4px; -} - label.findbar-find-fast { + margin: 1px 3px 0 !important; color: @scopeBarTitleColor@; - margin: 0; - margin-inline-start: 12px; + font-weight: bold; text-shadow: @loweredShadow@; } @@ -54,15 +44,20 @@ label.findbar-find-fast:-moz-lwtheme, } .findbar-closebutton { - margin-inline-start: 4px; - padding-inline-start: 0; - padding-inline-end: 8px; + padding: 0; + margin: 0 4px; border: none; - /* make sure the closebutton is displayed as the first element in the bar: */ - -moz-box-ordinal-group: 0; +} + +.findbar-closebutton:-moz-lwtheme-brighttext { + list-style-image: url("chrome://global/skin/icons/close-inverted.png"); } @media (min-resolution: 2dppx) { + .findbar-closebutton:-moz-lwtheme-brighttext { + list-style-image: url("chrome://global/skin/icons/close-inverted@2x.png"); + } + .findbar-closebutton > .toolbarbutton-icon { width: 16px; } @@ -70,109 +65,124 @@ label.findbar-find-fast:-moz-lwtheme, .findbar-find-next, .findbar-find-previous, -.findbar-highlight, -.findbar-case-sensitive, -.findbar-entire-word { +.findbar-highlight { + margin: 0 4px; + padding: 1px 3px; -moz-appearance: none; border-radius: 10000px; border: @roundButtonBorder@; background: @roundButtonBackground@; box-shadow: @roundButtonShadow@; color: buttontext; - margin: 0; } -@media (-moz-mac-yosemite-theme) { - .findbar-find-previous, - .findbar-find-next { - border-radius: 3px; - box-shadow: none; - } -} - -.findbar-highlight, -.findbar-case-sensitive, -.findbar-entire-word { - margin-inline-end: 5px; - padding: 2px 9px; -} - -.findbar-highlight { - margin-inline-start: 8px; -} - -.findbar-container > toolbarbutton:-moz-focusring, -.findbar-find-next:-moz-focusring, -.findbar-find-previous:-moz-focusring { +.findbar-container > toolbarbutton:-moz-focusring { position: relative; box-shadow: @focusRingShadow@, @roundButtonShadow@; } +.findbar-container > toolbarbutton > .toolbarbutton-text { + margin: 0 6px !important; +} + .findbar-container > toolbarbutton[disabled] { color: GrayText !important; } .findbar-find-next:not([disabled]):hover:active, .findbar-find-previous:not([disabled]):hover:active, -.findbar-highlight:not([disabled]):hover:active, -.findbar-case-sensitive:not([disabled]):hover:active, -.findbar-entire-word:not([disabled]):hover:active, -.findbar-highlight:not([disabled])[checked="true"], -.findbar-case-sensitive:not([disabled])[checked="true"], -.findbar-entire-word:not([disabled])[checked="true"] { +.findbar-highlight:not([disabled]):hover:active { text-shadow: @loweredShadow@; background: @roundButtonPressedBackground@; box-shadow: @roundButtonPressedShadow@; } -.findbar-find-next:hover:active:-moz-focusring, -.findbar-find-previous:hover:active:-moz-focusring { +.findbar-container > toolbarbutton:hover:active:-moz-focusring { text-shadow: @loweredShadow@; background: @roundButtonPressedBackground@; box-shadow: @focusRingShadow@, @roundButtonPressedShadow@; } -@media (-moz-mac-yosemite-theme) { - .findbar-container > toolbarbutton:-moz-focusring, - .findbar-find-next:-moz-focusring, - .findbar-find-previous:-moz-focusring { - box-shadow: @yosemiteFocusRingShadow@, @roundButtonShadow@; +.findbar-closebutton > .toolbarbutton-text { + display: none; +} + +/* Match case checkbox */ + +.findbar-container > checkbox { + list-style-image: url("chrome://global/skin/icons/checkbox.png"); + -moz-image-region: rect(0px 16px 16px 0px); + -moz-appearance: none; + margin: 0 2px; + -moz-margin-start: 7px; +} + +.findbar-container > checkbox:hover:active { + -moz-image-region: rect(0px 32px 16px 16px); +} +.findbar-container > checkbox[checked] { + -moz-image-region: rect(0px 48px 16px 32px); +} +.findbar-container > checkbox[checked]:hover:active { + -moz-image-region: rect(0px 64px 16px 48px); +} + +@media (min-resolution: 2dppx) { + .findbar-container > checkbox { + list-style-image: url("chrome://global/skin/icons/checkbox@2x.png"); + -moz-image-region: rect(0px 32px 32px 0px); } - .findbar-find-next:hover:active:-moz-focusring, - .findbar-find-previous:hover:active:-moz-focusring { - box-shadow: @yosemiteFocusRingShadow@, @roundButtonPressedShadow@; + .findbar-container > checkbox:hover:active { + -moz-image-region: rect(0px 64px 32px 32px); + } + .findbar-container > checkbox[checked] { + -moz-image-region: rect(0px 96px 32px 64px); + } + .findbar-container > checkbox[checked]:hover:active { + -moz-image-region: rect(0px 128px 32px 96px); } } -/* Search field */ -.findbar-textbox { - position: relative; - -moz-appearance: none; - border: @roundButtonBorder@; - border-radius: 10000px 0 0 10000px; - box-shadow: @roundButtonShadow@; - background: url("chrome://global/skin/icons/search-textbox.svg") -moz-Field no-repeat 5px center; - margin: 0; - padding: 2px 8px; - padding-inline-start: 19px; + +.findbar-container > checkbox > .checkbox-check { + display: none; } -.findbar-textbox:-moz-locale-dir(rtl) { - border-radius: 0 10000px 10000px 0; +.findbar-container > checkbox > .checkbox-label-box > .checkbox-label { + margin: 0 !important; + padding: 2px 0 0; } -@media (-moz-mac-yosemite-theme) { - .findbar-textbox { - border-top-left-radius: 3px; - border-bottom-left-radius: 3px; - box-shadow: none; +.findbar-container > checkbox > .checkbox-label-box > .checkbox-icon { + -moz-padding-start: 1px; + padding-bottom: 1px; +} +@media (min-resolution: 2dppx) { + .findbar-container > checkbox > .checkbox-label-box > .checkbox-icon { + width: 17px; + height: 17px; } +} - .findbar-textbox:-moz-locale-dir(rtl) { - border-radius: 0 3px 3px 0; - } +.findbar-container > checkbox:-moz-focusring > .checkbox-label-box > .checkbox-icon { + border-radius: 4px; + box-shadow: @focusRingShadow@; +} + +/* Search field */ + +.findbar-textbox { + -moz-appearance: none; + border-radius: 10000px; + border: none; + box-shadow: 0 1px 1.5px rgba(0, 0, 0, .7) inset, + 0 0 0 1px rgba(0, 0, 0, .17) inset; + background: url("chrome://global/skin/icons/search-textbox.png") -moz-Field no-repeat 5px center; + margin: 0 4px -1px; + padding: 3px 8px 2px; + -moz-padding-start: 19px; } .findbar-textbox:not([focused="true"]):-moz-lwtheme { @@ -180,13 +190,8 @@ label.findbar-find-fast:-moz-lwtheme, } .findbar-textbox[focused="true"] { - box-shadow: @focusRingShadow@; -} - -@media (-moz-mac-yosemite-theme) { - .findbar-textbox[focused="true"] { - box-shadow: @yosemiteFocusRingShadow@; - } + box-shadow: @focusRingShadow@, + 0 1px 1.5px rgba(0, 0, 0, .8) inset; } .findbar-textbox[flash="true"] { @@ -198,48 +203,52 @@ label.findbar-find-fast:-moz-lwtheme, color: #FFF; } -.findbar-textbox.minimal { - border-radius: 10000px; - margin-inline-start: 5px; -} - -/* Find previous/next buttons */ +/* find-next button */ -.findbar-find-previous, .findbar-find-next { - margin-inline-start: 0; - padding: 3px 6px 1px; + -moz-border-end: none; + -moz-margin-end: 0 !important; } -.findbar-find-previous > .toolbarbutton-icon, -.findbar-find-next > .toolbarbutton-icon { - margin: 0; +.findbar-find-next:-moz-locale-dir(ltr), +.findbar-find-previous:-moz-locale-dir(rtl) { + border-top-right-radius: 0px; + border-bottom-right-radius: 0px; } +/* find-previous button */ + .findbar-find-previous { - border-left: none; - border-right: none; - margin-inline-end: 0; - list-style-image: url(chrome://global/skin/icons/find-arrows.svg#glyph-find-previous); - border-radius: 0; + -moz-margin-start: 0 !important; } -.findbar-find-next { - list-style-image: url(chrome://global/skin/icons/find-arrows.svg#glyph-find-next); - padding-inline-end: 7px; +.findbar-find-previous:-moz-locale-dir(ltr), +.findbar-find-next:-moz-locale-dir(rtl) { + border-top-left-radius: 0px; + border-bottom-left-radius: 0px; } -.findbar-find-next:-moz-locale-dir(ltr) { - border-top-left-radius: 0; - border-bottom-left-radius: 0; +/* highlight button */ + +.findbar-highlight { + -moz-margin-start: 8px; } -.findbar-find-next:-moz-locale-dir(rtl) { - border-top-right-radius: 0; - border-bottom-right-radius: 0; +.findbar-highlight > .toolbarbutton-icon { + width: 13px; + height: 8px; + margin: 0 4px; + -moz-margin-end: 0; + border: 1px solid #818181; + border-radius: 4px; + background-color: #F4F4F3; } -/* Status description */ + +.findbar-highlight[checked="true"] > .toolbarbutton-icon { + background-color: #FFFF00; + border-color: #818100; +} .find-status-icon { display: none; @@ -247,20 +256,14 @@ label.findbar-find-fast:-moz-lwtheme, .find-status-icon[status="pending"] { display: block; - list-style-image: url("chrome://global/skin/icons/loading.png"); -} - -@media (min-resolution: 2dppx) { - .find-status-icon[status="pending"] { - width: 16px; - list-style-image: url("chrome://global/skin/icons/loading@2x.png"); - } + list-style-image: url("chrome://global/skin/icons/loading_16.png"); } .findbar-find-status, .found-matches { - color: rgba(0,0,0,.5); - margin: 0 !important; - margin-inline-start: 12px !important; - text-shadow: 0 1px rgba(255,255,255,.4); + color: #436599; + font-weight: bold; + text-shadow: 0 1px rgba(255, 255, 255, .4); + margin: 1px 1px 0 !important; + -moz-margin-start: 12px !important; } diff --git a/toolkit/themes/osx/global/inContentUI.css b/toolkit/themes/osx/global/inContentUI.css new file mode 100644 index 000000000..17e2e6ae3 --- /dev/null +++ b/toolkit/themes/osx/global/inContentUI.css @@ -0,0 +1,144 @@ +/* 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/. */ + +%include shared.inc + +/* + * The default namespace for this file is XUL. Be sure to prefix rules that + * are applicable to both XUL and HTML with '*|'. + */ +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); +@namespace html url("http://www.w3.org/1999/xhtml"); + +/* Page background */ +*|*:root { + -moz-appearance: none; + padding: 18px; + background-image: /* Texture */ + url("chrome://global/skin/inContentUI/background-texture.png"), + /* Gradient */ + linear-gradient(#ADB5C2, #BFC6D1); +} + +/* Use the new in-content colors for #contentAreaDownloadsView. After landing + of bug 989469 the colors can be moved to *|*:root */ +*|*#contentAreaDownloadsView { + background: #f1f1f1; + color: #424e5a; +} + +html|html { + font: message-box; +} + +/* Content */ +*|*.main-content { + /* Needed to allow the radius to clip the inner content, see bug 595656 */ + overflow: hidden; + background-image: linear-gradient(rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.25) 50%, rgba(255, 255, 255, 0.05)); + border: 1px solid rgba(50, 65, 92, 0.4); + border-radius: 5px; +} + +/* Buttons */ +*|button, +menulist, +colorpicker[type="button"] { + -moz-appearance: none; + padding: 1px 4px; + min-width: 60px; + border-radius: 3px; + border: 1px solid rgba(60,73,97,0.5); + box-shadow: inset 0 1px rgba(255,255,255,0.25), 0 1px rgba(255,255,255,0.25); + background-color: transparent; + background-image: linear-gradient(rgba(255,255,255,0.45), rgba(255,255,255,0.2)); + background-clip: padding-box; + color: #252F3B; + text-shadow: @loweredShadow@; +} + +button:-moz-focusring > .button-box, +menulist:-moz-focusring:not([open="true"]) > .menulist-label-box, +colorpicker[type="button"]:-moz-focusring:not([open="true"]) > .colorpicker-button-colorbox { + outline: 1px dotted #252F3B; +} + +html|button[disabled], +button[disabled="true"], +menulist[disabled="true"], +colorpicker[type="button"][disabled="true"] { + opacity: 0.8; + color: #505050; +} + +html|button:not([disabled]):active:hover, +button:not([disabled="true"]):active:hover, +menulist[open="true"]:not([disabled="true"]), +colorpicker[type="button"][open="true"]:not([disabled="true"]) { + box-shadow: inset 0 1px 3px rgba(0,0,0,.2), 0 1px rgba(255,255,255,0.25); + background-image: linear-gradient(rgba(45,54,71,0.3), rgba(45,54,71,0.1)); + border-color: rgba(60,73,97,0.7); +} + +menulist { + -moz-padding-end: 0; + margin-left: 5px; + margin-right: 5px; +} + +/* Tweak margins so the focus ring is in the right place. */ +menulist > .menulist-label-box { + -moz-margin-end: 3px; + margin-top: 1px; +} + +menulist > .menulist-label-box > .menulist-label { + margin-top: 0px !important; + margin-bottom: 0px !important; +} + +menulist > .menulist-dropmarker { + -moz-appearance: none; + display: -moz-box; + background: transparent; + border: none; + -moz-border-start: 1px solid rgba(60,73,97,0.5); + margin-top: -1px; + margin-bottom: -1px; +} + +colorpicker[type="button"] { + margin: 1px 5px 2px 5px; + padding: 3px; + height: 25px; +} + +spinbuttons { + -moz-appearance: none; +} + +spinbuttons > .spinbuttons-box > .spinbuttons-button { + min-width: 12px; +} + +.spinbuttons-button > .button-box > .button-text { + display: none; +} + +.spinbuttons-button[disabled="true"] > .button-box > .button-icon { + opacity: 0.5; +} + +spinbuttons > .spinbuttons-box > .spinbuttons-up { + list-style-image: url("chrome://global/skin/arrow/arrow-up.gif"); + border-bottom-width: 0; + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; +} + +spinbuttons > .spinbuttons-box > .spinbuttons-down { + list-style-image: url("chrome://global/skin/arrow/arrow-dn.gif"); + border-top-left-radius: 0; + border-top-right-radius: 0; +} diff --git a/toolkit/themes/osx/global/jar.mn b/toolkit/themes/osx/global/jar.mn index 79bb062ab..9407ccee5 100644 --- a/toolkit/themes/osx/global/jar.mn +++ b/toolkit/themes/osx/global/jar.mn @@ -21,6 +21,7 @@ toolkit.jar: * skin/classic/global/findBar.css * skin/classic/global/global.css skin/classic/global/groupbox.css +* skin/classic/global/inContentUI.css skin/classic/global/linkTree.css skin/classic/global/listbox.css skin/classic/global/menu.css diff --git a/toolkit/themes/osx/mozapps/jar.mn b/toolkit/themes/osx/mozapps/jar.mn index 35927755b..f8ade11d9 100644 --- a/toolkit/themes/osx/mozapps/jar.mn +++ b/toolkit/themes/osx/mozapps/jar.mn @@ -83,6 +83,9 @@ toolkit.jar: skin/classic/mozapps/extensions/blocklist.css (extensions/blocklist.css) * skin/classic/mozapps/extensions/newaddon.css (extensions/newaddon.css) #endif + skin/classic/mozapps/passwordmgr/key.png (passwordmgr/key.png) + skin/classic/mozapps/passwordmgr/key-16.png (passwordmgr/key-16.png) + skin/classic/mozapps/passwordmgr/key-64.png (passwordmgr/key-64.png) skin/classic/mozapps/plugins/notifyPluginGeneric.png (plugins/notifyPluginGeneric.png) skin/classic/mozapps/plugins/pluginGeneric.png (plugins/pluginGeneric.png) skin/classic/mozapps/plugins/pluginBlocked.png (plugins/pluginBlocked.png) diff --git a/toolkit/themes/osx/mozapps/passwordmgr/key-16.png b/toolkit/themes/osx/mozapps/passwordmgr/key-16.png Binary files differnew file mode 100644 index 000000000..ac135b847 --- /dev/null +++ b/toolkit/themes/osx/mozapps/passwordmgr/key-16.png diff --git a/toolkit/themes/osx/mozapps/passwordmgr/key-64.png b/toolkit/themes/osx/mozapps/passwordmgr/key-64.png Binary files differnew file mode 100644 index 000000000..0fb69f382 --- /dev/null +++ b/toolkit/themes/osx/mozapps/passwordmgr/key-64.png diff --git a/toolkit/themes/osx/mozapps/passwordmgr/key.png b/toolkit/themes/osx/mozapps/passwordmgr/key.png Binary files differnew file mode 100644 index 000000000..b5e8afefc --- /dev/null +++ b/toolkit/themes/osx/mozapps/passwordmgr/key.png diff --git a/toolkit/themes/shared/about.css b/toolkit/themes/shared/about.css index 25f52992a..5c40dbfea 100644 --- a/toolkit/themes/shared/about.css +++ b/toolkit/themes/shared/about.css @@ -26,8 +26,8 @@ body { } #aboutLogoContainer { - border: 1px solid ThreeDLightShadow; width: 300px; + margin: 0 auto; margin-bottom: 2em; } @@ -35,12 +35,6 @@ img { border: 0; } -#version { - font-weight: bold; - color: #909090; - margin: -24px 0 9px 17px; -} - ul { margin: 0; margin-inline-start: 1.5em; diff --git a/toolkit/themes/shared/datetimeinputpickers.css b/toolkit/themes/shared/datetimeinputpickers.css new file mode 100644 index 000000000..f0c4315e5 --- /dev/null +++ b/toolkit/themes/shared/datetimeinputpickers.css @@ -0,0 +1,377 @@ +/* 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/. */ + +:root { + --font-size-default: 1.1rem; + --spinner-width: 3rem; + --spinner-margin-top-bottom: 0.4rem; + --spinner-item-height: 2.4rem; + --spinner-item-margin-bottom: 0.1rem; + --spinner-button-height: 1.2rem; + --colon-width: 2rem; + --day-period-spacing-width: 1rem; + --calendar-width: 23.1rem; + --date-picker-item-height: 2.5rem; + --date-picker-item-width: 3.3rem; + + --border: 0.1rem solid #D6D6D6; + --border-radius: 0.3rem; + --border-active-color: #B1B1B1; + + --font-color: #191919; + --fill-color: #EBEBEB; + + --today-fill-color: rgb(212, 212, 212); + + --selected-font-color: #FFFFFF; + --selected-fill-color: #0996F8; + + --button-font-color: #858585; + --button-font-color-hover: #4D4D4D; + --button-font-color-active: #191919; + --button-fill-color-active: #D4D4D4; + + --weekday-header-font-color: #6C6C6C; + --weekend-header-font-color: rgb(218, 78, 68); + + --weekend-font-color: rgb(218, 78, 68); + --weekday-outside-font-color: rgb(153, 153, 153); + --weekend-outside-font-color: rgb(255, 152, 143); + + --weekday-disabled-font-color: rgba(25, 25, 25, 0.2); + --weekend-disabled-font-color: rgba(218, 78, 68, 0.2); + --disabled-fill-color: rgba(235, 235, 235, 0.8); + + --disabled-opacity: 0.2; +} + +html { + font-size: 10px; +} + +body { + margin: 0; + color: var(--font-color); + font: message-box; + font-size: var(--font-size-default); +} + +button { + -moz-appearance: none; + background: none; + border: none; +} + +.nav { + display: flex; + width: var(--calendar-width); + height: 2.4rem; + margin-bottom: 0.8rem; + justify-content: space-between; +} + +.nav > button { + width: 3rem; + height: var(--date-picker-item-height); + background-color: var(--button-font-color); +} + +.nav > button:hover { + background-color: var(--button-font-color-hover); +} + +.nav > button.active { + background-color: var(--button-font-color-active); +} + +.nav > button.left { + background: url("chrome://global/skin/icons/calendar-arrows.svg#left") no-repeat 50% 50%; +} + +.nav > button.right { + background: url("chrome://global/skin/icons/calendar-arrows.svg#right") no-repeat 50% 50%; +} + +.month-year-container { + position: absolute; + display: flex; + justify-content: center; + align-items: center; + top: 0; + left: 3rem; + width: 17.1rem; + height: var(--date-picker-item-height); + z-index: 10; +} + +button.month-year { + font-size: 1.3rem; + border: var(--border); + border-radius: 0.3rem; + padding: 0.2rem 2.6rem 0.2rem 1.2rem; +} + +button.month-year:hover { + background: var(--fill-color); +} + +button.month-year.active { + border-color: var(--border-active-color); + background: var(--button-fill-color-active); +} + +button.month-year::after { + position: absolute; + content: ""; + width: 2.6rem; + height: 1.6rem; + background: url("chrome://global/skin/icons/spinner-arrows.svg#down") no-repeat 50% 50%; +} + +button.month-year.active::after { + background: url("chrome://global/skin/icons/spinner-arrows.svg#up") no-repeat 50% 50%; +} + +.month-year-view { + position: absolute; + z-index: 5; + padding-top: 3.2rem; + top: 0; + left: 0; + bottom: 0; + width: var(--calendar-width); + background: window; + opacity: 1; + transition: opacity 0.15s; +} + +.month-year-view.hidden { + visibility: hidden; + opacity: 0; +} + +.month-year-view > .spinner-container { + width: 5.5rem; + margin: 0 0.5rem; +} + +.month-year-view .spinner { + transform: scaleY(1); + transform-origin: top; + transition: transform 0.15s; +} + +.month-year-view.hidden .spinner { + transform: scaleY(0); + transition: none; +} + +.month-year-view .spinner > div { + transform: scaleY(1); + transition: transform 0.15s; +} + +.month-year-view.hidden .spinner > div { + transform: scaleY(2.5); + transition: none; +} + +.calendar-container { + cursor: default; + display: flex; + flex-direction: column; + width: var(--calendar-width); +} + +.week-header { + display: flex; +} + +.week-header > div { + color: var(--weekday-header-font-color); +} + +.week-header > div.weekend { + color: var(--weekend-header-font-color); +} + +.days-viewport { + height: 15rem; + overflow: hidden; + position: relative; +} + +.days-view { + position: absolute; + display: flex; + flex-wrap: wrap; + flex-direction: row; +} + +.week-header > div, +.days-view > div { + align-items: center; + display: flex; + height: var(--date-picker-item-height); + position: relative; + justify-content: center; + width: var(--date-picker-item-width); +} + +.days-view > .outside { + color: var(--weekday-outside-font-color); +} + +.days-view > .weekend { + color: var(--weekend-font-color); +} + +.days-view > .weekend.outside { + color: var(--weekend-outside-font-color); +} + +.days-view > .out-of-range, +.days-view > .off-step { + color: var(--weekday-disabled-font-color); + background: var(--disabled-fill-color); +} + +.days-view > .out-of-range.weekend, +.days-view > .off-step.weekend { + color: var(--weekend-disabled-font-color); +} + +.days-view > .today { + font-weight: bold; +} + +.days-view > .out-of-range::before, +.days-view > .off-step::before { + display: none; +} + +.days-view > div:hover::before, +.days-view > .select::before, +.days-view > .today::before { + top: 5%; + bottom: 5%; + left: 5%; + right: 5%; +} + +#time-picker, +.month-year-view { + display: flex; + flex-direction: row; + justify-content: center; +} + +.spinner-container { + display: flex; + flex-direction: column; + width: var(--spinner-width); +} + +.spinner-container > button { + background-color: var(--button-font-color); + height: var(--spinner-button-height); +} + +.spinner-container > button:hover { + background-color: var(--button-font-color-hover); +} + +.spinner-container > button.active { + background-color: var(--button-font-color-active); +} + +.spinner-container > button.up { + background: url("chrome://global/skin/icons/spinner-arrows.svg#up") no-repeat 50% 50%; +} + +.spinner-container > button.down { + background: url("chrome://global/skin/icons/spinner-arrows.svg#down") no-repeat 50% 50%; +} + +.spinner-container.hide-buttons > button { + visibility: hidden; +} + +.spinner-container > .spinner { + position: relative; + width: 100%; + margin: var(--spinner-margin-top-bottom) 0; + cursor: default; + overflow-y: scroll; + scroll-snap-type: mandatory; + scroll-snap-points-y: repeat(100%); +} + +.spinner-container > .spinner > div { + box-sizing: border-box; + position: relative; + text-align: center; + padding: calc((var(--spinner-item-height) - var(--font-size-default)) / 2) 0; + margin-bottom: var(--spinner-item-margin-bottom); + height: var(--spinner-item-height); + -moz-user-select: none; + scroll-snap-coordinate: 0 0; +} + +.spinner-container > .spinner > div::before, +.calendar-container .days-view > div::before { + position: absolute; + top: 5%; + bottom: 5%; + left: 5%; + right: 5%; + z-index: -10; + border-radius: var(--border-radius); +} + +.spinner-container > .spinner > div:hover::before, +.calendar-container .days-view > div:hover::before { + background: var(--fill-color); + border: var(--border); + content: ""; +} + +.calendar-container .days-view > div.today::before { + background: var(--today-fill-color); + content: ""; +} + +.spinner-container > .spinner:not(.scrolling) > div.selection, +.calendar-container .days-view > div.selection { + color: var(--selected-font-color); +} + +.spinner-container > .spinner > div.selection::before, +.calendar-container .days-view > div.selection::before { + background: var(--selected-fill-color); + border: none; + content: ""; +} + +.spinner-container > .spinner > div.disabled::before, +.spinner-container > .spinner.scrolling > div.selection::before, +.spinner-container > .spinner.scrolling > div:hover::before { + display: none; +} + +.spinner-container > .spinner > div.disabled { + opacity: var(--disabled-opacity); +} + +.colon { + display: flex; + justify-content: center; + align-items: center; + width: var(--colon-width); + margin-bottom: 0.3rem; +} + +.spacer { + width: var(--day-period-spacing-width); +}
\ No newline at end of file diff --git a/toolkit/themes/shared/datetimepopup.css b/toolkit/themes/shared/datetimepopup.css new file mode 100644 index 000000000..52f6fc7a2 --- /dev/null +++ b/toolkit/themes/shared/datetimepopup.css @@ -0,0 +1,11 @@ +/* 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/. */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +panel[type="arrow"][side="top"], +panel[type="arrow"][side="bottom"] { + margin-left: 0; + margin-right: 0; +} diff --git a/toolkit/themes/shared/icons/calendar-arrows.svg b/toolkit/themes/shared/icons/calendar-arrows.svg new file mode 100644 index 000000000..858676f55 --- /dev/null +++ b/toolkit/themes/shared/icons/calendar-arrows.svg @@ -0,0 +1,13 @@ +<?xml version="1.0" encoding="utf-8"?> +<!-- 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/. --> +<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14"> + <style> + path:not(:target) { + display: none; + } + </style> + <path id="right" d="M4.8 14L3 12.3 8.5 7 3 1.7 4.8 0 12 7"/> + <path id="left" d="M9.2 0L11 1.7 5.5 7 11 12.3 9.2 14 2 7"/> +</svg> diff --git a/toolkit/themes/shared/icons/spinner-arrows.svg b/toolkit/themes/shared/icons/spinner-arrows.svg new file mode 100644 index 000000000..a8ba72d6b --- /dev/null +++ b/toolkit/themes/shared/icons/spinner-arrows.svg @@ -0,0 +1,13 @@ +<?xml version="1.0" encoding="utf-8"?> +<!-- 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/. --> +<svg xmlns="http://www.w3.org/2000/svg" width="10" height="6" viewBox="0 0 10 6"> + <style> + path:not(:target) { + display: none; + } + </style> + <path id="down" d="M0 1l1-1 4 4 4-4 1 1-5 5"/> + <path id="up" d="M0 5l1 1 4-4 4 4 1-1-5-5"/> +</svg> diff --git a/toolkit/themes/shared/jar.inc.mn b/toolkit/themes/shared/jar.inc.mn index 9c3d86a40..bdfca2a05 100644 --- a/toolkit/themes/shared/jar.inc.mn +++ b/toolkit/themes/shared/jar.inc.mn @@ -21,12 +21,15 @@ toolkit.jar: skin/classic/global/aboutSupport.css (../../shared/aboutSupport.css) skin/classic/global/appPicker.css (../../shared/appPicker.css) skin/classic/global/config.css (../../shared/config.css) - skin/classic/global/timepicker.css (../../shared/timepicker.css) + skin/classic/global/datetimeinputpickers.css (../../shared/datetimeinputpickers.css) + skin/classic/global/datetimepopup.css (../../shared/datetimepopup.css) + skin/classic/global/icons/calendar-arrows.svg (../../shared/icons/calendar-arrows.svg) skin/classic/global/icons/find-arrows.svg (../../shared/icons/find-arrows.svg) skin/classic/global/icons/info.svg (../../shared/incontent-icons/info.svg) skin/classic/global/icons/input-clear.svg (../../shared/icons/input-clear.svg) skin/classic/global/icons/loading.png (../../shared/icons/loading.png) skin/classic/global/icons/loading@2x.png (../../shared/icons/loading@2x.png) + skin/classic/global/icons/spinner-arrows.svg (../../shared/icons/spinner-arrows.svg) skin/classic/global/icons/warning.svg (../../shared/incontent-icons/warning.svg) skin/classic/global/icons/blocked.svg (../../shared/incontent-icons/blocked.svg) skin/classic/global/alerts/alert-common.css (../../shared/alert-common.css) diff --git a/toolkit/themes/shared/non-mac.jar.inc.mn b/toolkit/themes/shared/non-mac.jar.inc.mn index a783bbb3c..637537d9d 100644 --- a/toolkit/themes/shared/non-mac.jar.inc.mn +++ b/toolkit/themes/shared/non-mac.jar.inc.mn @@ -77,6 +77,8 @@ skin/classic/global/icons/Landscape.png (../../windows/global/icons/Landscape.png) skin/classic/global/icons/Question.png (../../windows/global/icons/Question.png) skin/classic/global/icons/question-16.png (../../windows/global/icons/question-16.png) + skin/classic/global/icons/question-32.png (../../windows/global/icons/question-32.png) + skin/classic/global/icons/question-48.png (../../windows/global/icons/question-48.png) skin/classic/global/icons/question-64.png (../../windows/global/icons/question-64.png) skin/classic/global/icons/resizer-rtl.png (../../windows/global/icons/resizer-rtl.png) skin/classic/global/icons/Restore.gif (../../windows/global/icons/Restore.gif) diff --git a/toolkit/themes/shared/timepicker.css b/toolkit/themes/shared/timepicker.css deleted file mode 100644 index e8d081b30..000000000 --- a/toolkit/themes/shared/timepicker.css +++ /dev/null @@ -1,153 +0,0 @@ -/* 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/. */ - -:root { - --font-size-default: 1.1rem; - --spinner-width: 3rem; - --spinner-margin-top-bottom: 0.4rem; - --spinner-item-height: 2.4rem; - --spinner-item-margin-bottom: 0.1rem; - --spinner-button-height: 1.2rem; - --colon-width: 2rem; - --day-period-spacing-width: 1rem; - - --border: 0.1rem solid #D6D6D6; - --border-radius: 0.3rem; - - --font-color: #191919; - --fill-color: #EBEBEB; - - --selected-font-color: #FFFFFF; - --selected-fill-color: #0996F8; - - --button-font-color: #858585; - --button-font-color-hover: #4D4D4D; - --button-font-color-active: #191919; - - --disabled-opacity: 0.2; -} - -html { - font-size: 10px; -} - -body { - margin: 0; - color: var(--font-color); - font-size: var(--font-size-default); -} - -#time-picker { - display: flex; - flex-direction: row; - justify-content: space-around; -} - -.spinner-container { - font-family: sans-serif; - display: flex; - flex-direction: column; - width: var(--spinner-width); -} - -.spinner-container > button { - -moz-appearance: none; - border: none; - background: none; - background-color: var(--button-font-color); - height: var(--spinner-button-height); -} - -.spinner-container > button:hover { - background-color: var(--button-font-color-hover); -} - -.spinner-container > button.active { - background-color: var(--button-font-color-active); -} - -.spinner-container > button.up { - mask: url("chrome://global/skin/icons/find-arrows.svg#glyph-find-previous") no-repeat 50% 50%; -} - -.spinner-container > button.down { - mask: url("chrome://global/skin/icons/find-arrows.svg#glyph-find-next") no-repeat 50% 50%; -} - -.spinner-container.hide-buttons > button { - visibility: hidden; -} - -.spinner-container > .spinner { - position: relative; - width: 100%; - margin: var(--spinner-margin-top-bottom) 0; - cursor: default; - overflow-y: scroll; - scroll-snap-type: mandatory; - scroll-snap-points-y: repeat(100%); -} - -.spinner-container > .spinner > div { - box-sizing: border-box; - position: relative; - text-align: center; - padding: calc((var(--spinner-item-height) - var(--font-size-default)) / 2) 0; - margin-bottom: var(--spinner-item-margin-bottom); - height: var(--spinner-item-height); - -moz-user-select: none; - scroll-snap-coordinate: 0 0; -} - -.spinner-container > .spinner > div:hover::before { - background: var(--fill-color); - border: var(--border); - border-radius: var(--border-radius); - content: ""; - position: absolute; - top: 0%; - bottom: 0%; - left: 0%; - right: 0%; - z-index: -10; -} - -.spinner-container > .spinner:not(.scrolling) > div.selection { - color: var(--selected-font-color); -} - -.spinner-container > .spinner > div.selection::before { - background: var(--selected-fill-color); - border: none; - border-radius: var(--border-radius); - content: ""; - position: absolute; - top: 0%; - bottom: 0%; - left: 0%; - right: 0%; - z-index: -10; -} - -.spinner-container > .spinner > div.disabled::before, -.spinner-container > .spinner.scrolling > div.selection::before, -.spinner-container > .spinner.scrolling > div:hover::before { - display: none; -} - -.spinner-container > .spinner > div.disabled { - opacity: var(--disabled-opacity); -} - -.colon { - display: flex; - justify-content: center; - align-items: center; - width: var(--colon-width); - margin-bottom: 0.3rem; -} - -.spacer { - width: var(--day-period-spacing-width); -}
\ No newline at end of file diff --git a/toolkit/themes/windows/global/findBar.css b/toolkit/themes/windows/global/findBar.css index 96115f193..34b3ae49b 100644 --- a/toolkit/themes/windows/global/findBar.css +++ b/toolkit/themes/windows/global/findBar.css @@ -4,8 +4,18 @@ @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); +.findbar-closebutton { + border: none; + padding: 3px 5px; + -moz-appearance: none; +} + +.findbar-closebutton:-moz-lwtheme-brighttext { + list-style-image: url("chrome://global/skin/icons/close-inverted.png"); +} + findbar { - box-shadow: 0 1px 1px rgba(0,0,0,.1) inset; + padding-top: 1px; background-image: linear-gradient(rgba(0,0,0,.15) 1px, rgba(255,255,255,.15) 1px); background-size: 100% 2px; background-repeat: no-repeat; @@ -24,137 +34,94 @@ findbar[hidden] { transition-delay: 0s, 0s, 150ms; } -findbar[noanim] { - transition-duration: 0s !important; - transition-delay: 0s !important; -} +/* find-next button */ -.findbar-container { - padding-inline-start: 8px; - padding-top: 4px; - padding-bottom: 4px; +.findbar-find-next { + list-style-image: url("chrome://global/skin/icons/find.png"); + -moz-image-region: rect(0px 16px 16px 0px); } -.findbar-closebutton { - margin-inline-start: 4px; - padding-inline-start: 0; - padding-inline-end: 8px; - border: none; - -moz-appearance: none; +.findbar-find-next:hover { + -moz-image-region: rect(16px 16px 32px 0px); } - -/* Search field */ - -.findbar-textbox { - -moz-appearance: none; - border: 1px solid ThreeDShadow; - border-radius: 2px 0 0 2px; - margin: 0; - padding: 1px 5px; - width: 14em; +.findbar-find-next[disabled="true"] { + -moz-image-region: rect(32px 16px 48px 0px) !important; } -.findbar-textbox:-moz-locale-dir(rtl) { - border-radius: 0 2px 2px 0; -} +/* find-previous button */ -.findbar-textbox[focused="true"] { - border-color: Highlight; +.findbar-find-previous { + list-style-image: url("chrome://global/skin/icons/find.png"); + -moz-image-region: rect(0px 32px 16px 16px); } -.findbar-textbox[status="notfound"] { - background-color: #f66; - color: white; +.findbar-find-previous:hover { + -moz-image-region: rect(16px 32px 32px 16px); } -.findbar-textbox[flash="true"] { - background-color: yellow; - color: black; +.findbar-find-previous[disabled="true"] { + -moz-image-region: rect(32px 32px 48px 16px) !important; } -.findbar-textbox.minimal { - border-radius: 2px; -} - -/* Buttons */ - -.findbar-find-previous, -.findbar-find-next { - margin-inline-start: 0; - -moz-appearance: none; - background: linear-gradient(rgba(255,255,255,.8) 1px, rgba(255,255,255,.4) 1px, rgba(255,255,255,.1)); - border: 1px solid ThreeDShadow; - padding: 1px 5px; - line-height: 1em; -} +/* highlight button */ -.findbar-find-previous:not([disabled]):active, -.findbar-find-next:not([disabled]):active { - background: rgba(23,50,76,.2); - box-shadow: 0 1px 2px rgba(10,31,51,.2) inset; +.findbar-highlight { + list-style-image: url("chrome://global/skin/icons/find.png"); + -moz-image-region: rect(0px 48px 16px 32px); } -.findbar-find-previous { - list-style-image: url(chrome://global/skin/icons/find-arrows.svg#glyph-find-previous); +.findbar-highlight:hover { + -moz-image-region: rect(16px 48px 32px 32px); } -.findbar-find-next { - list-style-image: url(chrome://global/skin/icons/find-arrows.svg#glyph-find-next); +.findbar-highlight[disabled="true"] { + -moz-image-region: rect(32px 48px 48px 32px) !important; } -.findbar-find-previous, -.findbar-find-previous:not([disabled]):active { - border-right: none; - border-left: none; +.findbar-highlight:active, .findbar-highlight[checked="true"] { + -moz-image-region: rect(48px 48px 64px 32px); } -.findbar-find-previous > .toolbarbutton-icon, -.findbar-find-next > .toolbarbutton-icon { - margin: 0; +.findbar-highlight[checked="true"]:hover { + -moz-image-region: rect(64px 48px 80px 32px); } -.findbar-find-previous[disabled="true"] > .toolbarbutton-icon, -.findbar-find-next[disabled="true"] > .toolbarbutton-icon { - opacity: .5; +.find-status-icon { + list-style-image: none; + margin-top: 2px; + margin-bottom: 0px; + -moz-margin-start: 12px; + -moz-margin-end: 0px; + width: 16px; + height: 16px; } -.findbar-find-next:-moz-locale-dir(ltr) { - border-top-right-radius: 2px; - border-bottom-right-radius: 2px; +.findbar-find-status, +.found-matches { + margin: 0 !important; + -moz-margin-start: 3px !important; + padding: 2px !important; } -.findbar-find-next:-moz-locale-dir(rtl) { - border-top-left-radius: 2px; - border-bottom-left-radius: 2px; +.find-status-icon[status="notfound"] { + list-style-image: url("chrome://global/skin/icons/information-16.png"); } -.findbar-highlight, -.findbar-case-sensitive, -.findbar-entire-word { - margin-inline-start: 5px; +.findbar-textbox[status="notfound"] { + box-shadow: 0 0 0 1em #f66 inset; + color: white; } -.findbar-highlight > .toolbarbutton-icon, -.findbar-case-sensitive > .toolbarbutton-icon, -.findbar-entire-word > .toolbarbutton-icon { - display: none; +.findbar-textbox[flash="true"] { + box-shadow: 0 0 0 1em yellow inset; + color: black; } -.findbar-find-status, -.found-matches { - color: GrayText; - margin: 0 !important; - margin-inline-start: 12px !important; +.find-status-icon[status="wrapped"] { + list-style-image: url("chrome://global/skin/icons/wrap.png"); } .find-status-icon[status="pending"] { - list-style-image: url("chrome://global/skin/icons/loading.png"); -} - -@media (min-resolution: 1.1dppx) { - .find-status-icon[status="pending"] { - width: 16px; - list-style-image: url("chrome://global/skin/icons/loading@2x.png"); - } + list-style-image: url("chrome://global/skin/icons/loading_16.png"); } diff --git a/toolkit/themes/windows/global/icons/find.png b/toolkit/themes/windows/global/icons/find.png Binary files differnew file mode 100644 index 000000000..60d6da97e --- /dev/null +++ b/toolkit/themes/windows/global/icons/find.png diff --git a/toolkit/themes/windows/global/icons/question-32.png b/toolkit/themes/windows/global/icons/question-32.png Binary files differnew file mode 100644 index 000000000..7c80831b0 --- /dev/null +++ b/toolkit/themes/windows/global/icons/question-32.png diff --git a/toolkit/themes/windows/global/icons/question-48.png b/toolkit/themes/windows/global/icons/question-48.png Binary files differnew file mode 100644 index 000000000..dd2b21874 --- /dev/null +++ b/toolkit/themes/windows/global/icons/question-48.png diff --git a/toolkit/themes/windows/global/inContentUI.css b/toolkit/themes/windows/global/inContentUI.css new file mode 100644 index 000000000..a3bca7b06 --- /dev/null +++ b/toolkit/themes/windows/global/inContentUI.css @@ -0,0 +1,159 @@ +/* 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/. */ + +/* + * The default namespace for this file is XUL. Be sure to prefix rules that + * are applicable to both XUL and HTML with '*|'. + */ +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); +@namespace html url("http://www.w3.org/1999/xhtml"); + +/* Page background */ +*|*:root { + -moz-appearance: none; + padding: 18px; + background-repeat: repeat; + color: -moz-dialogText; + background-color: -moz-dialog; + background-image: /* Texture */ + url("chrome://global/skin/inContentUI/background-texture.png"); +} + +html|html { + font: message-box; +} + +@media (-moz-windows-default-theme) and (-moz-os-version: windows-vista), + (-moz-windows-default-theme) and (-moz-os-version: windows-win7) { + *|*:root { + color: #000; + background-color: #CCD9EA; + } +} + +@media (-moz-windows-glass) { + *|*:root { + /* Blame shorlander for this monstrosity. */ + background-image: /* Side gradients */ + linear-gradient(to right, + rgba(255,255,255,0.2), transparent 40%, + transparent 60%, rgba(255,255,255,0.2)), + /* Aero-style light beams */ + -moz-linear-gradient(left 32deg, + /* First light beam */ + transparent 19.5%, rgba(255,255,255,0.1) 20%, + rgba(255,255,255,0.1) 21.5%, rgba(255,255,255,0.2) 22%, + rgba(255,255,255,0.2) 25.5%, rgba(255,255,255,0.1) 26%, + rgba(255,255,255,0.1) 27.5%, transparent 28%, + /* Second light beam */ + transparent 49.5%, rgba(255,255,255,0.1) 50%, + rgba(255,255,255,0.1) 52.5%, rgba(255,255,255,0.2) 53%, + rgba(255,255,255,0.2) 54.5%, rgba(255,255,255,0.1) 55%, + rgba(255,255,255,0.1) 57.5%, transparent 58%, + /* Third light beam */ + transparent 87%, rgba(255,255,255,0.2) 90%), + /* Texture */ + url("chrome://global/skin/inContentUI/background-texture.png"); + } +} + +/* Use the new in-content colors for #contentAreaDownloadsView. After landing + of bug 989469 the colors can be moved to *|*:root */ +*|*#contentAreaDownloadsView { + background: #f1f1f1; + color: #424e5a; +} + +/* Content */ +*|*.main-content { + /* Needed to allow the radius to clip the inner content, see bug 595656 */ + overflow: hidden; + background-color: rgba(255, 255, 255, 0.35); + background-image: linear-gradient(rgba(255, 255, 255, 0), + rgba(255, 255, 255, 0.75)); + border: 1px solid #C3CEDF; +} + +%ifdef XP_WIN +@media (-moz-os-version: windows-vista), + (-moz-os-version: windows-win7) { +%endif + *|*.main-content { + border-radius: 5px; + } +%ifdef XP_WIN +} +%endif + +@media (-moz-windows-glass) { + /* Buttons */ + *|button, + menulist, + colorpicker[type="button"] { + -moz-appearance: none; + color: black; + padding: 0 5px; + background: linear-gradient(rgba(251, 252, 253, 0.95), transparent 49%, + rgba(211, 212, 213, 0.45) 51%, rgba(225, 226, 229, 0.3)); + background-clip: padding-box; + border-radius: 3px; + border: 1px solid rgba(31, 64, 100, 0.4); + border-top-color: rgba(31, 64, 100, 0.3); + box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.25) inset, + 0 0 2px 1px rgba(255, 255, 255, 0.25) inset; + } + + menulist { + -moz-padding-end: 0; + } + + colorpicker[type="button"]:-moz-focusring:not([open="true"]) > .colorpicker-button-colorbox { + outline: 1px dotted ThreeDDarkShadow; + } + + html|button[disabled], + button[disabled="true"], + menulist[disabled="true"], + colorpicker[type="button"][disabled="true"] { + -moz-border-top-colors: rgba(31, 64, 100, 0.3) !important; + -moz-border-right-colors: rgba(31, 64, 100, 0.4) !important; + -moz-border-bottom-colors: rgba(31, 64, 100, 0.4) !important; + -moz-border-left-colors: rgba(31, 64, 100, 0.4) !important; + opacity: 0.8; + color: #505050; + } + + html|button:not([disabled]):active:hover, + button:not([disabled="true"]):active:hover, + menulist[open="true"]:not([disabled="true"]), + colorpicker[type="button"][open="true"]:not([disabled="true"]) { + background-color: rgba(61, 76, 92, 0.2); + border-color: rgba(39, 53, 68, 0.5); + box-shadow: 0 0 3px 1px rgba(39, 53, 68, 0.2) inset; + } + + button > .button-box { + padding: 1px !important; + } + + spinbuttons > .spinbuttons-box > .spinbuttons-button { + border-radius: 0; + padding: 0 4px; + } + + spinbuttons > .spinbuttons-box > .spinbuttons-up { + list-style-image: url("chrome://global/skin/arrow/arrow-up.gif"); + border-bottom-width: 0; + } + + spinbuttons > .spinbuttons-box > .spinbuttons-down { + list-style-image: url("chrome://global/skin/arrow/arrow-dn.gif"); + } +} + +colorpicker[type="button"] { + margin: 1px 5px 2px 5px; + padding: 3px; + height: 25px; +} diff --git a/toolkit/themes/windows/global/jar.mn b/toolkit/themes/windows/global/jar.mn index 7f2f29942..8c5d5de5a 100644 --- a/toolkit/themes/windows/global/jar.mn +++ b/toolkit/themes/windows/global/jar.mn @@ -27,6 +27,7 @@ toolkit.jar: skin/classic/global/console/itemSelected.png (console/itemSelected.png) skin/classic/global/findBar.css * skin/classic/global/global.css +* skin/classic/global/inContentUI.css skin/classic/global/listbox.css skin/classic/global/netError.css skin/classic/global/numberbox.css @@ -48,6 +49,7 @@ toolkit.jar: skin/classic/global/icons/close-win7@2x.png (icons/close-win7@2x.png) skin/classic/global/icons/close-inverted-win7.png (icons/close-inverted-win7.png) skin/classic/global/icons/close-inverted-win7@2x.png (icons/close-inverted-win7@2x.png) + skin/classic/global/icons/find.png (icons/find.png) skin/classic/global/icons/resizer.png (icons/resizer.png) skin/classic/global/icons/sslWarning.png (icons/sslWarning.png) * skin/classic/global/in-content/common.css (in-content/common.css) diff --git a/toolkit/themes/windows/mozapps/jar.mn b/toolkit/themes/windows/mozapps/jar.mn index 29203811f..0d77a4e79 100644 --- a/toolkit/themes/windows/mozapps/jar.mn +++ b/toolkit/themes/windows/mozapps/jar.mn @@ -68,9 +68,13 @@ toolkit.jar: * skin/classic/mozapps/xpinstall/xpinstallConfirm.css (extensions/xpinstallConfirm.css) skin/classic/mozapps/xpinstall/xpinstallItemGeneric.png (extensions/extensionGeneric.png) #endif + skin/classic/mozapps/passwordmgr/key.png (passwordmgr/key.png) + skin/classic/mozapps/passwordmgr/key-16.png (passwordmgr/key-16.png) + skin/classic/mozapps/passwordmgr/key-64.png (passwordmgr/key-64.png) skin/classic/mozapps/plugins/pluginGeneric.png (plugins/pluginGeneric.png) skin/classic/mozapps/plugins/pluginBlocked.png (plugins/pluginBlocked.png) skin/classic/mozapps/plugins/pluginGeneric-16.png (plugins/pluginGeneric-16.png) + skin/classic/mozapps/plugins/pluginGeneric-48.png (plugins/pluginGeneric-48.png) skin/classic/mozapps/profile/profileicon.png (profile/profileicon.png) skin/classic/mozapps/update/updates.css (update/updates.css) skin/classic/mozapps/viewsource/viewsource.css (viewsource/viewsource.css) diff --git a/toolkit/themes/windows/mozapps/passwordmgr/key-16.png b/toolkit/themes/windows/mozapps/passwordmgr/key-16.png Binary files differnew file mode 100644 index 000000000..ac135b847 --- /dev/null +++ b/toolkit/themes/windows/mozapps/passwordmgr/key-16.png diff --git a/toolkit/themes/windows/mozapps/passwordmgr/key-64.png b/toolkit/themes/windows/mozapps/passwordmgr/key-64.png Binary files differnew file mode 100644 index 000000000..0fb69f382 --- /dev/null +++ b/toolkit/themes/windows/mozapps/passwordmgr/key-64.png diff --git a/toolkit/themes/windows/mozapps/passwordmgr/key.png b/toolkit/themes/windows/mozapps/passwordmgr/key.png Binary files differnew file mode 100644 index 000000000..b5e8afefc --- /dev/null +++ b/toolkit/themes/windows/mozapps/passwordmgr/key.png diff --git a/toolkit/themes/windows/mozapps/plugins/pluginGeneric-16.png b/toolkit/themes/windows/mozapps/plugins/pluginGeneric-16.png Binary files differindex 5d796cc4c..080b0e502 100644 --- a/toolkit/themes/windows/mozapps/plugins/pluginGeneric-16.png +++ b/toolkit/themes/windows/mozapps/plugins/pluginGeneric-16.png diff --git a/toolkit/themes/windows/mozapps/plugins/pluginGeneric-48.png b/toolkit/themes/windows/mozapps/plugins/pluginGeneric-48.png Binary files differnew file mode 100644 index 000000000..173679448 --- /dev/null +++ b/toolkit/themes/windows/mozapps/plugins/pluginGeneric-48.png diff --git a/toolkit/themes/windows/mozapps/plugins/pluginGeneric.png b/toolkit/themes/windows/mozapps/plugins/pluginGeneric.png Binary files differindex d8b270ae5..1fcbf154e 100644 --- a/toolkit/themes/windows/mozapps/plugins/pluginGeneric.png +++ b/toolkit/themes/windows/mozapps/plugins/pluginGeneric.png |
