From c74da0b85d23659056299e0d91f3221d2414629d Mon Sep 17 00:00:00 2001 From: Horst3180 Date: Mon, 1 Aug 2016 16:39:25 +0200 Subject: update to 48.0rc2 --- .../chrome/browser/aboutCertError.css | 119 --------- arc-firefox-theme/chrome/browser/aboutNetError.css | 162 +++++------- arc-firefox-theme/chrome/browser/blockedSite.css | 65 +++++ arc-firefox-theme/chrome/browser/browser.css | 231 ++++++++++------- .../chrome/browser/controlcenter/panel.css | 10 +- .../browser/customizableui/panelUIOverlay.css | 79 +++++- arc-firefox-theme/chrome/browser/devedition.css | 16 ++ .../browser/downloads/allDownloadsViewOverlay.css | 66 ++--- .../chrome/browser/downloads/downloads.css | 47 ++-- arc-firefox-theme/chrome/browser/error-pages.css | 76 ++++++ .../chrome/browser/fxa/default-avatar.png | Bin 1386 -> 0 bytes .../chrome/browser/fxa/default-avatar.svg | 8 + .../chrome/browser/fxa/default-avatar@2x.png | Bin 2236 -> 0 bytes .../browser/preferences/in-content/dialog.css | 2 +- .../browser/preferences/in-content/preferences.css | 14 +- .../privatebrowsing/aboutPrivateBrowsing.css | 210 +++++++++++++++ .../chrome/browser/privatebrowsing/attention.png | Bin 602 -> 0 bytes .../browser/privatebrowsing/attention@2x.png | Bin 902 -> 0 bytes .../chrome/browser/privatebrowsing/check.png | Bin 338 -> 0 bytes .../chrome/browser/privatebrowsing/check.svg | 8 + .../chrome/browser/privatebrowsing/check@2x.png | Bin 370 -> 0 bytes .../chrome/browser/privatebrowsing/favicon.svg | 11 + .../chrome/browser/privatebrowsing/mask.svg | 8 - .../browser/privatebrowsing/private-browsing.svg | 12 + .../chrome/browser/privatebrowsing/shield-page.png | Bin 4257 -> 0 bytes .../browser/privatebrowsing/shield-page@2x.png | Bin 9367 -> 0 bytes .../privatebrowsing/tracking-protection-off.svg | 15 ++ .../privatebrowsing/tracking-protection.svg | 12 + .../chrome/browser/sass/_browser-sass.scss | 281 +++++++++++++-------- .../chrome/browser/sass/browser-dark.css | 231 ++++++++++------- .../chrome/browser/sass/browser-darker.css | 231 ++++++++++------- .../chrome/browser/sass/browser-light.css | 231 ++++++++++------- arc-firefox-theme/chrome/browser/searchbar.css | 5 +- arc-firefox-theme/chrome/browser/syncCommon.css | 2 +- arc-firefox-theme/chrome/browser/syncSetup.css | 8 +- .../chrome/browser/syncedtabs/sidebar.css | 41 ++- .../chrome/browser/tabbrowser/loading.png | Bin 13906 -> 0 bytes .../chrome/browser/tabbrowser/newtab-inverted.svg | 13 + .../chrome/browser/tabbrowser/newtab.svg | 7 + .../chrome/browser/tabbrowser/tab-selected-end.svg | 4 - .../browser/tabbrowser/tab-selected-start.svg | 4 - arc-firefox-theme/chrome/browser/urlbar-star.svg | 20 ++ arc-firefox-theme/chrome/browser/urlbar-tab.svg | 21 ++ .../chrome/browser/web-notifications-icon.svg | 13 +- .../chrome/browser/web-notifications-tray.svg | 12 +- arc-firefox-theme/chrome/global/aboutSupport.css | 6 + arc-firefox-theme/chrome/global/autocomplete.css | 117 ++++----- arc-firefox-theme/chrome/global/findBar.css | 2 +- arc-firefox-theme/chrome/global/icons/blocked.svg | 13 + arc-firefox-theme/chrome/global/icons/loading.png | Bin 0 -> 13906 bytes .../chrome/global/icons/loading_16.png | Bin 16126 -> 0 bytes .../chrome/global/icons/webapps-16.png | Bin 475 -> 0 bytes .../chrome/global/icons/webapps-64.png | Bin 2942 -> 0 bytes .../chrome/global/in-content/common.css | 6 +- arc-firefox-theme/chrome/global/passwordmgr.css | 13 + arc-firefox-theme/chrome/global/scrollbars.css | 1 - .../chrome/mozapps/extensions/extensions.css | 39 ++- .../chrome/mozapps/extensions/update.css | 8 +- .../mozapps/places/defaultFavicon-inverted.png | Bin 0 -> 839 bytes .../mozapps/places/defaultFavicon-inverted@2x.png | Bin 0 -> 1531 bytes .../chrome/mozapps/plugins/pluginProblem.css | 9 +- .../chrome/mozapps/update/updates.css | 2 +- 62 files changed, 1616 insertions(+), 895 deletions(-) delete mode 100644 arc-firefox-theme/chrome/browser/aboutCertError.css create mode 100644 arc-firefox-theme/chrome/browser/blockedSite.css create mode 100644 arc-firefox-theme/chrome/browser/error-pages.css delete mode 100644 arc-firefox-theme/chrome/browser/fxa/default-avatar.png create mode 100644 arc-firefox-theme/chrome/browser/fxa/default-avatar.svg delete mode 100644 arc-firefox-theme/chrome/browser/fxa/default-avatar@2x.png create mode 100644 arc-firefox-theme/chrome/browser/privatebrowsing/aboutPrivateBrowsing.css delete mode 100755 arc-firefox-theme/chrome/browser/privatebrowsing/attention.png delete mode 100755 arc-firefox-theme/chrome/browser/privatebrowsing/attention@2x.png delete mode 100755 arc-firefox-theme/chrome/browser/privatebrowsing/check.png create mode 100644 arc-firefox-theme/chrome/browser/privatebrowsing/check.svg delete mode 100755 arc-firefox-theme/chrome/browser/privatebrowsing/check@2x.png create mode 100644 arc-firefox-theme/chrome/browser/privatebrowsing/favicon.svg delete mode 100755 arc-firefox-theme/chrome/browser/privatebrowsing/mask.svg create mode 100644 arc-firefox-theme/chrome/browser/privatebrowsing/private-browsing.svg delete mode 100755 arc-firefox-theme/chrome/browser/privatebrowsing/shield-page.png delete mode 100755 arc-firefox-theme/chrome/browser/privatebrowsing/shield-page@2x.png create mode 100644 arc-firefox-theme/chrome/browser/privatebrowsing/tracking-protection-off.svg create mode 100644 arc-firefox-theme/chrome/browser/privatebrowsing/tracking-protection.svg delete mode 100644 arc-firefox-theme/chrome/browser/tabbrowser/loading.png create mode 100644 arc-firefox-theme/chrome/browser/tabbrowser/newtab-inverted.svg create mode 100644 arc-firefox-theme/chrome/browser/tabbrowser/newtab.svg create mode 100644 arc-firefox-theme/chrome/browser/urlbar-star.svg create mode 100644 arc-firefox-theme/chrome/browser/urlbar-tab.svg create mode 100644 arc-firefox-theme/chrome/global/icons/blocked.svg create mode 100644 arc-firefox-theme/chrome/global/icons/loading.png delete mode 100644 arc-firefox-theme/chrome/global/icons/loading_16.png delete mode 100644 arc-firefox-theme/chrome/global/icons/webapps-16.png delete mode 100644 arc-firefox-theme/chrome/global/icons/webapps-64.png create mode 100644 arc-firefox-theme/chrome/mozapps/places/defaultFavicon-inverted.png create mode 100644 arc-firefox-theme/chrome/mozapps/places/defaultFavicon-inverted@2x.png (limited to 'arc-firefox-theme/chrome') diff --git a/arc-firefox-theme/chrome/browser/aboutCertError.css b/arc-firefox-theme/chrome/browser/aboutCertError.css deleted file mode 100644 index a109609..0000000 --- a/arc-firefox-theme/chrome/browser/aboutCertError.css +++ /dev/null @@ -1,119 +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/. */ - -@import url("chrome://global/skin/in-content/common.css"); - -body { - display: flex; - box-sizing: border-box; - min-height: 100vh; - padding: 0 48px; - align-items: center; - justify-content: center; -} - -#errorPageContainer { - position: relative; - min-width: 320px; - max-width: 512px; -} - -#errorTitle { - background: url("chrome://browser/skin/cert-error.svg") left 0 no-repeat; - background-size: 3em; - margin-inline-start: -5em; - padding-inline-start: 5em; -} - -#errorTitle:-moz-dir(rtl) { - background-position: right 0; -} - -#errorTitleText { - border-bottom: 1px solid #C1C1C1; - padding-bottom: 0.4em; -} - -@media (max-width: 675px) { - #errorTitle { - padding-top: 0; - background-image: none; - margin-inline-start: 0; - padding-inline-start: 0; - } -} - -#buttonContainer { - display: flex; - flex-flow: row wrap; -} - -#buttonSpacer { - flex: 1; -} - -#certificateErrorDebugInformation { - display: none; - background-color: var(--in-content-box-background-hover) !important; - border-top: 1px solid var(--in-content-border-color); - position: absolute; - left: 0%; - top: 100%; - width: 65%; - padding: 1em 17.5%; -} - -#certificateErrorText { - font-family: monospace; - white-space: pre-wrap; - padding: 1em 0; -} - -#errorCode { - white-space: nowrap; -} - -#returnButton { - background-color: var(--in-content-primary-button-background); - border: none; - color: var(--in-content-selected-text); - min-width: 250px; - margin-inline-start: 0; -} - -#returnButton:hover { - background-color: var(--in-content-primary-button-background-hover) !important; -} - -#returnButton:hover:active { - background-color: var(--in-content-primary-button-background-active) !important; -} - -#advancedButton { - min-width: 150px; -} - -/* Advanced section is hidden via inline styles until the link is clicked */ -#advancedPanel { - background-color: white; - color: var(--in-content-text-color); - border: 1px lightgray solid; - /* Don't use top padding because the default p style has top padding, and it - * makes the overall div look uneven */ - padding: 0 12px 10px; - margin-top: 10px; - box-shadow: 0 0 4px #ddd; - font-size: 0.9em; -} - -.hostname { - font-weight: bold; -} - -#reportCertificateErrorRetry, -#certificateErrorReporting, -#reportSendingMessage, -#reportSentMessage { - display: none; -} diff --git a/arc-firefox-theme/chrome/browser/aboutNetError.css b/arc-firefox-theme/chrome/browser/aboutNetError.css index 8c4a34f..627c69e 100644 --- a/arc-firefox-theme/chrome/browser/aboutNetError.css +++ b/arc-firefox-theme/chrome/browser/aboutNetError.css @@ -2,84 +2,28 @@ * 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/. */ -@import url("chrome://global/skin/in-content/common.css"); +@import url("chrome://browser/skin/error-pages.css"); body { - display: flex; - box-sizing: border-box; - min-height: 100vh; - padding: 0 48px; - align-items: center; - justify-content: center; -} - -ul, ol { - margin: 0; - padding: 0; - -moz-margin-start: 1em; -} - -ul > li, ol > li { - margin-bottom: .5em; -} - -ul { - list-style: disc; -} - -#errorPageContainer { - position: relative; - min-width: 320px; - max-width: 512px; -} - -#advancedPanelContainer { - position: absolute; - padding-bottom: 24px; - width: 100%; -} - -#errorTitle { - background: url("chrome://global/skin/icons/info.svg") left 0 no-repeat; - background-size: 3em; - -moz-margin-start: -5em; - -moz-padding-start: 5em; + background-image: linear-gradient(-45deg, #eeeeee, #eeeeee 33%, + #fbfbfb 33%, #fbfbfb 66%, + #eeeeee 66%, #eeeeee); } -#errorTitleText { - border-bottom: 1px solid #C1C1C1; - padding-bottom: 0.4em; +body.certerror { + background-image: linear-gradient(-45deg, #f0d000, #f0d000 33%, + #fedc00 33%, #fedc00 66%, + #f0d000 66%, #f0d000); } -#errorTitleText:-moz-dir(rtl) { - background-position: right 0; -} - -#errorTitle[sslv3=true], -#errorTitle[weakCrypto=true] { +body.certerror .title { background-image: url("cert-error.svg"); } -#errorTryAgain { - margin-top: 1.2em; - min-width: 150px -} - #errorContainer { display: none; } -@media (max-width: 675px) { - #errorTitle, - #errorTitle[sslv3=true], - #errorTitle[weakCrypto=true] { - padding-top: 0; - background-image: none; - -moz-padding-start: 0; - -moz-margin-start: 0; - } -} - /* Pressing the retry button will cause the cursor to flicker from a pointer to * not-allowed. Override the disabled cursor behaviour since we will never show * the button disabled as the initial state. */ @@ -91,66 +35,50 @@ button:disabled { display: none; } -#buttonContainer { +#certErrorButtonContainer { display: none; - flex-flow: row wrap; } -#buttonSpacer { - flex: 1; +body.certerror #certErrorButtonContainer { + display: flex; } -#returnButton { - background-color: var(--in-content-primary-button-background); - border: none; - color: var(--in-content-selected-text); - min-width: 250px; - margin-inline-start: 0; +body.certerror #netErrorButtonContainer { + display: none; } -#returnButton:hover { - background-color: var(--in-content-primary-button-background-hover) !important; +#errorTryAgain { + margin-top: 1.2em; + min-width: 150px; } -#returnButton:hover:active { - background-color: var(--in-content-primary-button-background-active) !important; +#returnButton { + min-width: 250px; } #advancedButton { display: none; - min-width: 150px; } -#certificateErrorReporting, -#reportSentMessage { - display: none; +body.certerror #advancedButton { + display: block; } -div#weakCryptoAdvanced { +#certificateErrorReporting { display: none; - float: right; - /* Align with the "Try Again" button */ - margin-top: 24px; - -moz-margin-end: 24px; -} - -div#weakCryptoAdvanced a { - text-decoration: none; } -div#weakCryptoAdvanced a:hover { - text-decoration: underline; +.container { + position: relative; } -span.downArrow { - display: inline-block; - vertical-align: middle; - font-size: 0.6em; - -moz-margin-start: 0.5em; - transform: scaleY(0.7); +#advancedPanelContainer { + position: absolute; + padding: 24px 0; + width: 100%; } -div#weakCryptoAdvancedPanel { +.advanced-panel { /* Hidden until the link is clicked */ display: none; background-color: white; @@ -180,8 +108,38 @@ span#hostname { cursor: pointer; } -#errorCode { +#errorCode:not([href]) { color: var(--in-content-page-color); cursor: text; text-decoration: none; } + +#errorCode[href] { + white-space: nowrap; +} + +#badCertTechnicalInfo { + overflow: auto; + white-space: pre-wrap; +} + +#certificateErrorReporting { + display: none; +} + +#certificateErrorDebugInformation { + display: none; + background-color: var(--in-content-box-background-hover) !important; + border-top: 1px solid var(--in-content-border-color); + position: absolute; + left: 0%; + top: 100%; + width: 65%; + padding: 1em 17.5%; +} + +#certificateErrorText { + font-family: monospace; + white-space: pre-wrap; + padding: 1em 0; +} diff --git a/arc-firefox-theme/chrome/browser/blockedSite.css b/arc-firefox-theme/chrome/browser/blockedSite.css new file mode 100644 index 0000000..49846ee --- /dev/null +++ b/arc-firefox-theme/chrome/browser/blockedSite.css @@ -0,0 +1,65 @@ +/* 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/. */ + +@import url("chrome://browser/skin/error-pages.css"); + +body { + background-image: linear-gradient(-45deg, #9b2e2e, #9b2e2e 33%, + #a83232 33%, #a83232 66%, + #9b2e2e 66%, #9b2e2e); + background-color: #b14646; + color: white; +} + +.title { + background-image: url("chrome://global/skin/icons/blocked.svg"); +} + +.title-text { + color: white; +} + +.button-container button:not(.primary) { + background-color: transparent; + color: white; + border: 1px solid #9b2e2e; + margin-inline-end: 0; +} + +.button-container button:not(.primary):hover { + background-color: #a83232; +} + +.button-container button:not(.primary):active { + background-color: #9b2e2e; +} + +.button-container button { + margin-top: 1.2em; +} + +/* Style warning button to look like a small text link in the + bottom right. This is preferable to just using a text link + since there is already a mechanism in browser.js for trapping + oncommand events from unprivileged chrome pages (BrowserOnCommand).*/ +#ignoreWarningButton { + -moz-appearance: none; + background: transparent; + border: none; + color: white; + text-decoration: underline; + margin: 4px 0 0 0; + padding: 0; + font-size: smaller; + min-width: 0; +} + +#ignoreWarningButton:hover { + cursor: pointer; +} + +#ignoreWarning { + margin-top: 1.2em; + text-align: end; +} diff --git a/arc-firefox-theme/chrome/browser/browser.css b/arc-firefox-theme/chrome/browser/browser.css index 3ef2f72..b332f67 100644 --- a/arc-firefox-theme/chrome/browser/browser.css +++ b/arc-firefox-theme/chrome/browser/browser.css @@ -476,8 +476,8 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { :-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1 > :-moz-any(.toolbarbutton-menubutton-button, .toolbarbutton-badge-stack) > .toolbarbutton-icon { max-width: 16px; } -:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button) > .toolbarbutton-icon, -:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button) > :-moz-any(.toolbarbutton-menubutton-button, .toolbarbutton-badge-stack) > .toolbarbutton-icon, +:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon) > .toolbarbutton-icon, +:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon) > :-moz-any(.toolbarbutton-menubutton-button, .toolbarbutton-badge-stack) > .toolbarbutton-icon, #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon { max-width: 18px; } @@ -502,9 +502,9 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { transition-property: background-color, border-color; transition-duration: 150ms; } -:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button)) > .toolbarbutton-icon, -:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button)) > .toolbarbutton-badge-stack, -:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button)) > .toolbarbutton-menubutton-button > .toolbarbutton-icon { +:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon)) > .toolbarbutton-icon, +:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon)) > .toolbarbutton-badge-stack, +:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon)) > .toolbarbutton-menubutton-button > .toolbarbutton-icon { padding: 3px 7px; } :-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1 > .toolbarbutton-icon, @@ -1132,6 +1132,7 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { #minimize-button:active { list-style-image: url("chrome://browser/skin/custom_images/light/window-controls/minimize_pressed.svg"); } +/* Location bar */ #urlbar, .searchbar-textbox { -moz-appearance: none; @@ -1196,7 +1197,7 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { #urlbar-search-settings { -moz-appearance: none; -moz-user-focus: ignore; - color: inherit; + color: GrayText; margin: 0; border: 0; padding: 8px 20px; @@ -1306,8 +1307,11 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { #urlbar[pageproxystate="valid"] > #identity-box.chromeUI { color: var(--identity-box-chrome-color); } -#identity-icon-labels { - padding-inline-start: 2px; } +#identity-icon-labels:-moz-locale-dir(ltr) { + padding-left: 2px; } + +#identity-icon-labels:-moz-locale-dir(rtl) { + padding-right: 2px; } #notification-popup-box:not([hidden]) + #identity-box { padding-inline-start: 5px; @@ -1440,10 +1444,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box .popup-notification-icon[popupid="password"] { list-style-image: url(chrome://mozapps/skin/passwordmgr/key-64.png); } -.popup-notification-icon[popupid="webapps-install-progress"], -.popup-notification-icon[popupid="webapps-install"] { - list-style-image: url(chrome://global/skin/icons/webapps-64.png); } - .popup-notification-icon[popupid="webRTC-sharingDevices"], .popup-notification-icon[popupid="webRTC-shareDevices"] { list-style-image: url(chrome://browser/skin/webRTC-shareDevice-64.png); } @@ -1511,10 +1511,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box list-style-image: url(chrome://mozapps/skin/passwordmgr/key-16.png); transform: scaleX(-1); } -.webapps-notification-icon, -#webapps-notification-icon { - list-style-image: url(chrome://global/skin/icons/webapps-16.png); } - #plugins-notification-icon { list-style-image: url(chrome://browser/skin/notification-pluginNormal.png); } @@ -1815,55 +1811,94 @@ notification[value="translation"] menulist > .menulist-dropmarker { #treecolAutoCompleteImage { max-width: 36px; } -.ac-result-type-bookmark, +#PopupAutoCompleteRichResult { + /* The awesomebar popup should open just below the navbar bottom border. */ + margin-top: 1px; } + +.autocomplete-richlistbox { + padding: 4px; } + +.autocomplete-richlistitem { + height: 30px; + min-height: 30px; + font: message-box; + border-radius: 2px; + border: 1px solid transparent; } + +.autocomplete-richlistitem[selected=true] { + background-color: Highlight; } + +.ac-title { + font-size: 14px; } + +.ac-tags { + font-size: 12px; } + +html|span.ac-tag { + background-color: MenuText; + color: Menu; + border-radius: 2px; + border: 1px solid transparent; + padding: 0 1px; } + +.ac-separator, +.ac-url, +.ac-action { + font-size: 12px; + color: -moz-nativehyperlinktext; } + +.ac-title[selected=true], +.ac-separator[selected], +.ac-url[selected=true], +.ac-action[selected=true] { + color: inherit !important; } + +.ac-tags-text[selected] > html|span.ac-tag { + background-color: HighlightText; + color: Highlight; } + +html|span.ac-emphasize-text-title, +html|span.ac-emphasize-text-tag, +html|span.ac-emphasize-text-url { + font-weight: 600; } + +.ac-type-icon[type=bookmark] { + list-style-image: url("chrome://browser/skin/urlbar-star.svg#star"); } + +.ac-type-icon[type=bookmark][selected][current] { + list-style-image: url("chrome://browser/skin/urlbar-star.svg#star-inverted"); } + .autocomplete-treebody::-moz-tree-image(bookmark, treecolAutoCompleteImage) { list-style-image: url("chrome://browser/skin/places/autocomplete-star.png"); width: 16px; height: 16px; } -.ac-result-type-keyword, -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage), -richlistitem[type~="action"][actiontype="searchengine"] > .ac-title-box > .ac-site-icon { - list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon); - width: 16px; - height: 16px; } +.ac-type-icon[type=keyword], +.ac-site-icon[type=searchengine], +.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) { + list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon); } -.ac-result-type-keyword[selected="true"], -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage, selected), -richlistitem[type~="action"][actiontype="searchengine"][selected="true"] > .ac-title-box > .ac-site-icon { +.ac-type-icon[type=keyword][selected], +.ac-site-icon[type=searchengine][selected], +.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage, selected) { list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon-inverted); } -.ac-result-type-tag, .autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) { list-style-image: url("chrome://browser/skin/places/tag.png"); width: 16px; height: 16px; } -.ac-comment, -#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > description, -#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > button { - font-size: 1.05em; } - -.ac-extra > .ac-comment { - font-size: inherit; } - -.ac-url-text, -.ac-action-text { - color: -moz-nativehyperlinktext; - font-size: 0.9em; } +.ac-type-icon[type=switchtab], +.ac-type-icon[type=remotetab] { + list-style-image: url("chrome://browser/skin/urlbar-tab.svg#tab"); } -richlistitem[type~="action"][actiontype$="tab"] > .ac-url-box > .ac-action-icon { - list-style-image: url("chrome://browser/skin/actionicon-tab.png"); - padding: 0 3px; } +.ac-type-icon[type=switchtab][selected], +.ac-type-icon[type=remotetab][selected] { + list-style-image: url("chrome://browser/skin/urlbar-tab.svg#tab-inverted"); } .autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) { color: GrayText; } -.ac-comment[selected="true"], -.ac-url-text[selected="true"], -.ac-action-text[selected="true"] { - color: inherit !important; } - .autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment), .autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment) { color: GrayText; @@ -2063,25 +2098,6 @@ richlistitem[type~="action"][actiontype$="tab"] > .ac-url-box > .ac-action-icon #editBMPanel_folderTree { min-width: 27em; } -.panel-promo-box { - margin: 8px -10px -10px -10px; - padding: 8px 10px; - border-top: 1px solid ThreeDShadow; - background-image: linear-gradient(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.08) 6px); } - -.panel-promo-icon { - list-style-image: url("chrome://browser/skin/sync-notification-24.png"); - -moz-margin-end: 10px; - vertical-align: middle; } - -.panel-promo-closebutton { - -moz-appearance: none; - height: 16px; - width: 16px; } - -.panel-promo-closebutton > .toolbarbutton-text { - padding: 0; } - /* Content area */ #sidebar { background-color: Window; } @@ -2621,7 +2637,7 @@ lwtHeader;*/ font-weight: bold; } .alltabs-item[busy] > .menu-iconic-left > .menu-iconic-icon { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); } + list-style-image: url("chrome://global/skin/icons/loading.png"); } .alltabs-item[tabIsVisible] { /* box-shadow instead of background-color to work around native styling */ @@ -2641,7 +2657,7 @@ menuitem:hover > hbox > .alltabs-endimage[soundplaying] { /* Sidebar */ #sidebar-throbber[loading="true"] { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); + list-style-image: url("chrome://global/skin/icons/loading.png"); -moz-margin-end: 4px; } toolbarbutton.chevron { @@ -2813,7 +2829,7 @@ html|*#fullscreen-exit-button { color: #fff; border: 1px solid #111; border-radius: 2px; - padding: 5px; + padding: 0 5px; width: 200px; margin: 0; } @@ -2921,15 +2937,12 @@ html|*#fullscreen-exit-button { margin-left: 0; } .devtools-responsiveui-close { - list-style-image: url("chrome://devtools/skin/images/close.png"); } + list-style-image: url("chrome://devtools/skin/images/close.svg"); } .devtools-responsiveui-rotate { list-style-image: url("chrome://devtools/skin/images/responsivemode/responsiveui-rotate.png"); } @media (min-resolution: 1.1dppx) { - .devtools-responsiveui-close { - list-style-image: url("chrome://devtools/skin/images/close@2x.png"); } - .devtools-responsiveui-rotate { list-style-image: url("chrome://devtools/skin/images/responsivemode/responsiveui-rotate@2x.png"); } } .devtools-responsiveui-touch { @@ -3396,7 +3409,7 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton:not(:h min-width: 18px; min-height: 18px; } -#TabsToolbar #downloads-button[cui-areatype="toolbar"] > #downloads-indicator-anchor > #downloads-indicator-icon { +#TabsToolbar #downloads-button[cui-areatype="toolbar"]:not([attention="success"]) > #downloads-indicator-anchor > #downloads-indicator-icon { background: -moz-image-rect(url("chrome://browser/skin/custom_images/light/tabbar-icons.svg"), 0, 198, 18, 180) center no-repeat; } #downloads-button[cui-areatype="toolbar"]:not([disabled=true]):-moz-any([open], [checked], :hover:active) > #downloads-indicator-anchor > #downloads-indicator-icon, @@ -3404,12 +3417,32 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton:not(:h #nav-bar #downloads-button[cui-areatype="toolbar"]:not([disabled=true]):-moz-any([open], [checked], :hover:active) > #downloads-indicator-anchor > #downloads-indicator-icon { background: -moz-image-rect(url("chrome://browser/skin/custom_images/toolbar-icons-active.svg"), 0, 198, 18, 180) center no-repeat; } -#downloads-button[cui-areatype="toolbar"][attention] > #downloads-indicator-anchor > #downloads-indicator-icon, -#nav-bar #downloads-button[cui-areatype="toolbar"][attention] > #downloads-indicator-anchor > #downloads-indicator-icon, -#TabsToolbar #downloads-button[cui-areatype="toolbar"][attention] > #downloads-indicator-anchor > #downloads-indicator-icon { +#downloads-button[cui-areatype="toolbar"][attention="warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, +#downloads-button[cui-areatype="toolbar"][attention="severe"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { + display: -moz-box; + height: 13px; + width: 13px; + background-size: contain; + border: none; + box-shadow: none; + filter: drop-shadow(0 1px 0 rgba(13, 27, 38, 0.15)); } + +#downloads-button[cui-areatype="toolbar"][attention="severe"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { + background: #D90000 url(chrome://browser/skin/update-badge-failed.svg) no-repeat center; } + +#downloads-button[cui-areatype="toolbar"][attention="warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { + background: #FFBF00 url(chrome://browser/skin/update-badge-failed.svg) no-repeat center; } + +#downloads-button[cui-areatype="toolbar"][attention="severe"] > .toolbarbutton-badge-stack > .toolbarbutton-badge:-moz-window-inactive, +#downloads-button[cui-areatype="toolbar"][attention="warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge:-moz-window-inactive { + filter: none; } + +#downloads-button[cui-areatype="toolbar"][attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon, +#nav-bar #downloads-button[cui-areatype="toolbar"][attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon, +#TabsToolbar #downloads-button[cui-areatype="toolbar"][attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon { background-image: -moz-image-rect(url("chrome://browser/skin/custom_images/light/toolbar-icons.svg"), 18, 198, 36, 180); } -#downloads-button[cui-areatype="menu-panel"][attention] { +#downloads-button[cui-areatype="menu-panel"][attention="success"] { list-style-image: url("chrome://browser/skin/downloads/download-glow-menuPanel.png"); -moz-image-region: auto; } @@ -3419,7 +3452,7 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton:not(:h background: -moz-image-rect(url("chrome://browser/skin/Toolbar-small.png"), 0, 16, 16, 0) center no-repeat; background-size: 12px; } -#downloads-button:not([counter])[attention] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { +#downloads-button:not([counter])[attention="success"] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { background-image: -moz-image-rect(url("chrome://browser/skin/custom_images/light/toolbar-icons.svg"), 18, 198, 36, 180); } /*** Download notifications ***/ @@ -3595,7 +3628,7 @@ toolbar[brighttext] #downloads-indicator-counter { display: none; } #social-sidebar-button[loading="true"] { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); } + list-style-image: url("chrome://global/skin/icons/loading.png"); } #social-sidebar-favico { max-height: 16px; @@ -3973,6 +4006,13 @@ toolbarpaletteitem[place="toolbar"] { #customization-palette:not([hidden]) { margin-bottom: 25px; } +toolbarpaletteitem[place="palette"]:-moz-focusring, +toolbarpaletteitem[place="panel"]:-moz-focusring, +toolbarpaletteitem[place="toolbar"]:-moz-focusring { + outline: 1px dotted rgba(0, 0, 0, 0.5); + outline-offset: -5px; + -moz-outline-radius: 2.5px; } + #wrapper-edit-controls[place="palette"] > #edit-controls > toolbarbutton, #wrapper-edit-controls[place="palette"] > #edit-controls > separator, #wrapper-zoom-controls[place="palette"] > #zoom-controls > toolbarbutton, @@ -4225,19 +4265,16 @@ toolbarpaletteitem[place="toolbar"] { min-width: 32px; } #UITourTooltipBody { - -moz-margin-end: 14px; } - -#UITourTooltipBody > vbox { - padding-top: 4px; } + -moz-box-align: start; } -#UITourTooltipIconContainer { - -moz-margin-start: -16px; } +#UITourtooltipTitleContainer { + -moz-box-align: start; + margin-bottom: 10px; } #UITourTooltipIcon { width: 48px; height: 48px; - -moz-margin-start: 28px; - -moz-margin-end: 28px; } + -moz-margin-end: 10px; } #UITourTooltipTitle, #UITourTooltipDescription { @@ -4246,9 +4283,7 @@ toolbarpaletteitem[place="toolbar"] { #UITourTooltipTitle { font-size: 1.45rem; font-weight: bold; - -moz-margin-start: 0; - -moz-margin-end: 0; - margin: 0 0 9px 0; } + margin: 0; } #UITourTooltipDescription { -moz-margin-start: 0; @@ -4259,6 +4294,7 @@ toolbarpaletteitem[place="toolbar"] { /* Override global.css */ } #UITourTooltipClose { + position: relative; -moz-appearance: none; border: none; background-color: transparent; @@ -4273,8 +4309,8 @@ toolbarpaletteitem[place="toolbar"] { -moz-box-pack: end; background-color: rgba(24, 26, 27, 0.07); border-top: 1px solid rgba(24, 26, 27, 0.14); - margin: 24px -16px -16px; - padding: 2em 15px; } + margin: 10px -16px -16px; + padding: 16px; } #UITourTooltipButtons > label, #UITourTooltipButtons > button { @@ -4284,6 +4320,10 @@ toolbarpaletteitem[place="toolbar"] { #UITourTooltipButtons > button:first-child { -moz-margin-start: 0; } +#UITourTooltipButtons > label:last-child, +#UITourTooltipButtons > button:last-child { + margin-inline-end: 0; } + #UITourTooltipButtons > button[image] > .button-box > .button-icon { width: 16px; height: 16px; @@ -4446,7 +4486,12 @@ notification.heartbeat { height: 16px; width: 16px; } +/** + * Override the --panel-arrowcontent-padding so the background extends + * to the sides and bottom of the panel. + */ #UITourTooltipButtons { + margin-left: -10px; margin-bottom: -10px; } #context-navigation > .menuitem-iconic { diff --git a/arc-firefox-theme/chrome/browser/controlcenter/panel.css b/arc-firefox-theme/chrome/browser/controlcenter/panel.css index 499da56..6972df3 100644 --- a/arc-firefox-theme/chrome/browser/controlcenter/panel.css +++ b/arc-firefox-theme/chrome/browser/controlcenter/panel.css @@ -102,6 +102,7 @@ #identity-popup-permissions-content, #tracking-protection-content { padding: 0.5em 0 1em; + /* .identity-popup-headline.host depends on this width */ -moz-padding-start: calc(2em + 24px); -moz-padding-end: 1em; } @@ -119,7 +120,7 @@ margin: 0; padding: 4px 0; min-width: auto; - width: 38px; + width: var(--identity-popup-expander-width); border: 0 none; -moz-appearance: none; background-image: url("chrome://browser/skin/controlcenter/arrow-subview.svg"), @@ -180,6 +181,13 @@ font-size: 150%; } +.identity-popup-headline.host { + word-wrap: break-word; + /* 1em + 2em + 24px is #identity-popup-security-content padding + * 30em is .panel-mainview:not([panelid="PanelUI-popup"]) width */ + max-width: calc(30rem - 3rem - 24px - var(--identity-popup-expander-width)) +} + .identity-popup-warning-gray { -moz-padding-start: 24px; background: url(chrome://browser/skin/controlcenter/warning-gray.svg) no-repeat 0 50%; diff --git a/arc-firefox-theme/chrome/browser/customizableui/panelUIOverlay.css b/arc-firefox-theme/chrome/browser/customizableui/panelUIOverlay.css index eb91c9b..689ccaa 100644 --- a/arc-firefox-theme/chrome/browser/customizableui/panelUIOverlay.css +++ b/arc-firefox-theme/chrome/browser/customizableui/panelUIOverlay.css @@ -98,23 +98,37 @@ border: none; } +#PanelUI-menu-button[badge-status="download-success"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { + display: none; +} + #PanelUI-menu-button[badge-status="update-succeeded"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { background: #74BF43 url(chrome://browser/skin/update-badge.svg) no-repeat center; height: 13px; } +#PanelUI-menu-button[badge-status="download-severe"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, #PanelUI-menu-button[badge-status="update-failed"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { background: #D90000 url(chrome://browser/skin/update-badge-failed.svg) no-repeat center; height: 13px; } +#PanelUI-menu-button[badge-status="download-warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, #PanelUI-menu-button[badge-status="fxa-needs-authentication"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { - background: transparent url(chrome://browser/skin/warning.svg) no-repeat center; height: 13px; box-shadow: none; filter: drop-shadow(0 1px 0 hsla(206, 50%, 10%, .15)); } +#PanelUI-menu-button[badge-status="download-warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { + background: #FFBF00 url(chrome://browser/skin/update-badge-failed.svg) no-repeat center; +} + +#PanelUI-menu-button[badge-status="fxa-needs-authentication"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { + background: transparent url(chrome://browser/skin/warning.svg) no-repeat center; +} + +#PanelUI-menu-button[badge-status="download-warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge:-moz-window-inactive, #PanelUI-menu-button[badge-status="fxa-needs-authentication"] > .toolbarbutton-badge-stack > .toolbarbutton-badge:-moz-window-inactive { filter: none; } @@ -247,6 +261,14 @@ panelmultiview[nosubviews=true] > .panel-viewcontainer > .panel-viewstack > .pan max-width: 800px; } +.cui-widget-panel[viewId^=PanelUI-webext-] > .panel-arrowcontainer > .panel-arrowcontent { + padding: 0; +} + +.cui-widget-panelview[id^=PanelUI-webext-] { + border-radius: 3.5px; +} + panelview:not([mainview]) .toolbarbutton-text, .cui-widget-panel toolbarbutton > .toolbarbutton-text { text-align: start; @@ -659,8 +681,16 @@ toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton { list-style-image: url(chrome://browser/skin/sync-horizontalbar.png); } +#PanelUI-remotetabs { + --panel-ui-sync-illustration-height: 157.5px; +} + +.PanelUI-remotetabs-instruction-title, .PanelUI-remotetabs-instruction-label, #PanelUI-remotetabs-mobile-promo { + /* If you change the margin here, the min-height of the synced tabs panel + (e.g. #PanelUI-remotetabs[mainview] #PanelUI-remotetabs-setupsync, etc) may + need adjusting (see bug 1248506) */ margin: 15px; text-align: center; text-shadow: none; @@ -668,9 +698,16 @@ toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton { color: GrayText; } +.PanelUI-remotetabs-instruction-title { + font-size: 1.3em; +} + /* The boxes with "instructions" get extra top and bottom padding for space around the illustration and buttons */ .PanelUI-remotetabs-instruction-box { + /* If you change the padding here, the min-height of the synced tabs panel + (e.g. #PanelUI-remotetabs[mainview] #PanelUI-remotetabs-setupsync, etc) may + need adjusting (see bug 1248506) */ padding-bottom: 30px; padding-top: 15px; } @@ -682,6 +719,9 @@ toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton { is used for buttons in the toolbox overrides. See bug 1238531 for details */ color: white !important; border-radius: 2px; + /* If you change the margin or padding below, the min-height of the synced tabs + panel (e.g. #PanelUI-remotetabs[mainview] #PanelUI-remotetabs-setupsync, + etc) may need adjusting (see bug 1248506) */ margin-top: 10px; margin-bottom: 10px; padding: 8px; @@ -705,7 +745,7 @@ toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton { } .fxaSyncIllustration { - width: 180px; + height: var(--panel-ui-sync-illustration-height); list-style-image: url(chrome://browser/skin/fxa/sync-illustration.svg); } @@ -726,7 +766,12 @@ toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton { #PanelUI-remotetabs[mainview] #PanelUI-remotetabs-reauthsync, #PanelUI-remotetabs[mainview] #PanelUI-remotetabs-nodevicespane, #PanelUI-remotetabs[mainview] #PanelUI-remotetabs-tabsdisabledpane { - min-height: 33em; + min-height: calc(var(--panel-ui-sync-illustration-height) + + 20px + /* margin of .PanelUI-remotetabs-prefs-button */ + 16px + /* padding of .PanelUI-remotetabs-prefs-button */ + 30px + /* margin of .PanelUI-remotetabs-instruction-label */ + 30px + 15px + /* padding of .PanelUI-remotetabs-instruction-box */ + 11em); } #PanelUI-remotetabs-tabslist > label[itemtype="client"] { @@ -741,6 +786,10 @@ toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton { visibility: collapse; } +#PanelUI-remotetabs-main[devices-status="single"] > #PanelUI-remotetabs-buttons { + display: none; +} + #PanelUI-fxa-icon[syncstatus="active"] { list-style-image: url(chrome://browser/skin/syncProgress-horizontalbar.png); } @@ -809,7 +858,7 @@ toolbarpaletteitem[place="palette"] > toolbaritem > toolbarbutton { } #PanelUI-footer-fxa[fxaprofileimage="enabled"] > #PanelUI-fxa-status > #PanelUI-fxa-avatar { - list-style-image: url(chrome://browser/skin/fxa/default-avatar.png) + list-style-image: url(chrome://browser/skin/fxa/default-avatar.svg); } #PanelUI-customize:hover, @@ -1014,7 +1063,8 @@ panelview .toolbarbutton-1, } panelview .toolbarbutton-1, -.widget-overflow-list .toolbarbutton-1 { +.widget-overflow-list .toolbarbutton-1:not(:first-child), +.widget-overflow-list .toolbaritem-combined-buttons:not(:first-child) { margin-top: 6px; } @@ -1110,7 +1160,8 @@ menuitem.panel-subview-footer:not([disabled])[_moz-menuactive]:active, .cui-widget-panelview menuseparator { -moz-appearance: none; min-height: 0; - border-top: 1px solid hsla(210,4%,10%,.15); + border-top: 1px solid var(--panel-separator-color); + border-bottom: none; margin: 6px 0; padding: 0; } @@ -1299,7 +1350,7 @@ toolbarpaletteitem[haswideitem][place="panel"] + toolbarpaletteitem[haswideitem] margin: .5em 0; width: 1px; height: auto; - background: hsla(210,4%,10%,.15); + background: var(--panel-separator-color); transition-property: margin; transition-duration: 10ms; transition-timing-function: ease; @@ -1598,10 +1649,6 @@ menuitem[checked="true"].subviewbutton > .menu-iconic-left { list-style-image: url(chrome://branding/content/icon32.png); } - #PanelUI-footer-fxa[fxaprofileimage="enabled"] > #PanelUI-fxa-status > #PanelUI-fxa-avatar { - list-style-image: url(chrome://browser/skin/fxa/default-avatar@2x.png) - } - #PanelUI-fxa-label, #PanelUI-fxa-icon { list-style-image: url(chrome://browser/skin/sync-horizontalbar@2x.png); @@ -1699,13 +1746,17 @@ menuitem[checked="true"].subviewbutton > .menu-iconic-left { -moz-appearance: none !important; /* important, to override toolkit rule */ } -#BMB_bookmarksPopup menupopup[placespopup=true] { +#BMB_bookmarksPopup menupopup { + -moz-appearance: none; + background: var(--panel-arrowcontent-background); + color: var(--panel-arrowcontent-color); + border: var(--panel-arrowcontent-border); margin-top: -6px; - padding-top: 2px; + padding-top: 1px; } /* Add some space at the top because there are no headers: */ -#BMB_bookmarksPopup menupopup[placespopup=true] > hbox > .popup-internal-box > .arrowscrollbox-scrollbox > .scrollbox-innerbox { +#BMB_bookmarksPopup menupopup > hbox > .popup-internal-box > .arrowscrollbox-scrollbox > .scrollbox-innerbox { padding-top: 4px; } diff --git a/arc-firefox-theme/chrome/browser/devedition.css b/arc-firefox-theme/chrome/browser/devedition.css index 6596a11..cd107a2 100644 --- a/arc-firefox-theme/chrome/browser/devedition.css +++ b/arc-firefox-theme/chrome/browser/devedition.css @@ -309,6 +309,17 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper { --forwardbutton-width: 29px; } +:root[devtoolstheme="light"] { + --urlbar-dropmarker-url: url("chrome://browser/skin/devedition/urlbar-history-dropmarker.svg"); + --urlbar-dropmarker-region: rect(0px, 11px, 14px, 0px); + --urlbar-dropmarker-hover-region: rect(0, 22px, 14px, 11px); + --urlbar-dropmarker-active-region: rect(0px, 33px, 14px, 22px); + --urlbar-dropmarker-2x-url: url("chrome://browser/skin/devedition/urlbar-history-dropmarker.svg"); + --urlbar-dropmarker-2x-region: rect(0px, 11px, 14px, 0px); + --urlbar-dropmarker-hover-2x-region: rect(0, 22px, 14px, 11px); + --urlbar-dropmarker-active-2x-region: rect(0px, 33px, 14px, 22px); +} + :root[devtoolstheme="dark"] .findbar-closebutton:not(:hover), :root[devtoolstheme="dark"] #sidebar-header > .close-icon:not(:hover), .tab-close-button[visuallyselected]:not(:hover) { @@ -389,3 +400,8 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper { text-shadow: none; } +.ac-type-icon { + /* Left-align the type icon in awesomebar popup results with the icon in the + urlbar. */ + -moz-margin-start: 11px; +} diff --git a/arc-firefox-theme/chrome/browser/downloads/allDownloadsViewOverlay.css b/arc-firefox-theme/chrome/browser/downloads/allDownloadsViewOverlay.css index 9935e0f..f7acb5f 100644 --- a/arc-firefox-theme/chrome/browser/downloads/allDownloadsViewOverlay.css +++ b/arc-firefox-theme/chrome/browser/downloads/allDownloadsViewOverlay.css @@ -66,90 +66,90 @@ } .blockedIcon { - list-style-image: url("moz-icon://stock/gtk-dialog-error?size=dialog"); + list-style-image: url("moz-icon://stock/gtk-dialog-error?size=32"); +} + +richlistitem.download[verdict="PotentiallyUnwanted"] .blockedIcon { + list-style-image: url("moz-icon://stock/gtk-dialog-warning?size=32"); +} + +richlistitem.download[verdict="Uncommon"] .blockedIcon { + list-style-image: url("moz-icon://stock/gtk-dialog-info?size=32"); } /*** Button icons ***/ -.downloadButton.downloadConfirmBlock, -.downloadButton.downloadCancel { +.downloadButton.downloadIconCancel { -moz-image-region: rect(0px, 16px, 16px, 0px); } -richlistitem.download:hover .downloadButton.downloadConfirmBlock, -richlistitem.download:hover .downloadButton.downloadCancel { +richlistitem.download:hover .downloadButton.downloadIconCancel { -moz-image-region: rect(0px, 32px, 16px, 16px); } -richlistitem.download:hover .downloadButton.downloadConfirmBlock:hover, -richlistitem.download:hover .downloadButton.downloadCancel:hover { +richlistitem.download:hover .downloadButton.downloadIconCancel:hover { -moz-image-region: rect(0px, 48px, 16px, 32px); } -richlistitem.download:hover .downloadButton.downloadConfirmBlock:active, -richlistitem.download:hover .downloadButton.downloadCancel:active { +richlistitem.download:hover .downloadButton.downloadIconCancel:active { -moz-image-region: rect(0px, 64px, 16px, 48px); } -richlistitem.download[selected] .downloadButton.downloadConfirmBlock, -richlistitem.download[selected] .downloadButton.downloadCancel { +richlistitem.download[selected] .downloadButton.downloadIconCancel { -moz-image-region: rect(0px, 80px, 16px, 64px); } -richlistitem.download[selected]:hover .downloadButton.downloadConfirmBlock, -richlistitem.download[selected]:hover .downloadButton.downloadCancel { +richlistitem.download[selected]:hover .downloadButton.downloadIconCancel { -moz-image-region: rect(0px, 96px, 16px, 80px); } -richlistitem.download[selected]:hover .downloadButton.downloadConfirmBlock:hover, -richlistitem.download[selected]:hover .downloadButton.downloadCancel:hover { +richlistitem.download[selected]:hover .downloadButton.downloadIconCancel:hover { -moz-image-region: rect(0px, 112px, 16px, 96px); } -richlistitem.download[selected]:hover .downloadButton.downloadConfirmBlock:active, -richlistitem.download[selected]:hover .downloadButton.downloadCancel:active { +richlistitem.download[selected]:hover .downloadButton.downloadIconCancel:active { -moz-image-region: rect(0px, 128px, 16px, 112px); } -.downloadButton.downloadShow { +.downloadButton.downloadIconShow { -moz-image-region: rect(16px, 16px, 32px, 0px); } -richlistitem.download:hover .downloadButton.downloadShow { +richlistitem.download:hover .downloadButton.downloadIconShow { -moz-image-region: rect(16px, 32px, 32px, 16px); } -richlistitem.download:hover .downloadButton.downloadShow:hover { +richlistitem.download:hover .downloadButton.downloadIconShow:hover { -moz-image-region: rect(16px, 48px, 32px, 32px); } -richlistitem.download:hover .downloadButton.downloadShow:active { +richlistitem.download:hover .downloadButton.downloadIconShow:active { -moz-image-region: rect(16px, 64px, 32px, 48px); } -richlistitem.download[selected] .downloadButton.downloadShow { +richlistitem.download[selected] .downloadButton.downloadIconShow { -moz-image-region: rect(16px, 80px, 32px, 64px); } -richlistitem.download[selected]:hover .downloadButton.downloadShow { +richlistitem.download[selected]:hover .downloadButton.downloadIconShow { -moz-image-region: rect(16px, 96px, 32px, 80px); } -richlistitem.download[selected]:hover .downloadButton.downloadShow:hover { +richlistitem.download[selected]:hover .downloadButton.downloadIconShow:hover { -moz-image-region: rect(16px, 112px, 32px, 96px); } -richlistitem.download[selected]:hover .downloadButton.downloadShow:active { +richlistitem.download[selected]:hover .downloadButton.downloadIconShow:active { -moz-image-region: rect(16px, 128px, 32px, 112px); } -.downloadButton.downloadRetry { +.downloadButton.downloadIconRetry { -moz-image-region: rect(32px, 16px, 48px, 0px); } -richlistitem.download:hover .downloadButton.downloadRetry { +richlistitem.download:hover .downloadButton.downloadIconRetry { -moz-image-region: rect(32px, 32px, 48px, 16px); } -richlistitem.download:hover .downloadButton.downloadRetry:hover { +richlistitem.download:hover .downloadButton.downloadIconRetry:hover { -moz-image-region: rect(32px, 48px, 48px, 32px); } -richlistitem.download:hover .downloadButton.downloadRetry:active { +richlistitem.download:hover .downloadButton.downloadIconRetry:active { -moz-image-region: rect(32px, 64px, 48px, 48px); } -richlistitem.download[selected] .downloadButton.downloadRetry { +richlistitem.download[selected] .downloadButton.downloadIconRetry { -moz-image-region: rect(32px, 80px, 48px, 64px); } -richlistitem.download[selected]:hover .downloadButton.downloadRetry { +richlistitem.download[selected]:hover .downloadButton.downloadIconRetry { -moz-image-region: rect(32px, 96px, 48px, 80px); } -richlistitem.download[selected]:hover .downloadButton.downloadRetry:hover { +richlistitem.download[selected]:hover .downloadButton.downloadIconRetry:hover { -moz-image-region: rect(32px, 112px, 48px, 96px); } -richlistitem.download[selected]:hover .downloadButton.downloadRetry:active { +richlistitem.download[selected]:hover .downloadButton.downloadIconRetry:active { -moz-image-region: rect(32px, 128px, 48px, 112px); } diff --git a/arc-firefox-theme/chrome/browser/downloads/downloads.css b/arc-firefox-theme/chrome/browser/downloads/downloads.css index 487d8f4..f30d2c7 100644 --- a/arc-firefox-theme/chrome/browser/downloads/downloads.css +++ b/arc-firefox-theme/chrome/browser/downloads/downloads.css @@ -177,7 +177,15 @@ richlistitem[type="download"]:last-child { } .blockedIcon { - list-style-image: url("moz-icon://stock/gtk-dialog-error?size=dialog"); + list-style-image: url("moz-icon://stock/gtk-dialog-error?size=32"); +} + +richlistitem[type="download"][verdict="PotentiallyUnwanted"] .blockedIcon { + list-style-image: url("moz-icon://stock/gtk-dialog-warning?size=32"); +} + +richlistitem[type="download"][verdict="Uncommon"] .blockedIcon { + list-style-image: url("moz-icon://stock/gtk-dialog-info?size=32"); } .downloadButton:focus > .button-box { @@ -203,45 +211,50 @@ richlistitem[type="download"]:last-child { /*** Button icons ***/ -.downloadButton.downloadConfirmBlock, -.downloadButton.downloadCancel { +.downloadButton.downloadIconCancel { -moz-image-region: rect(0px, 16px, 16px, 0px); } -richlistitem[type="download"]:hover .downloadButton.downloadConfirmBlock, -richlistitem[type="download"]:hover .downloadButton.downloadCancel { +richlistitem[type="download"]:hover .downloadButton.downloadIconCancel { -moz-image-region: rect(0px, 32px, 16px, 16px); } -richlistitem[type="download"]:hover .downloadButton.downloadConfirmBlock:hover, -richlistitem[type="download"]:hover .downloadButton.downloadCancel:hover { +richlistitem[type="download"]:hover .downloadButton.downloadIconCancel:hover { -moz-image-region: rect(0px, 48px, 16px, 32px); } -richlistitem[type="download"]:hover .downloadButton.downloadConfirmBlock:active, -richlistitem[type="download"]:hover .downloadButton.downloadCancel:active { +richlistitem[type="download"]:hover .downloadButton.downloadIconCancel:active { -moz-image-region: rect(0px, 64px, 16px, 48px); } -.downloadButton.downloadShow { +.downloadButton.downloadIconShow { -moz-image-region: rect(16px, 16px, 32px, 0px); } -#downloadsPanel:not([keyfocus]) richlistitem[type="download"][state="1"]:hover .downloadButton.downloadShow { +richlistitem[type="download"]:not([state="1"]):hover .downloadButton.downloadIconShow { + -moz-image-region: rect(16px, 32px, 32px, 16px); +} +richlistitem[type="download"]:not([state="1"]):hover .downloadButton.downloadIconShow:hover { + -moz-image-region: rect(16px, 48px, 32px, 32px); +} +richlistitem[type="download"]:not([state="1"]):hover .downloadButton.downloadIconShow:active { + -moz-image-region: rect(16px, 64px, 32px, 48px); +} +#downloadsPanel:not([keyfocus]) richlistitem[type="download"][state="1"]:hover .downloadButton.downloadIconShow { -moz-image-region: rect(16px, 96px, 32px, 80px); } -#downloadsPanel:not([keyfocus]) richlistitem[type="download"][state="1"]:hover .downloadButton.downloadShow:hover { +#downloadsPanel:not([keyfocus]) richlistitem[type="download"][state="1"]:hover .downloadButton.downloadIconShow:hover { -moz-image-region: rect(16px, 112px, 32px, 96px); } -#downloadsPanel:not([keyfocus]) richlistitem[type="download"][state="1"]:hover .downloadButton.downloadShow:active { +#downloadsPanel:not([keyfocus]) richlistitem[type="download"][state="1"]:hover .downloadButton.downloadIconShow:active { -moz-image-region: rect(16px, 128px, 32px, 112px); } -.downloadButton.downloadRetry { +.downloadButton.downloadIconRetry { -moz-image-region: rect(32px, 16px, 48px, 0px); } -richlistitem[type="download"]:hover .downloadButton.downloadRetry { +richlistitem[type="download"]:hover .downloadButton.downloadIconRetry { -moz-image-region: rect(32px, 32px, 48px, 16px); } -richlistitem[type="download"]:hover .downloadButton.downloadRetry:hover { +richlistitem[type="download"]:hover .downloadButton.downloadIconRetry:hover { -moz-image-region: rect(32px, 48px, 48px, 32px); } -richlistitem[type="download"]:hover .downloadButton.downloadRetry:active { +richlistitem[type="download"]:hover .downloadButton.downloadIconRetry:active { -moz-image-region: rect(32px, 64px, 48px, 48px); } diff --git a/arc-firefox-theme/chrome/browser/error-pages.css b/arc-firefox-theme/chrome/browser/error-pages.css new file mode 100644 index 0000000..ac9edac --- /dev/null +++ b/arc-firefox-theme/chrome/browser/error-pages.css @@ -0,0 +1,76 @@ +/* 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/. */ + +@import url("chrome://global/skin/in-content/info-pages.css"); + +body { + background-size: 64px 32px; + background-repeat: repeat-x; + /* Top padding for when the window height is small. + Bottom padding to keep everything centered. */ + padding: 75px 0; +} + +.button-container { + display: flex; + flex-flow: row wrap; +} + +.button-spacer { + flex: 1; +} + +@media only screen and (max-width: 959px) { + body { + padding: 75px 48px; + } + + .title { + background-image: none !important; + -moz-padding-start: 0; + -moz-margin-start: 0; + } + + .title-text { + padding-top: 0; + } +} + +@media only screen and (max-width: 640px) { + body { + justify-content: unset; + /* Now that everything is top-aligned, we don't need the + * bottom padding for centering - though it's added back + * when the viewport height is < 480px (see below). */ + padding: 75px 20px 0; + } + + .title-text { + padding-bottom: 0; + border-bottom: none; + } +} + +@media only screen and (max-width: 480px) { + .button-container button { + /* Force buttons to display: block here to try and enforce collapsing margins */ + display: block; + width: 100%; + margin: 0.66em 0 0; + } +} + +/* For small window height, shift the stripes up by 10px. + * We could just change the background size, but that changes + * the angle of the stripes so just shifting up is easier. */ +@media only screen and (max-height: 480px) { + body { + background-position: 10px -10px; + padding-top: 38px; + /* We get rid of bottom padding for width < 640px, but + * for height < 480px a bit of space between the content + * and the viewport edge is nice. */ + padding-bottom: 38px; + } +} \ No newline at end of file diff --git a/arc-firefox-theme/chrome/browser/fxa/default-avatar.png b/arc-firefox-theme/chrome/browser/fxa/default-avatar.png deleted file mode 100644 index 8faca35..0000000 Binary files a/arc-firefox-theme/chrome/browser/fxa/default-avatar.png and /dev/null differ diff --git a/arc-firefox-theme/chrome/browser/fxa/default-avatar.svg b/arc-firefox-theme/chrome/browser/fxa/default-avatar.svg new file mode 100644 index 0000000..5402349 --- /dev/null +++ b/arc-firefox-theme/chrome/browser/fxa/default-avatar.svg @@ -0,0 +1,8 @@ + + + + + + diff --git a/arc-firefox-theme/chrome/browser/fxa/default-avatar@2x.png b/arc-firefox-theme/chrome/browser/fxa/default-avatar@2x.png deleted file mode 100644 index 1428e23..0000000 Binary files a/arc-firefox-theme/chrome/browser/fxa/default-avatar@2x.png and /dev/null differ diff --git a/arc-firefox-theme/chrome/browser/preferences/in-content/dialog.css b/arc-firefox-theme/chrome/browser/preferences/in-content/dialog.css index 9bf0d03..aa59e64 100644 --- a/arc-firefox-theme/chrome/browser/preferences/in-content/dialog.css +++ b/arc-firefox-theme/chrome/browser/preferences/in-content/dialog.css @@ -66,7 +66,7 @@ groupbox description { margin-left: 0; } -label, +label:not(.menu-text), textbox, description, .tab-text, diff --git a/arc-firefox-theme/chrome/browser/preferences/in-content/preferences.css b/arc-firefox-theme/chrome/browser/preferences/in-content/preferences.css index dbedc83..b193768 100644 --- a/arc-firefox-theme/chrome/browser/preferences/in-content/preferences.css +++ b/arc-firefox-theme/chrome/browser/preferences/in-content/preferences.css @@ -379,8 +379,13 @@ description > html|a { #fxaProfileImage { max-width: 60px; border-radius: 50%; - list-style-image: url(chrome://browser/skin/fxa/default-avatar.png); + list-style-image: url(chrome://browser/skin/fxa/default-avatar.svg); margin-inline-end: 15px; + image-rendering: -moz-crisp-edges; +} + +#fxaLoginStatus[hasName] #fxaProfileImage { + max-width: 80px; } #fxaProfileImage.actionable { @@ -549,6 +554,10 @@ description > html|a { list-style-image: url(chrome://browser/skin/fxa/sync-illustration.png) } +#fxaLoginStatus[hasName] #fxaEmailAddress1 { + font-size: 1.1rem; +} + #fxaEmailAddress1, #fxaEmailAddress2, #fxaEmailAddress3 { @@ -612,9 +621,6 @@ description > html|a { .fxaFirefoxLogo { list-style-image: url(chrome://browser/skin/fxa/logo@2x.png); } - #fxaProfileImage { - list-style-image: url(chrome://browser/skin/fxa/default-avatar@2x.png); - } } .treecol-sortdirection { diff --git a/arc-firefox-theme/chrome/browser/privatebrowsing/aboutPrivateBrowsing.css b/arc-firefox-theme/chrome/browser/privatebrowsing/aboutPrivateBrowsing.css new file mode 100644 index 0000000..abc85fa --- /dev/null +++ b/arc-firefox-theme/chrome/browser/privatebrowsing/aboutPrivateBrowsing.css @@ -0,0 +1,210 @@ +/* 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/. */ + +@import url("chrome://global/skin/in-content/info-pages.css"); + +:root { + --color-grey-lightest: #fbfbfb; + --color-grey: #b1b1b1; + + --color-blue: #0996f8; + --color-blue-dark: #0670cc; + --color-blue-darker: #005bab; + + --icon-margin: 64px; +} + +html.private { + --in-content-page-color: #beb8cc; + --in-content-text-color: #beb8cc; + --in-content-page-background: #1c023c; +} + +body { + padding: 40px; +} + +a:link { + color: var(--color-blue); + text-decoration: none; +} + +a:hover { + color: var(--color-blue-dark); + text-decoration: underline; +} + +a:hover:active { + color: var(--color-blue-darker); +} + +a:visited { + color: var(--color-blue-darker); +} + +.about-content-container { + max-width: 780px; +} + +.section-main { + margin-bottom: 48px; + -moz-margin-start: var(--icon-margin); + -moz-padding-start: 24px; +} + +.section-main:last-child { + margin-bottom: 0; +} + +p { + line-height: 1.5em; +} + +.list-row { + overflow: auto; +} + +.list-row > ul > li { + float: left; + width: 220px; + line-height: 1.5em; + -moz-margin-start: 1em; + margin-bottom: 0; +} + +.list-row > ul > li:-moz-dir(rtl) { + float: right; +} + +.title { + background-image: url("chrome://browser/skin/privatebrowsing/private-browsing.svg"); + background-size: 64px; + background-position: left, center; + font-weight: lighter; + line-height: 1.5em; + min-height: 64px; + -moz-margin-start: 0; + -moz-padding-start: calc(var(--icon-margin) + 24px); +} + +.title:-moz-dir(rtl) { + background-position: right, center; +} + +.about-subheader { + display: flex; + align-items: center; + font-size: 1.5em; + font-weight: lighter; + min-height: 32px; + background-image: url("chrome://browser/skin/privatebrowsing/tracking-protection.svg"); + background-repeat: no-repeat; + background-size: 32px; + -moz-margin-start: calc(var(--icon-margin) - 32px); + -moz-padding-start: 56px; +} + +.about-subheader:-moz-dir(rtl) { + background-position: right; +} + +.about-subheader.tp-off { + background-image: url("chrome://browser/skin/privatebrowsing/tracking-protection-off.svg"); +} + +.about-info { + font-size: .875em; +} + +.tpTitle { + margin-inline-end: 12px; +} + +.private strong { + color: var(--color-grey-lightest); + font-weight: normal; +} + +a.button { + padding: 5px 40px; + background-color: #381e59; + border: 1px solid #43256a; + border-radius: 4px; + text-decoration: none; + display: inline-block; +} + +.toggle + .toggle-btn { + box-sizing: border-box; + cursor: pointer; + min-width: 60px; + height: 24px; + border-radius: 12px; + background-color: var(--color-grey); + border: 1px var(--color-grey) solid; + padding: 2px; +} + +.toggle + .toggle-btn::after, +.toggle + .toggle-btn::before { + position: relative; + display: block; + content: ""; + width: 19px; + height: 100%; +} + +.toggle + .toggle-btn::after { + left: 0; + box-shadow: 0 0 1px 1px hsla(0, 0%, 0%, .1), + 0 1px 0 hsla(0, 0%, 0%, .2); + border-radius: 50%; + background: white; + transition: left .2s ease; +} + +.toggle + .toggle-btn::before { + float: left; + left: 9px; + visibility: hidden; + background-size: 16px; + background-repeat: no-repeat; + background-color: transparent; + background-image: url("chrome://browser/skin/privatebrowsing/check.svg"); +} + +.toggle + .toggle-btn:-moz-dir(rtl)::after { + left: auto; + right: 0; + transition-property: right; +} + +.toggle + .toggle-btn:-moz-dir(rtl)::before { + float: right; + left: auto; + right: 9px; +} + +.toggle:checked + .toggle-btn { + background: #3fc455; + border: 1px solid #269939; +} + +.toggle:checked + .toggle-btn::after { + left: 35px; +} + +.toggle:checked + .toggle-btn:-moz-dir(rtl)::after { + right: 35px; +} + +.toggle:checked + .toggle-btn::before { + visibility: visible; +} + +.toggle:-moz-focusring + .toggle-btn { + outline: 2px solid rgba(0, 149, 221, 0.5); + outline-offset: 1px; + -moz-outline-radius: 2px; +} diff --git a/arc-firefox-theme/chrome/browser/privatebrowsing/attention.png b/arc-firefox-theme/chrome/browser/privatebrowsing/attention.png deleted file mode 100755 index 8706928..0000000 Binary files a/arc-firefox-theme/chrome/browser/privatebrowsing/attention.png and /dev/null differ diff --git a/arc-firefox-theme/chrome/browser/privatebrowsing/attention@2x.png b/arc-firefox-theme/chrome/browser/privatebrowsing/attention@2x.png deleted file mode 100755 index 5b32888..0000000 Binary files a/arc-firefox-theme/chrome/browser/privatebrowsing/attention@2x.png and /dev/null differ diff --git a/arc-firefox-theme/chrome/browser/privatebrowsing/check.png b/arc-firefox-theme/chrome/browser/privatebrowsing/check.png deleted file mode 100755 index 59ca51b..0000000 Binary files a/arc-firefox-theme/chrome/browser/privatebrowsing/check.png and /dev/null differ diff --git a/arc-firefox-theme/chrome/browser/privatebrowsing/check.svg b/arc-firefox-theme/chrome/browser/privatebrowsing/check.svg new file mode 100644 index 0000000..a8e4bcc --- /dev/null +++ b/arc-firefox-theme/chrome/browser/privatebrowsing/check.svg @@ -0,0 +1,8 @@ + + + + + + diff --git a/arc-firefox-theme/chrome/browser/privatebrowsing/check@2x.png b/arc-firefox-theme/chrome/browser/privatebrowsing/check@2x.png deleted file mode 100755 index 031685c..0000000 Binary files a/arc-firefox-theme/chrome/browser/privatebrowsing/check@2x.png and /dev/null differ diff --git a/arc-firefox-theme/chrome/browser/privatebrowsing/favicon.svg b/arc-firefox-theme/chrome/browser/privatebrowsing/favicon.svg new file mode 100644 index 0000000..6de9c64 --- /dev/null +++ b/arc-firefox-theme/chrome/browser/privatebrowsing/favicon.svg @@ -0,0 +1,11 @@ + + + + + + + + + diff --git a/arc-firefox-theme/chrome/browser/privatebrowsing/mask.svg b/arc-firefox-theme/chrome/browser/privatebrowsing/mask.svg deleted file mode 100755 index 655445e..0000000 --- a/arc-firefox-theme/chrome/browser/privatebrowsing/mask.svg +++ /dev/null @@ -1,8 +0,0 @@ - - - - - diff --git a/arc-firefox-theme/chrome/browser/privatebrowsing/private-browsing.svg b/arc-firefox-theme/chrome/browser/privatebrowsing/private-browsing.svg new file mode 100644 index 0000000..cc37bc4 --- /dev/null +++ b/arc-firefox-theme/chrome/browser/privatebrowsing/private-browsing.svg @@ -0,0 +1,12 @@ + + + + + + + + + + diff --git a/arc-firefox-theme/chrome/browser/privatebrowsing/shield-page.png b/arc-firefox-theme/chrome/browser/privatebrowsing/shield-page.png deleted file mode 100755 index 2ddcf34..0000000 Binary files a/arc-firefox-theme/chrome/browser/privatebrowsing/shield-page.png and /dev/null differ diff --git a/arc-firefox-theme/chrome/browser/privatebrowsing/shield-page@2x.png b/arc-firefox-theme/chrome/browser/privatebrowsing/shield-page@2x.png deleted file mode 100755 index 72a0b82..0000000 Binary files a/arc-firefox-theme/chrome/browser/privatebrowsing/shield-page@2x.png and /dev/null differ diff --git a/arc-firefox-theme/chrome/browser/privatebrowsing/tracking-protection-off.svg b/arc-firefox-theme/chrome/browser/privatebrowsing/tracking-protection-off.svg new file mode 100644 index 0000000..7da0ca7 --- /dev/null +++ b/arc-firefox-theme/chrome/browser/privatebrowsing/tracking-protection-off.svg @@ -0,0 +1,15 @@ + + + + + + + + + + diff --git a/arc-firefox-theme/chrome/browser/privatebrowsing/tracking-protection.svg b/arc-firefox-theme/chrome/browser/privatebrowsing/tracking-protection.svg new file mode 100644 index 0000000..d22fe7d --- /dev/null +++ b/arc-firefox-theme/chrome/browser/privatebrowsing/tracking-protection.svg @@ -0,0 +1,12 @@ + + + + + + diff --git a/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss b/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss index 8e6bd9a..dd77b4b 100644 --- a/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss +++ b/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss @@ -602,8 +602,8 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { max-width: 16px; } -:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button) > .toolbarbutton-icon, -:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button) > :-moz-any(.toolbarbutton-menubutton-button, .toolbarbutton-badge-stack) > .toolbarbutton-icon, +:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon) > .toolbarbutton-icon, +:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon) > :-moz-any(.toolbarbutton-menubutton-button, .toolbarbutton-badge-stack) > .toolbarbutton-icon, #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon { max-width: 18px; } @@ -632,9 +632,9 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { transition-duration: 150ms; } -:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button)) > .toolbarbutton-icon, -:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button)) > .toolbarbutton-badge-stack, -:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button)) > .toolbarbutton-menubutton-button > .toolbarbutton-icon { +:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon)) > .toolbarbutton-icon, +:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon)) > .toolbarbutton-badge-stack, +:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon)) > .toolbarbutton-menubutton-button > .toolbarbutton-icon { padding: 3px 7px; } @@ -1492,6 +1492,15 @@ list-style-image: url("chrome://browser/skin/custom_images/toolbar-icons-active. &:active { list-style-image: url("chrome://browser/skin/custom_images/#{$darker_asset_path_2}/window-controls/minimize_pressed.svg"); } } +/* Location bar */ +//#nav-bar { +// --urlbar-border-color: ThreeDShadow; +//} + +//#nav-bar:-moz-lwtheme { +// --urlbar-border-color: rgba(0,0,0,.3); +//} + #urlbar, .searchbar-textbox { -moz-appearance: none; @@ -1598,7 +1607,7 @@ list-style-image: url("chrome://browser/skin/custom_images/toolbar-icons-active. #urlbar-search-settings { -moz-appearance: none; -moz-user-focus: ignore; - color: inherit; + color: GrayText; margin: 0; border: 0; padding: 8px 20px; @@ -1719,7 +1728,8 @@ list-style-image: url("chrome://browser/skin/custom_images/toolbar-icons-active. #identity-box { -// --identity-box-selected-background-color: rgb(231,230,230); + //--identity-box-hover-background-color: rgb(231,230,230); + //--identity-box-selected-background-color: rgb(211,210,210); --identity-box-verified-color: hsl(92,100%,30%); --identity-box-chrome-color: rgb(229,115,0); @@ -1760,8 +1770,12 @@ list-style-image: url("chrome://browser/skin/custom_images/toolbar-icons-active. color: var(--identity-box-chrome-color); } -#identity-icon-labels { - padding-inline-start: 2px; +#identity-icon-labels:-moz-locale-dir(ltr) { + padding-left: 2px; +} + +#identity-icon-labels:-moz-locale-dir(rtl) { + padding-right: 2px; } #notification-popup-box:not([hidden]) + #identity-box { @@ -1946,11 +1960,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box list-style-image: url(chrome://mozapps/skin/passwordmgr/key-64.png); } -.popup-notification-icon[popupid="webapps-install-progress"], -.popup-notification-icon[popupid="webapps-install"] { - list-style-image: url(chrome://global/skin/icons/webapps-64.png); -} - .popup-notification-icon[popupid="webRTC-sharingDevices"], .popup-notification-icon[popupid="webRTC-shareDevices"] { list-style-image: url(chrome://browser/skin/webRTC-shareDevice-64.png); @@ -2041,11 +2050,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box transform: scaleX(-1); } -.webapps-notification-icon, -#webapps-notification-icon { - list-style-image: url(chrome://global/skin/icons/webapps-16.png); -} - #plugins-notification-icon { list-style-image: url(chrome://browser/skin/notification-pluginNormal.png); } @@ -2430,65 +2434,114 @@ notification[value="translation"] menulist > .menulist-dropmarker { max-width : 36px; } -.ac-result-type-bookmark, +#PopupAutoCompleteRichResult { + /* The awesomebar popup should open just below the navbar bottom border. */ + margin-top: 1px; +} + +.autocomplete-richlistbox { + padding: 4px; +} + +.autocomplete-richlistitem { + height: 30px; + min-height: 30px; + font: message-box; + border-radius: 2px; + border: 1px solid transparent; +} + +.autocomplete-richlistitem[selected=true] { + background-color: Highlight; +} + +.ac-title { + font-size: 14px; +} + +.ac-tags { + font-size: 12px; +} + +html|span.ac-tag { + background-color: MenuText; + color: Menu; + border-radius: 2px; + border: 1px solid transparent; + padding: 0 1px; +} + +.ac-separator, +.ac-url, +.ac-action { + font-size: 12px; + color: -moz-nativehyperlinktext; +} + +.ac-title[selected=true], +.ac-separator[selected], +.ac-url[selected=true], +.ac-action[selected=true] { + color: inherit !important; +} + +.ac-tags-text[selected] > html|span.ac-tag { + background-color: HighlightText; + color: Highlight; +} + +html|span.ac-emphasize-text-title, +html|span.ac-emphasize-text-tag, +html|span.ac-emphasize-text-url { + font-weight: 600; +} + +.ac-type-icon[type=bookmark] { + list-style-image: url("chrome://browser/skin/urlbar-star.svg#star"); +} + +.ac-type-icon[type=bookmark][selected][current] { + list-style-image: url("chrome://browser/skin/urlbar-star.svg#star-inverted"); +} + .autocomplete-treebody::-moz-tree-image(bookmark, treecolAutoCompleteImage) { list-style-image: url("chrome://browser/skin/places/autocomplete-star.png"); width: 16px; height: 16px; } -.ac-result-type-keyword, -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage), -richlistitem[type~="action"][actiontype="searchengine"] > .ac-title-box > .ac-site-icon { +.ac-type-icon[type=keyword], +.ac-site-icon[type=searchengine], +.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) { list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon); - width: 16px; - height: 16px; } -.ac-result-type-keyword[selected="true"], -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage, selected), -richlistitem[type~="action"][actiontype="searchengine"][selected="true"] > .ac-title-box > .ac-site-icon { +.ac-type-icon[type=keyword][selected], +.ac-site-icon[type=searchengine][selected], +.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage, selected) { list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon-inverted); } -.ac-result-type-tag, .autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) { list-style-image: url("chrome://browser/skin/places/tag.png"); width: 16px; height: 16px; } -.ac-comment, -#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > description, -#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > button { - font-size: 1.05em; +.ac-type-icon[type=switchtab], +.ac-type-icon[type=remotetab] { + list-style-image: url("chrome://browser/skin/urlbar-tab.svg#tab"); } -.ac-extra > .ac-comment { - font-size: inherit; -} - -.ac-url-text, -.ac-action-text { - color: -moz-nativehyperlinktext; - font-size: 0.9em; -} - -richlistitem[type~="action"][actiontype$="tab"] > .ac-url-box > .ac-action-icon { - list-style-image: url("chrome://browser/skin/actionicon-tab.png"); - padding: 0 3px; +.ac-type-icon[type=switchtab][selected], +.ac-type-icon[type=remotetab][selected] { + list-style-image: url("chrome://browser/skin/urlbar-tab.svg#tab-inverted"); } .autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) { color: GrayText; } -.ac-comment[selected="true"], -.ac-url-text[selected="true"], -.ac-action-text[selected="true"] { - color: inherit !important; -} - .autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment), .autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment) { color: GrayText; @@ -2749,29 +2802,6 @@ richlistitem[type~="action"][actiontype$="tab"] > .ac-url-box > .ac-action-icon min-width: 27em; } -.panel-promo-box { - margin: 8px -10px -10px -10px; - padding: 8px 10px; - border-top: 1px solid ThreeDShadow; - background-image: linear-gradient(hsla(0,0%,0%,.15), hsla(0,0%,0%,.08) 6px); -} - -.panel-promo-icon { - list-style-image: url("chrome://browser/skin/sync-notification-24.png"); - -moz-margin-end: 10px; - vertical-align: middle; -} - -.panel-promo-closebutton { - -moz-appearance: none; - height: 16px; - width: 16px; -} - -.panel-promo-closebutton > .toolbarbutton-text { - padding: 0; -} - /* Content area */ #sidebar { background-color: Window; @@ -3534,7 +3564,7 @@ richlistitem[type~="action"][actiontype$="tab"] > .ac-url-box > .ac-action-icon } .alltabs-item[busy] > .menu-iconic-left > .menu-iconic-icon { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); + list-style-image: url("chrome://global/skin/icons/loading.png"); } .alltabs-item[tabIsVisible] { @@ -3560,7 +3590,7 @@ menuitem:hover > hbox > .alltabs-endimage[soundplaying] { /* Sidebar */ #sidebar-throbber[loading="true"] { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); + list-style-image: url("chrome://global/skin/icons/loading.png"); -moz-margin-end: 4px; } @@ -3761,7 +3791,7 @@ html|*#fullscreen-exit-button { color: #fff; border: 1px solid #111; border-radius: 2px; - padding: 5px; + padding: 0 5px; width: 200px; margin: 0; } @@ -3891,7 +3921,7 @@ html|*#fullscreen-exit-button { } .devtools-responsiveui-close { - list-style-image: url("chrome://devtools/skin/images/close.png"); + list-style-image: url("chrome://devtools/skin/images/close.svg"); } .devtools-responsiveui-rotate { @@ -3899,10 +3929,6 @@ html|*#fullscreen-exit-button { } @media (min-resolution: 1.1dppx) { - .devtools-responsiveui-close { - list-style-image: url("chrome://devtools/skin/images/close@2x.png"); - } - .devtools-responsiveui-rotate { list-style-image: url("chrome://devtools/skin/images/responsivemode/responsiveui-rotate@2x.png"); } @@ -4477,7 +4503,7 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton:not(:h min-height: 18px; } -#TabsToolbar #downloads-button[cui-areatype="toolbar"] > #downloads-indicator-anchor > #downloads-indicator-icon { +#TabsToolbar #downloads-button[cui-areatype="toolbar"]:not([attention="success"]) > #downloads-indicator-anchor > #downloads-indicator-icon { background: -moz-image-rect(url("chrome://browser/skin/custom_images/#{$asset_path}/tabbar-icons.svg"), 0, 198, 18, 180) center no-repeat; } @@ -4489,19 +4515,47 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton:not(:h 0, 198, 18, 180) center no-repeat; } -//toolbar[brighttext] #downloads-button[cui-areatype="toolbar"]:not([attention]) > #downloads-indicator-anchor > #downloads-indicator-icon { +//toolbar[brighttext] #downloads-button[cui-areatype="toolbar"]:not([attention="success"]) > #downloads-indicator-anchor > #downloads-indicator-icon { // background: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted.png"), // 0, 198, 18, 180) center no-repeat; //} -#downloads-button[cui-areatype="toolbar"][attention] > #downloads-indicator-anchor > #downloads-indicator-icon, -#nav-bar #downloads-button[cui-areatype="toolbar"][attention] > #downloads-indicator-anchor > #downloads-indicator-icon, -#TabsToolbar #downloads-button[cui-areatype="toolbar"][attention] > #downloads-indicator-anchor > #downloads-indicator-icon { +#downloads-button[cui-areatype="toolbar"][attention="warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, +#downloads-button[cui-areatype="toolbar"][attention="severe"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { + display: -moz-box; + height: 13px; + width: 13px; + background-size: contain; + border: none; + box-shadow: none; + filter: drop-shadow(0 1px 0 hsla(206, 50%, 10%, .15)); +} + +#downloads-button[cui-areatype="toolbar"][attention="severe"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { + background: #D90000 url(chrome://browser/skin/update-badge-failed.svg) no-repeat center; +} + +#downloads-button[cui-areatype="toolbar"][attention="warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { + background: #FFBF00 url(chrome://browser/skin/update-badge-failed.svg) no-repeat center; +} + +#downloads-button[cui-areatype="toolbar"][attention="severe"] > .toolbarbutton-badge-stack > .toolbarbutton-badge:-moz-window-inactive, +#downloads-button[cui-areatype="toolbar"][attention="warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge:-moz-window-inactive { + filter: none; +} + +#downloads-button[cui-areatype="toolbar"][attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon, +#nav-bar #downloads-button[cui-areatype="toolbar"][attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon, +#TabsToolbar #downloads-button[cui-areatype="toolbar"][attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon { background-image: -moz-image-rect(url("chrome://browser/skin/custom_images/#{$asset_path}/toolbar-icons.svg"), 18, 198, 36, 180); } -#downloads-button[cui-areatype="menu-panel"][attention] { +//toolbar[brighttext] #downloads-button[cui-areatype="toolbar"][attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon { +// background-image: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted.png"), 18, 198, 36, 180); +//} + +#downloads-button[cui-areatype="menu-panel"][attention="success"] { list-style-image: url("chrome://browser/skin/downloads/download-glow-menuPanel.png"); -moz-image-region: auto; } @@ -4515,15 +4569,15 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton:not(:h background-size: 12px; } -//toolbar[brighttext] #downloads-button:not([counter]):not([attention]) > #downloads-indicator-anchor > #downloads-button-progress-area > #downloads-indicator-counter { +//toolbar[brighttext] #downloads-button:not([counter]):not([attention="success"]) > #downloads-indicator-anchor > #downloads-button-progress-area > #downloads-indicator-counter { // background-image: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted.png"), 0, 198, 18, 180); //} -#downloads-button:not([counter])[attention] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { +#downloads-button:not([counter])[attention="success"] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { background-image: -moz-image-rect(url("chrome://browser/skin/custom_images/#{$asset_path}/toolbar-icons.svg"), 18, 198, 36, 180); } -//toolbar[brighttext] #downloads-button:not([counter])[attention] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { +//toolbar[brighttext] #downloads-button:not([counter])[attention="success"] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { // background-image: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted.png"), 18, 198, 36, 180); //} @@ -4719,7 +4773,7 @@ toolbar[brighttext] #downloads-indicator-counter { } #social-sidebar-button[loading="true"] { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); + list-style-image: url("chrome://global/skin/icons/loading.png"); } #social-sidebar-favico { @@ -5190,6 +5244,14 @@ toolbarpaletteitem[place="toolbar"] { margin-bottom: 25px; } +toolbarpaletteitem[place="palette"]:-moz-focusring, +toolbarpaletteitem[place="panel"]:-moz-focusring, +toolbarpaletteitem[place="toolbar"]:-moz-focusring { + outline: 1px dotted rgba(0,0,0,.5); + outline-offset: -5px; + -moz-outline-radius: 2.5px; +} + #wrapper-edit-controls[place="palette"] > #edit-controls > toolbarbutton, #wrapper-edit-controls[place="palette"] > #edit-controls > separator, #wrapper-zoom-controls[place="palette"] > #zoom-controls > toolbarbutton, @@ -5494,22 +5556,18 @@ toolbarpaletteitem[place="toolbar"] { } #UITourTooltipBody { - -moz-margin-end: 14px; -} - -#UITourTooltipBody > vbox { - padding-top: 4px; + -moz-box-align: start; } -#UITourTooltipIconContainer { - -moz-margin-start: -16px; +#UITourtooltipTitleContainer { + -moz-box-align: start; + margin-bottom: 10px; } #UITourTooltipIcon { width: 48px; height: 48px; - -moz-margin-start: 28px; - -moz-margin-end: 28px; + -moz-margin-end: 10px; } #UITourTooltipTitle, @@ -5520,9 +5578,7 @@ toolbarpaletteitem[place="toolbar"] { #UITourTooltipTitle { font-size: 1.45rem; font-weight: bold; - -moz-margin-start: 0; - -moz-margin-end: 0; - margin: 0 0 9px 0; + margin: 0; } #UITourTooltipDescription { @@ -5534,6 +5590,7 @@ toolbarpaletteitem[place="toolbar"] { } #UITourTooltipClose { + position: relative; -moz-appearance: none; border: none; background-color: transparent; @@ -5550,8 +5607,8 @@ toolbarpaletteitem[place="toolbar"] { -moz-box-pack: end; background-color: hsla(210,4%,10%,.07); border-top: 1px solid hsla(210,4%,10%,.14); - margin: 24px -16px -16px; - padding: 2em 15px; + margin: 10px -16px -16px; + padding: 16px; } #UITourTooltipButtons > label, @@ -5564,6 +5621,11 @@ toolbarpaletteitem[place="toolbar"] { -moz-margin-start: 0; } +#UITourTooltipButtons > label:last-child, +#UITourTooltipButtons > button:last-child { + margin-inline-end: 0; +} + #UITourTooltipButtons > button[image] > .button-box > .button-icon { width: 16px; height: 16px; @@ -5767,7 +5829,12 @@ notification.heartbeat { width: 16px; } +/** + * Override the --panel-arrowcontent-padding so the background extends + * to the sides and bottom of the panel. + */ #UITourTooltipButtons { + margin-left: -10px; margin-bottom: -10px; } diff --git a/arc-firefox-theme/chrome/browser/sass/browser-dark.css b/arc-firefox-theme/chrome/browser/sass/browser-dark.css index 49f2f1d..c27e731 100644 --- a/arc-firefox-theme/chrome/browser/sass/browser-dark.css +++ b/arc-firefox-theme/chrome/browser/sass/browser-dark.css @@ -476,8 +476,8 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { :-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1 > :-moz-any(.toolbarbutton-menubutton-button, .toolbarbutton-badge-stack) > .toolbarbutton-icon { max-width: 16px; } -:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button) > .toolbarbutton-icon, -:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button) > :-moz-any(.toolbarbutton-menubutton-button, .toolbarbutton-badge-stack) > .toolbarbutton-icon, +:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon) > .toolbarbutton-icon, +:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon) > :-moz-any(.toolbarbutton-menubutton-button, .toolbarbutton-badge-stack) > .toolbarbutton-icon, #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon { max-width: 18px; } @@ -502,9 +502,9 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { transition-property: background-color, border-color; transition-duration: 150ms; } -:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button)) > .toolbarbutton-icon, -:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button)) > .toolbarbutton-badge-stack, -:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button)) > .toolbarbutton-menubutton-button > .toolbarbutton-icon { +:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon)) > .toolbarbutton-icon, +:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon)) > .toolbarbutton-badge-stack, +:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon)) > .toolbarbutton-menubutton-button > .toolbarbutton-icon { padding: 3px 7px; } :-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1 > .toolbarbutton-icon, @@ -1132,6 +1132,7 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { #minimize-button:active { list-style-image: url("chrome://browser/skin/custom_images/dark/window-controls/minimize_pressed.svg"); } +/* Location bar */ #urlbar, .searchbar-textbox { -moz-appearance: none; @@ -1197,7 +1198,7 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { #urlbar-search-settings { -moz-appearance: none; -moz-user-focus: ignore; - color: inherit; + color: GrayText; margin: 0; border: 0; padding: 8px 20px; @@ -1307,8 +1308,11 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { #urlbar[pageproxystate="valid"] > #identity-box.chromeUI { color: var(--identity-box-chrome-color); } -#identity-icon-labels { - padding-inline-start: 2px; } +#identity-icon-labels:-moz-locale-dir(ltr) { + padding-left: 2px; } + +#identity-icon-labels:-moz-locale-dir(rtl) { + padding-right: 2px; } #notification-popup-box:not([hidden]) + #identity-box { padding-inline-start: 5px; @@ -1441,10 +1445,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box .popup-notification-icon[popupid="password"] { list-style-image: url(chrome://mozapps/skin/passwordmgr/key-64.png); } -.popup-notification-icon[popupid="webapps-install-progress"], -.popup-notification-icon[popupid="webapps-install"] { - list-style-image: url(chrome://global/skin/icons/webapps-64.png); } - .popup-notification-icon[popupid="webRTC-sharingDevices"], .popup-notification-icon[popupid="webRTC-shareDevices"] { list-style-image: url(chrome://browser/skin/webRTC-shareDevice-64.png); } @@ -1512,10 +1512,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box list-style-image: url(chrome://mozapps/skin/passwordmgr/key-16.png); transform: scaleX(-1); } -.webapps-notification-icon, -#webapps-notification-icon { - list-style-image: url(chrome://global/skin/icons/webapps-16.png); } - #plugins-notification-icon { list-style-image: url(chrome://browser/skin/notification-pluginNormal.png); } @@ -1816,55 +1812,94 @@ notification[value="translation"] menulist > .menulist-dropmarker { #treecolAutoCompleteImage { max-width: 36px; } -.ac-result-type-bookmark, +#PopupAutoCompleteRichResult { + /* The awesomebar popup should open just below the navbar bottom border. */ + margin-top: 1px; } + +.autocomplete-richlistbox { + padding: 4px; } + +.autocomplete-richlistitem { + height: 30px; + min-height: 30px; + font: message-box; + border-radius: 2px; + border: 1px solid transparent; } + +.autocomplete-richlistitem[selected=true] { + background-color: Highlight; } + +.ac-title { + font-size: 14px; } + +.ac-tags { + font-size: 12px; } + +html|span.ac-tag { + background-color: MenuText; + color: Menu; + border-radius: 2px; + border: 1px solid transparent; + padding: 0 1px; } + +.ac-separator, +.ac-url, +.ac-action { + font-size: 12px; + color: -moz-nativehyperlinktext; } + +.ac-title[selected=true], +.ac-separator[selected], +.ac-url[selected=true], +.ac-action[selected=true] { + color: inherit !important; } + +.ac-tags-text[selected] > html|span.ac-tag { + background-color: HighlightText; + color: Highlight; } + +html|span.ac-emphasize-text-title, +html|span.ac-emphasize-text-tag, +html|span.ac-emphasize-text-url { + font-weight: 600; } + +.ac-type-icon[type=bookmark] { + list-style-image: url("chrome://browser/skin/urlbar-star.svg#star"); } + +.ac-type-icon[type=bookmark][selected][current] { + list-style-image: url("chrome://browser/skin/urlbar-star.svg#star-inverted"); } + .autocomplete-treebody::-moz-tree-image(bookmark, treecolAutoCompleteImage) { list-style-image: url("chrome://browser/skin/places/autocomplete-star.png"); width: 16px; height: 16px; } -.ac-result-type-keyword, -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage), -richlistitem[type~="action"][actiontype="searchengine"] > .ac-title-box > .ac-site-icon { - list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon); - width: 16px; - height: 16px; } +.ac-type-icon[type=keyword], +.ac-site-icon[type=searchengine], +.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) { + list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon); } -.ac-result-type-keyword[selected="true"], -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage, selected), -richlistitem[type~="action"][actiontype="searchengine"][selected="true"] > .ac-title-box > .ac-site-icon { +.ac-type-icon[type=keyword][selected], +.ac-site-icon[type=searchengine][selected], +.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage, selected) { list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon-inverted); } -.ac-result-type-tag, .autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) { list-style-image: url("chrome://browser/skin/places/tag.png"); width: 16px; height: 16px; } -.ac-comment, -#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > description, -#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > button { - font-size: 1.05em; } - -.ac-extra > .ac-comment { - font-size: inherit; } - -.ac-url-text, -.ac-action-text { - color: -moz-nativehyperlinktext; - font-size: 0.9em; } +.ac-type-icon[type=switchtab], +.ac-type-icon[type=remotetab] { + list-style-image: url("chrome://browser/skin/urlbar-tab.svg#tab"); } -richlistitem[type~="action"][actiontype$="tab"] > .ac-url-box > .ac-action-icon { - list-style-image: url("chrome://browser/skin/actionicon-tab.png"); - padding: 0 3px; } +.ac-type-icon[type=switchtab][selected], +.ac-type-icon[type=remotetab][selected] { + list-style-image: url("chrome://browser/skin/urlbar-tab.svg#tab-inverted"); } .autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) { color: GrayText; } -.ac-comment[selected="true"], -.ac-url-text[selected="true"], -.ac-action-text[selected="true"] { - color: inherit !important; } - .autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment), .autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment) { color: GrayText; @@ -2064,25 +2099,6 @@ richlistitem[type~="action"][actiontype$="tab"] > .ac-url-box > .ac-action-icon #editBMPanel_folderTree { min-width: 27em; } -.panel-promo-box { - margin: 8px -10px -10px -10px; - padding: 8px 10px; - border-top: 1px solid ThreeDShadow; - background-image: linear-gradient(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.08) 6px); } - -.panel-promo-icon { - list-style-image: url("chrome://browser/skin/sync-notification-24.png"); - -moz-margin-end: 10px; - vertical-align: middle; } - -.panel-promo-closebutton { - -moz-appearance: none; - height: 16px; - width: 16px; } - -.panel-promo-closebutton > .toolbarbutton-text { - padding: 0; } - /* Content area */ #sidebar { background-color: Window; } @@ -2621,7 +2637,7 @@ lwtHeader;*/ font-weight: bold; } .alltabs-item[busy] > .menu-iconic-left > .menu-iconic-icon { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); } + list-style-image: url("chrome://global/skin/icons/loading.png"); } .alltabs-item[tabIsVisible] { /* box-shadow instead of background-color to work around native styling */ @@ -2641,7 +2657,7 @@ menuitem:hover > hbox > .alltabs-endimage[soundplaying] { /* Sidebar */ #sidebar-throbber[loading="true"] { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); + list-style-image: url("chrome://global/skin/icons/loading.png"); -moz-margin-end: 4px; } toolbarbutton.chevron { @@ -2813,7 +2829,7 @@ html|*#fullscreen-exit-button { color: #fff; border: 1px solid #111; border-radius: 2px; - padding: 5px; + padding: 0 5px; width: 200px; margin: 0; } @@ -2921,15 +2937,12 @@ html|*#fullscreen-exit-button { margin-left: 0; } .devtools-responsiveui-close { - list-style-image: url("chrome://devtools/skin/images/close.png"); } + list-style-image: url("chrome://devtools/skin/images/close.svg"); } .devtools-responsiveui-rotate { list-style-image: url("chrome://devtools/skin/images/responsivemode/responsiveui-rotate.png"); } @media (min-resolution: 1.1dppx) { - .devtools-responsiveui-close { - list-style-image: url("chrome://devtools/skin/images/close@2x.png"); } - .devtools-responsiveui-rotate { list-style-image: url("chrome://devtools/skin/images/responsivemode/responsiveui-rotate@2x.png"); } } .devtools-responsiveui-touch { @@ -3396,7 +3409,7 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton:not(:h min-width: 18px; min-height: 18px; } -#TabsToolbar #downloads-button[cui-areatype="toolbar"] > #downloads-indicator-anchor > #downloads-indicator-icon { +#TabsToolbar #downloads-button[cui-areatype="toolbar"]:not([attention="success"]) > #downloads-indicator-anchor > #downloads-indicator-icon { background: -moz-image-rect(url("chrome://browser/skin/custom_images/dark/tabbar-icons.svg"), 0, 198, 18, 180) center no-repeat; } #downloads-button[cui-areatype="toolbar"]:not([disabled=true]):-moz-any([open], [checked], :hover:active) > #downloads-indicator-anchor > #downloads-indicator-icon, @@ -3404,12 +3417,32 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton:not(:h #nav-bar #downloads-button[cui-areatype="toolbar"]:not([disabled=true]):-moz-any([open], [checked], :hover:active) > #downloads-indicator-anchor > #downloads-indicator-icon { background: -moz-image-rect(url("chrome://browser/skin/custom_images/toolbar-icons-active.svg"), 0, 198, 18, 180) center no-repeat; } -#downloads-button[cui-areatype="toolbar"][attention] > #downloads-indicator-anchor > #downloads-indicator-icon, -#nav-bar #downloads-button[cui-areatype="toolbar"][attention] > #downloads-indicator-anchor > #downloads-indicator-icon, -#TabsToolbar #downloads-button[cui-areatype="toolbar"][attention] > #downloads-indicator-anchor > #downloads-indicator-icon { +#downloads-button[cui-areatype="toolbar"][attention="warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, +#downloads-button[cui-areatype="toolbar"][attention="severe"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { + display: -moz-box; + height: 13px; + width: 13px; + background-size: contain; + border: none; + box-shadow: none; + filter: drop-shadow(0 1px 0 rgba(13, 27, 38, 0.15)); } + +#downloads-button[cui-areatype="toolbar"][attention="severe"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { + background: #D90000 url(chrome://browser/skin/update-badge-failed.svg) no-repeat center; } + +#downloads-button[cui-areatype="toolbar"][attention="warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { + background: #FFBF00 url(chrome://browser/skin/update-badge-failed.svg) no-repeat center; } + +#downloads-button[cui-areatype="toolbar"][attention="severe"] > .toolbarbutton-badge-stack > .toolbarbutton-badge:-moz-window-inactive, +#downloads-button[cui-areatype="toolbar"][attention="warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge:-moz-window-inactive { + filter: none; } + +#downloads-button[cui-areatype="toolbar"][attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon, +#nav-bar #downloads-button[cui-areatype="toolbar"][attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon, +#TabsToolbar #downloads-button[cui-areatype="toolbar"][attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon { background-image: -moz-image-rect(url("chrome://browser/skin/custom_images/dark/toolbar-icons.svg"), 18, 198, 36, 180); } -#downloads-button[cui-areatype="menu-panel"][attention] { +#downloads-button[cui-areatype="menu-panel"][attention="success"] { list-style-image: url("chrome://browser/skin/downloads/download-glow-menuPanel.png"); -moz-image-region: auto; } @@ -3419,7 +3452,7 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton:not(:h background: -moz-image-rect(url("chrome://browser/skin/Toolbar-small.png"), 0, 16, 16, 0) center no-repeat; background-size: 12px; } -#downloads-button:not([counter])[attention] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { +#downloads-button:not([counter])[attention="success"] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { background-image: -moz-image-rect(url("chrome://browser/skin/custom_images/dark/toolbar-icons.svg"), 18, 198, 36, 180); } /*** Download notifications ***/ @@ -3595,7 +3628,7 @@ toolbar[brighttext] #downloads-indicator-counter { display: none; } #social-sidebar-button[loading="true"] { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); } + list-style-image: url("chrome://global/skin/icons/loading.png"); } #social-sidebar-favico { max-height: 16px; @@ -3973,6 +4006,13 @@ toolbarpaletteitem[place="toolbar"] { #customization-palette:not([hidden]) { margin-bottom: 25px; } +toolbarpaletteitem[place="palette"]:-moz-focusring, +toolbarpaletteitem[place="panel"]:-moz-focusring, +toolbarpaletteitem[place="toolbar"]:-moz-focusring { + outline: 1px dotted rgba(0, 0, 0, 0.5); + outline-offset: -5px; + -moz-outline-radius: 2.5px; } + #wrapper-edit-controls[place="palette"] > #edit-controls > toolbarbutton, #wrapper-edit-controls[place="palette"] > #edit-controls > separator, #wrapper-zoom-controls[place="palette"] > #zoom-controls > toolbarbutton, @@ -4225,19 +4265,16 @@ toolbarpaletteitem[place="toolbar"] { min-width: 32px; } #UITourTooltipBody { - -moz-margin-end: 14px; } - -#UITourTooltipBody > vbox { - padding-top: 4px; } + -moz-box-align: start; } -#UITourTooltipIconContainer { - -moz-margin-start: -16px; } +#UITourtooltipTitleContainer { + -moz-box-align: start; + margin-bottom: 10px; } #UITourTooltipIcon { width: 48px; height: 48px; - -moz-margin-start: 28px; - -moz-margin-end: 28px; } + -moz-margin-end: 10px; } #UITourTooltipTitle, #UITourTooltipDescription { @@ -4246,9 +4283,7 @@ toolbarpaletteitem[place="toolbar"] { #UITourTooltipTitle { font-size: 1.45rem; font-weight: bold; - -moz-margin-start: 0; - -moz-margin-end: 0; - margin: 0 0 9px 0; } + margin: 0; } #UITourTooltipDescription { -moz-margin-start: 0; @@ -4259,6 +4294,7 @@ toolbarpaletteitem[place="toolbar"] { /* Override global.css */ } #UITourTooltipClose { + position: relative; -moz-appearance: none; border: none; background-color: transparent; @@ -4273,8 +4309,8 @@ toolbarpaletteitem[place="toolbar"] { -moz-box-pack: end; background-color: rgba(24, 26, 27, 0.07); border-top: 1px solid rgba(24, 26, 27, 0.14); - margin: 24px -16px -16px; - padding: 2em 15px; } + margin: 10px -16px -16px; + padding: 16px; } #UITourTooltipButtons > label, #UITourTooltipButtons > button { @@ -4284,6 +4320,10 @@ toolbarpaletteitem[place="toolbar"] { #UITourTooltipButtons > button:first-child { -moz-margin-start: 0; } +#UITourTooltipButtons > label:last-child, +#UITourTooltipButtons > button:last-child { + margin-inline-end: 0; } + #UITourTooltipButtons > button[image] > .button-box > .button-icon { width: 16px; height: 16px; @@ -4446,7 +4486,12 @@ notification.heartbeat { height: 16px; width: 16px; } +/** + * Override the --panel-arrowcontent-padding so the background extends + * to the sides and bottom of the panel. + */ #UITourTooltipButtons { + margin-left: -10px; margin-bottom: -10px; } #context-navigation > .menuitem-iconic { diff --git a/arc-firefox-theme/chrome/browser/sass/browser-darker.css b/arc-firefox-theme/chrome/browser/sass/browser-darker.css index 4a1a652..32f3f94 100644 --- a/arc-firefox-theme/chrome/browser/sass/browser-darker.css +++ b/arc-firefox-theme/chrome/browser/sass/browser-darker.css @@ -476,8 +476,8 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { :-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1 > :-moz-any(.toolbarbutton-menubutton-button, .toolbarbutton-badge-stack) > .toolbarbutton-icon { max-width: 16px; } -:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button) > .toolbarbutton-icon, -:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button) > :-moz-any(.toolbarbutton-menubutton-button, .toolbarbutton-badge-stack) > .toolbarbutton-icon, +:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon) > .toolbarbutton-icon, +:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon) > :-moz-any(.toolbarbutton-menubutton-button, .toolbarbutton-badge-stack) > .toolbarbutton-icon, #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon { max-width: 18px; } @@ -502,9 +502,9 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { transition-property: background-color, border-color; transition-duration: 150ms; } -:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button)) > .toolbarbutton-icon, -:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button)) > .toolbarbutton-badge-stack, -:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button)) > .toolbarbutton-menubutton-button > .toolbarbutton-icon { +:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon)) > .toolbarbutton-icon, +:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon)) > .toolbarbutton-badge-stack, +:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon)) > .toolbarbutton-menubutton-button > .toolbarbutton-icon { padding: 3px 7px; } :-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1 > .toolbarbutton-icon, @@ -1132,6 +1132,7 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { #minimize-button:active { list-style-image: url("chrome://browser/skin/custom_images/dark/window-controls/minimize_pressed.svg"); } +/* Location bar */ #urlbar, .searchbar-textbox { -moz-appearance: none; @@ -1196,7 +1197,7 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { #urlbar-search-settings { -moz-appearance: none; -moz-user-focus: ignore; - color: inherit; + color: GrayText; margin: 0; border: 0; padding: 8px 20px; @@ -1306,8 +1307,11 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { #urlbar[pageproxystate="valid"] > #identity-box.chromeUI { color: var(--identity-box-chrome-color); } -#identity-icon-labels { - padding-inline-start: 2px; } +#identity-icon-labels:-moz-locale-dir(ltr) { + padding-left: 2px; } + +#identity-icon-labels:-moz-locale-dir(rtl) { + padding-right: 2px; } #notification-popup-box:not([hidden]) + #identity-box { padding-inline-start: 5px; @@ -1440,10 +1444,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box .popup-notification-icon[popupid="password"] { list-style-image: url(chrome://mozapps/skin/passwordmgr/key-64.png); } -.popup-notification-icon[popupid="webapps-install-progress"], -.popup-notification-icon[popupid="webapps-install"] { - list-style-image: url(chrome://global/skin/icons/webapps-64.png); } - .popup-notification-icon[popupid="webRTC-sharingDevices"], .popup-notification-icon[popupid="webRTC-shareDevices"] { list-style-image: url(chrome://browser/skin/webRTC-shareDevice-64.png); } @@ -1511,10 +1511,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box list-style-image: url(chrome://mozapps/skin/passwordmgr/key-16.png); transform: scaleX(-1); } -.webapps-notification-icon, -#webapps-notification-icon { - list-style-image: url(chrome://global/skin/icons/webapps-16.png); } - #plugins-notification-icon { list-style-image: url(chrome://browser/skin/notification-pluginNormal.png); } @@ -1815,55 +1811,94 @@ notification[value="translation"] menulist > .menulist-dropmarker { #treecolAutoCompleteImage { max-width: 36px; } -.ac-result-type-bookmark, +#PopupAutoCompleteRichResult { + /* The awesomebar popup should open just below the navbar bottom border. */ + margin-top: 1px; } + +.autocomplete-richlistbox { + padding: 4px; } + +.autocomplete-richlistitem { + height: 30px; + min-height: 30px; + font: message-box; + border-radius: 2px; + border: 1px solid transparent; } + +.autocomplete-richlistitem[selected=true] { + background-color: Highlight; } + +.ac-title { + font-size: 14px; } + +.ac-tags { + font-size: 12px; } + +html|span.ac-tag { + background-color: MenuText; + color: Menu; + border-radius: 2px; + border: 1px solid transparent; + padding: 0 1px; } + +.ac-separator, +.ac-url, +.ac-action { + font-size: 12px; + color: -moz-nativehyperlinktext; } + +.ac-title[selected=true], +.ac-separator[selected], +.ac-url[selected=true], +.ac-action[selected=true] { + color: inherit !important; } + +.ac-tags-text[selected] > html|span.ac-tag { + background-color: HighlightText; + color: Highlight; } + +html|span.ac-emphasize-text-title, +html|span.ac-emphasize-text-tag, +html|span.ac-emphasize-text-url { + font-weight: 600; } + +.ac-type-icon[type=bookmark] { + list-style-image: url("chrome://browser/skin/urlbar-star.svg#star"); } + +.ac-type-icon[type=bookmark][selected][current] { + list-style-image: url("chrome://browser/skin/urlbar-star.svg#star-inverted"); } + .autocomplete-treebody::-moz-tree-image(bookmark, treecolAutoCompleteImage) { list-style-image: url("chrome://browser/skin/places/autocomplete-star.png"); width: 16px; height: 16px; } -.ac-result-type-keyword, -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage), -richlistitem[type~="action"][actiontype="searchengine"] > .ac-title-box > .ac-site-icon { - list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon); - width: 16px; - height: 16px; } +.ac-type-icon[type=keyword], +.ac-site-icon[type=searchengine], +.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) { + list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon); } -.ac-result-type-keyword[selected="true"], -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage, selected), -richlistitem[type~="action"][actiontype="searchengine"][selected="true"] > .ac-title-box > .ac-site-icon { +.ac-type-icon[type=keyword][selected], +.ac-site-icon[type=searchengine][selected], +.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage, selected) { list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon-inverted); } -.ac-result-type-tag, .autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) { list-style-image: url("chrome://browser/skin/places/tag.png"); width: 16px; height: 16px; } -.ac-comment, -#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > description, -#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > button { - font-size: 1.05em; } - -.ac-extra > .ac-comment { - font-size: inherit; } - -.ac-url-text, -.ac-action-text { - color: -moz-nativehyperlinktext; - font-size: 0.9em; } +.ac-type-icon[type=switchtab], +.ac-type-icon[type=remotetab] { + list-style-image: url("chrome://browser/skin/urlbar-tab.svg#tab"); } -richlistitem[type~="action"][actiontype$="tab"] > .ac-url-box > .ac-action-icon { - list-style-image: url("chrome://browser/skin/actionicon-tab.png"); - padding: 0 3px; } +.ac-type-icon[type=switchtab][selected], +.ac-type-icon[type=remotetab][selected] { + list-style-image: url("chrome://browser/skin/urlbar-tab.svg#tab-inverted"); } .autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) { color: GrayText; } -.ac-comment[selected="true"], -.ac-url-text[selected="true"], -.ac-action-text[selected="true"] { - color: inherit !important; } - .autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment), .autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment) { color: GrayText; @@ -2063,25 +2098,6 @@ richlistitem[type~="action"][actiontype$="tab"] > .ac-url-box > .ac-action-icon #editBMPanel_folderTree { min-width: 27em; } -.panel-promo-box { - margin: 8px -10px -10px -10px; - padding: 8px 10px; - border-top: 1px solid ThreeDShadow; - background-image: linear-gradient(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.08) 6px); } - -.panel-promo-icon { - list-style-image: url("chrome://browser/skin/sync-notification-24.png"); - -moz-margin-end: 10px; - vertical-align: middle; } - -.panel-promo-closebutton { - -moz-appearance: none; - height: 16px; - width: 16px; } - -.panel-promo-closebutton > .toolbarbutton-text { - padding: 0; } - /* Content area */ #sidebar { background-color: Window; } @@ -2621,7 +2637,7 @@ lwtHeader;*/ font-weight: bold; } .alltabs-item[busy] > .menu-iconic-left > .menu-iconic-icon { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); } + list-style-image: url("chrome://global/skin/icons/loading.png"); } .alltabs-item[tabIsVisible] { /* box-shadow instead of background-color to work around native styling */ @@ -2641,7 +2657,7 @@ menuitem:hover > hbox > .alltabs-endimage[soundplaying] { /* Sidebar */ #sidebar-throbber[loading="true"] { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); + list-style-image: url("chrome://global/skin/icons/loading.png"); -moz-margin-end: 4px; } toolbarbutton.chevron { @@ -2813,7 +2829,7 @@ html|*#fullscreen-exit-button { color: #fff; border: 1px solid #111; border-radius: 2px; - padding: 5px; + padding: 0 5px; width: 200px; margin: 0; } @@ -2921,15 +2937,12 @@ html|*#fullscreen-exit-button { margin-left: 0; } .devtools-responsiveui-close { - list-style-image: url("chrome://devtools/skin/images/close.png"); } + list-style-image: url("chrome://devtools/skin/images/close.svg"); } .devtools-responsiveui-rotate { list-style-image: url("chrome://devtools/skin/images/responsivemode/responsiveui-rotate.png"); } @media (min-resolution: 1.1dppx) { - .devtools-responsiveui-close { - list-style-image: url("chrome://devtools/skin/images/close@2x.png"); } - .devtools-responsiveui-rotate { list-style-image: url("chrome://devtools/skin/images/responsivemode/responsiveui-rotate@2x.png"); } } .devtools-responsiveui-touch { @@ -3396,7 +3409,7 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton:not(:h min-width: 18px; min-height: 18px; } -#TabsToolbar #downloads-button[cui-areatype="toolbar"] > #downloads-indicator-anchor > #downloads-indicator-icon { +#TabsToolbar #downloads-button[cui-areatype="toolbar"]:not([attention="success"]) > #downloads-indicator-anchor > #downloads-indicator-icon { background: -moz-image-rect(url("chrome://browser/skin/custom_images/light/tabbar-icons.svg"), 0, 198, 18, 180) center no-repeat; } #downloads-button[cui-areatype="toolbar"]:not([disabled=true]):-moz-any([open], [checked], :hover:active) > #downloads-indicator-anchor > #downloads-indicator-icon, @@ -3404,12 +3417,32 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton:not(:h #nav-bar #downloads-button[cui-areatype="toolbar"]:not([disabled=true]):-moz-any([open], [checked], :hover:active) > #downloads-indicator-anchor > #downloads-indicator-icon { background: -moz-image-rect(url("chrome://browser/skin/custom_images/toolbar-icons-active.svg"), 0, 198, 18, 180) center no-repeat; } -#downloads-button[cui-areatype="toolbar"][attention] > #downloads-indicator-anchor > #downloads-indicator-icon, -#nav-bar #downloads-button[cui-areatype="toolbar"][attention] > #downloads-indicator-anchor > #downloads-indicator-icon, -#TabsToolbar #downloads-button[cui-areatype="toolbar"][attention] > #downloads-indicator-anchor > #downloads-indicator-icon { +#downloads-button[cui-areatype="toolbar"][attention="warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, +#downloads-button[cui-areatype="toolbar"][attention="severe"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { + display: -moz-box; + height: 13px; + width: 13px; + background-size: contain; + border: none; + box-shadow: none; + filter: drop-shadow(0 1px 0 rgba(13, 27, 38, 0.15)); } + +#downloads-button[cui-areatype="toolbar"][attention="severe"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { + background: #D90000 url(chrome://browser/skin/update-badge-failed.svg) no-repeat center; } + +#downloads-button[cui-areatype="toolbar"][attention="warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { + background: #FFBF00 url(chrome://browser/skin/update-badge-failed.svg) no-repeat center; } + +#downloads-button[cui-areatype="toolbar"][attention="severe"] > .toolbarbutton-badge-stack > .toolbarbutton-badge:-moz-window-inactive, +#downloads-button[cui-areatype="toolbar"][attention="warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge:-moz-window-inactive { + filter: none; } + +#downloads-button[cui-areatype="toolbar"][attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon, +#nav-bar #downloads-button[cui-areatype="toolbar"][attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon, +#TabsToolbar #downloads-button[cui-areatype="toolbar"][attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon { background-image: -moz-image-rect(url("chrome://browser/skin/custom_images/light/toolbar-icons.svg"), 18, 198, 36, 180); } -#downloads-button[cui-areatype="menu-panel"][attention] { +#downloads-button[cui-areatype="menu-panel"][attention="success"] { list-style-image: url("chrome://browser/skin/downloads/download-glow-menuPanel.png"); -moz-image-region: auto; } @@ -3419,7 +3452,7 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton:not(:h background: -moz-image-rect(url("chrome://browser/skin/Toolbar-small.png"), 0, 16, 16, 0) center no-repeat; background-size: 12px; } -#downloads-button:not([counter])[attention] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { +#downloads-button:not([counter])[attention="success"] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { background-image: -moz-image-rect(url("chrome://browser/skin/custom_images/light/toolbar-icons.svg"), 18, 198, 36, 180); } /*** Download notifications ***/ @@ -3595,7 +3628,7 @@ toolbar[brighttext] #downloads-indicator-counter { display: none; } #social-sidebar-button[loading="true"] { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); } + list-style-image: url("chrome://global/skin/icons/loading.png"); } #social-sidebar-favico { max-height: 16px; @@ -3973,6 +4006,13 @@ toolbarpaletteitem[place="toolbar"] { #customization-palette:not([hidden]) { margin-bottom: 25px; } +toolbarpaletteitem[place="palette"]:-moz-focusring, +toolbarpaletteitem[place="panel"]:-moz-focusring, +toolbarpaletteitem[place="toolbar"]:-moz-focusring { + outline: 1px dotted rgba(0, 0, 0, 0.5); + outline-offset: -5px; + -moz-outline-radius: 2.5px; } + #wrapper-edit-controls[place="palette"] > #edit-controls > toolbarbutton, #wrapper-edit-controls[place="palette"] > #edit-controls > separator, #wrapper-zoom-controls[place="palette"] > #zoom-controls > toolbarbutton, @@ -4225,19 +4265,16 @@ toolbarpaletteitem[place="toolbar"] { min-width: 32px; } #UITourTooltipBody { - -moz-margin-end: 14px; } - -#UITourTooltipBody > vbox { - padding-top: 4px; } + -moz-box-align: start; } -#UITourTooltipIconContainer { - -moz-margin-start: -16px; } +#UITourtooltipTitleContainer { + -moz-box-align: start; + margin-bottom: 10px; } #UITourTooltipIcon { width: 48px; height: 48px; - -moz-margin-start: 28px; - -moz-margin-end: 28px; } + -moz-margin-end: 10px; } #UITourTooltipTitle, #UITourTooltipDescription { @@ -4246,9 +4283,7 @@ toolbarpaletteitem[place="toolbar"] { #UITourTooltipTitle { font-size: 1.45rem; font-weight: bold; - -moz-margin-start: 0; - -moz-margin-end: 0; - margin: 0 0 9px 0; } + margin: 0; } #UITourTooltipDescription { -moz-margin-start: 0; @@ -4259,6 +4294,7 @@ toolbarpaletteitem[place="toolbar"] { /* Override global.css */ } #UITourTooltipClose { + position: relative; -moz-appearance: none; border: none; background-color: transparent; @@ -4273,8 +4309,8 @@ toolbarpaletteitem[place="toolbar"] { -moz-box-pack: end; background-color: rgba(24, 26, 27, 0.07); border-top: 1px solid rgba(24, 26, 27, 0.14); - margin: 24px -16px -16px; - padding: 2em 15px; } + margin: 10px -16px -16px; + padding: 16px; } #UITourTooltipButtons > label, #UITourTooltipButtons > button { @@ -4284,6 +4320,10 @@ toolbarpaletteitem[place="toolbar"] { #UITourTooltipButtons > button:first-child { -moz-margin-start: 0; } +#UITourTooltipButtons > label:last-child, +#UITourTooltipButtons > button:last-child { + margin-inline-end: 0; } + #UITourTooltipButtons > button[image] > .button-box > .button-icon { width: 16px; height: 16px; @@ -4446,7 +4486,12 @@ notification.heartbeat { height: 16px; width: 16px; } +/** + * Override the --panel-arrowcontent-padding so the background extends + * to the sides and bottom of the panel. + */ #UITourTooltipButtons { + margin-left: -10px; margin-bottom: -10px; } #context-navigation > .menuitem-iconic { diff --git a/arc-firefox-theme/chrome/browser/sass/browser-light.css b/arc-firefox-theme/chrome/browser/sass/browser-light.css index 3ef2f72..b332f67 100644 --- a/arc-firefox-theme/chrome/browser/sass/browser-light.css +++ b/arc-firefox-theme/chrome/browser/sass/browser-light.css @@ -476,8 +476,8 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { :-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1 > :-moz-any(.toolbarbutton-menubutton-button, .toolbarbutton-badge-stack) > .toolbarbutton-icon { max-width: 16px; } -:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button) > .toolbarbutton-icon, -:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button) > :-moz-any(.toolbarbutton-menubutton-button, .toolbarbutton-badge-stack) > .toolbarbutton-icon, +:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon) > .toolbarbutton-icon, +:-moz-any(toolbar, .widget-overflow-list) .toolbarbutton-1:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon) > :-moz-any(.toolbarbutton-menubutton-button, .toolbarbutton-badge-stack) > .toolbarbutton-icon, #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon { max-width: 18px; } @@ -502,9 +502,9 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { transition-property: background-color, border-color; transition-duration: 150ms; } -:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button)) > .toolbarbutton-icon, -:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button)) > .toolbarbutton-badge-stack, -:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button)) > .toolbarbutton-menubutton-button > .toolbarbutton-icon { +:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon)) > .toolbarbutton-icon, +:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon)) > .toolbarbutton-badge-stack, +:-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not(:-moz-any(#back-button, #forward-button, #home-button, #print-button, #downloads-button, #bookmarks-menu-button, #new-tab-button, #new-window-button, #fullscreen-button, #sync-button, #feed-button, #social-share-button, #open-file-button, #find-button, #developer-button, #preferences-button, #privatebrowsing-button, #save-page-button, #add-ons-button, #history-panelmenu, #nav-bar-overflow-button, #PanelUI-menu-button, #characterencoding-button, #email-link-button, #sidebar-button, #zoom-out-button, #zoom-reset-button, #zoom-in-button, #cut-button, #copy-button, #paste-button, #e10s-button, #panic-button, #webide-button, .toolbarbutton-legacy-addon)) > .toolbarbutton-menubutton-button > .toolbarbutton-icon { padding: 3px 7px; } :-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1 > .toolbarbutton-icon, @@ -1132,6 +1132,7 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { #minimize-button:active { list-style-image: url("chrome://browser/skin/custom_images/light/window-controls/minimize_pressed.svg"); } +/* Location bar */ #urlbar, .searchbar-textbox { -moz-appearance: none; @@ -1196,7 +1197,7 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { #urlbar-search-settings { -moz-appearance: none; -moz-user-focus: ignore; - color: inherit; + color: GrayText; margin: 0; border: 0; padding: 8px 20px; @@ -1306,8 +1307,11 @@ menuitem:not([type]):not(.menuitem-tooltip):not(.menuitem-iconic-tooltip) { #urlbar[pageproxystate="valid"] > #identity-box.chromeUI { color: var(--identity-box-chrome-color); } -#identity-icon-labels { - padding-inline-start: 2px; } +#identity-icon-labels:-moz-locale-dir(ltr) { + padding-left: 2px; } + +#identity-icon-labels:-moz-locale-dir(rtl) { + padding-right: 2px; } #notification-popup-box:not([hidden]) + #identity-box { padding-inline-start: 5px; @@ -1440,10 +1444,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box .popup-notification-icon[popupid="password"] { list-style-image: url(chrome://mozapps/skin/passwordmgr/key-64.png); } -.popup-notification-icon[popupid="webapps-install-progress"], -.popup-notification-icon[popupid="webapps-install"] { - list-style-image: url(chrome://global/skin/icons/webapps-64.png); } - .popup-notification-icon[popupid="webRTC-sharingDevices"], .popup-notification-icon[popupid="webRTC-shareDevices"] { list-style-image: url(chrome://browser/skin/webRTC-shareDevice-64.png); } @@ -1511,10 +1511,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box list-style-image: url(chrome://mozapps/skin/passwordmgr/key-16.png); transform: scaleX(-1); } -.webapps-notification-icon, -#webapps-notification-icon { - list-style-image: url(chrome://global/skin/icons/webapps-16.png); } - #plugins-notification-icon { list-style-image: url(chrome://browser/skin/notification-pluginNormal.png); } @@ -1815,55 +1811,94 @@ notification[value="translation"] menulist > .menulist-dropmarker { #treecolAutoCompleteImage { max-width: 36px; } -.ac-result-type-bookmark, +#PopupAutoCompleteRichResult { + /* The awesomebar popup should open just below the navbar bottom border. */ + margin-top: 1px; } + +.autocomplete-richlistbox { + padding: 4px; } + +.autocomplete-richlistitem { + height: 30px; + min-height: 30px; + font: message-box; + border-radius: 2px; + border: 1px solid transparent; } + +.autocomplete-richlistitem[selected=true] { + background-color: Highlight; } + +.ac-title { + font-size: 14px; } + +.ac-tags { + font-size: 12px; } + +html|span.ac-tag { + background-color: MenuText; + color: Menu; + border-radius: 2px; + border: 1px solid transparent; + padding: 0 1px; } + +.ac-separator, +.ac-url, +.ac-action { + font-size: 12px; + color: -moz-nativehyperlinktext; } + +.ac-title[selected=true], +.ac-separator[selected], +.ac-url[selected=true], +.ac-action[selected=true] { + color: inherit !important; } + +.ac-tags-text[selected] > html|span.ac-tag { + background-color: HighlightText; + color: Highlight; } + +html|span.ac-emphasize-text-title, +html|span.ac-emphasize-text-tag, +html|span.ac-emphasize-text-url { + font-weight: 600; } + +.ac-type-icon[type=bookmark] { + list-style-image: url("chrome://browser/skin/urlbar-star.svg#star"); } + +.ac-type-icon[type=bookmark][selected][current] { + list-style-image: url("chrome://browser/skin/urlbar-star.svg#star-inverted"); } + .autocomplete-treebody::-moz-tree-image(bookmark, treecolAutoCompleteImage) { list-style-image: url("chrome://browser/skin/places/autocomplete-star.png"); width: 16px; height: 16px; } -.ac-result-type-keyword, -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage), -richlistitem[type~="action"][actiontype="searchengine"] > .ac-title-box > .ac-site-icon { - list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon); - width: 16px; - height: 16px; } +.ac-type-icon[type=keyword], +.ac-site-icon[type=searchengine], +.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) { + list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon); } -.ac-result-type-keyword[selected="true"], -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage, selected), -richlistitem[type~="action"][actiontype="searchengine"][selected="true"] > .ac-title-box > .ac-site-icon { +.ac-type-icon[type=keyword][selected], +.ac-site-icon[type=searchengine][selected], +.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage, selected) { list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon-inverted); } -.ac-result-type-tag, .autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) { list-style-image: url("chrome://browser/skin/places/tag.png"); width: 16px; height: 16px; } -.ac-comment, -#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > description, -#PopupAutoCompleteRichResult > hbox[anonid="search-suggestions-notification"] > button { - font-size: 1.05em; } - -.ac-extra > .ac-comment { - font-size: inherit; } - -.ac-url-text, -.ac-action-text { - color: -moz-nativehyperlinktext; - font-size: 0.9em; } +.ac-type-icon[type=switchtab], +.ac-type-icon[type=remotetab] { + list-style-image: url("chrome://browser/skin/urlbar-tab.svg#tab"); } -richlistitem[type~="action"][actiontype$="tab"] > .ac-url-box > .ac-action-icon { - list-style-image: url("chrome://browser/skin/actionicon-tab.png"); - padding: 0 3px; } +.ac-type-icon[type=switchtab][selected], +.ac-type-icon[type=remotetab][selected] { + list-style-image: url("chrome://browser/skin/urlbar-tab.svg#tab-inverted"); } .autocomplete-treebody::-moz-tree-cell-text(treecolAutoCompleteComment) { color: GrayText; } -.ac-comment[selected="true"], -.ac-url-text[selected="true"], -.ac-action-text[selected="true"] { - color: inherit !important; } - .autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment), .autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment) { color: GrayText; @@ -2063,25 +2098,6 @@ richlistitem[type~="action"][actiontype$="tab"] > .ac-url-box > .ac-action-icon #editBMPanel_folderTree { min-width: 27em; } -.panel-promo-box { - margin: 8px -10px -10px -10px; - padding: 8px 10px; - border-top: 1px solid ThreeDShadow; - background-image: linear-gradient(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.08) 6px); } - -.panel-promo-icon { - list-style-image: url("chrome://browser/skin/sync-notification-24.png"); - -moz-margin-end: 10px; - vertical-align: middle; } - -.panel-promo-closebutton { - -moz-appearance: none; - height: 16px; - width: 16px; } - -.panel-promo-closebutton > .toolbarbutton-text { - padding: 0; } - /* Content area */ #sidebar { background-color: Window; } @@ -2621,7 +2637,7 @@ lwtHeader;*/ font-weight: bold; } .alltabs-item[busy] > .menu-iconic-left > .menu-iconic-icon { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); } + list-style-image: url("chrome://global/skin/icons/loading.png"); } .alltabs-item[tabIsVisible] { /* box-shadow instead of background-color to work around native styling */ @@ -2641,7 +2657,7 @@ menuitem:hover > hbox > .alltabs-endimage[soundplaying] { /* Sidebar */ #sidebar-throbber[loading="true"] { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); + list-style-image: url("chrome://global/skin/icons/loading.png"); -moz-margin-end: 4px; } toolbarbutton.chevron { @@ -2813,7 +2829,7 @@ html|*#fullscreen-exit-button { color: #fff; border: 1px solid #111; border-radius: 2px; - padding: 5px; + padding: 0 5px; width: 200px; margin: 0; } @@ -2921,15 +2937,12 @@ html|*#fullscreen-exit-button { margin-left: 0; } .devtools-responsiveui-close { - list-style-image: url("chrome://devtools/skin/images/close.png"); } + list-style-image: url("chrome://devtools/skin/images/close.svg"); } .devtools-responsiveui-rotate { list-style-image: url("chrome://devtools/skin/images/responsivemode/responsiveui-rotate.png"); } @media (min-resolution: 1.1dppx) { - .devtools-responsiveui-close { - list-style-image: url("chrome://devtools/skin/images/close@2x.png"); } - .devtools-responsiveui-rotate { list-style-image: url("chrome://devtools/skin/images/responsivemode/responsiveui-rotate@2x.png"); } } .devtools-responsiveui-touch { @@ -3396,7 +3409,7 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton:not(:h min-width: 18px; min-height: 18px; } -#TabsToolbar #downloads-button[cui-areatype="toolbar"] > #downloads-indicator-anchor > #downloads-indicator-icon { +#TabsToolbar #downloads-button[cui-areatype="toolbar"]:not([attention="success"]) > #downloads-indicator-anchor > #downloads-indicator-icon { background: -moz-image-rect(url("chrome://browser/skin/custom_images/light/tabbar-icons.svg"), 0, 198, 18, 180) center no-repeat; } #downloads-button[cui-areatype="toolbar"]:not([disabled=true]):-moz-any([open], [checked], :hover:active) > #downloads-indicator-anchor > #downloads-indicator-icon, @@ -3404,12 +3417,32 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton:not(:h #nav-bar #downloads-button[cui-areatype="toolbar"]:not([disabled=true]):-moz-any([open], [checked], :hover:active) > #downloads-indicator-anchor > #downloads-indicator-icon { background: -moz-image-rect(url("chrome://browser/skin/custom_images/toolbar-icons-active.svg"), 0, 198, 18, 180) center no-repeat; } -#downloads-button[cui-areatype="toolbar"][attention] > #downloads-indicator-anchor > #downloads-indicator-icon, -#nav-bar #downloads-button[cui-areatype="toolbar"][attention] > #downloads-indicator-anchor > #downloads-indicator-icon, -#TabsToolbar #downloads-button[cui-areatype="toolbar"][attention] > #downloads-indicator-anchor > #downloads-indicator-icon { +#downloads-button[cui-areatype="toolbar"][attention="warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, +#downloads-button[cui-areatype="toolbar"][attention="severe"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { + display: -moz-box; + height: 13px; + width: 13px; + background-size: contain; + border: none; + box-shadow: none; + filter: drop-shadow(0 1px 0 rgba(13, 27, 38, 0.15)); } + +#downloads-button[cui-areatype="toolbar"][attention="severe"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { + background: #D90000 url(chrome://browser/skin/update-badge-failed.svg) no-repeat center; } + +#downloads-button[cui-areatype="toolbar"][attention="warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { + background: #FFBF00 url(chrome://browser/skin/update-badge-failed.svg) no-repeat center; } + +#downloads-button[cui-areatype="toolbar"][attention="severe"] > .toolbarbutton-badge-stack > .toolbarbutton-badge:-moz-window-inactive, +#downloads-button[cui-areatype="toolbar"][attention="warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge:-moz-window-inactive { + filter: none; } + +#downloads-button[cui-areatype="toolbar"][attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon, +#nav-bar #downloads-button[cui-areatype="toolbar"][attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon, +#TabsToolbar #downloads-button[cui-areatype="toolbar"][attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon { background-image: -moz-image-rect(url("chrome://browser/skin/custom_images/light/toolbar-icons.svg"), 18, 198, 36, 180); } -#downloads-button[cui-areatype="menu-panel"][attention] { +#downloads-button[cui-areatype="menu-panel"][attention="success"] { list-style-image: url("chrome://browser/skin/downloads/download-glow-menuPanel.png"); -moz-image-region: auto; } @@ -3419,7 +3452,7 @@ notification.pluginVulnerable > .notification-inner > .messageCloseButton:not(:h background: -moz-image-rect(url("chrome://browser/skin/Toolbar-small.png"), 0, 16, 16, 0) center no-repeat; background-size: 12px; } -#downloads-button:not([counter])[attention] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { +#downloads-button:not([counter])[attention="success"] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { background-image: -moz-image-rect(url("chrome://browser/skin/custom_images/light/toolbar-icons.svg"), 18, 198, 36, 180); } /*** Download notifications ***/ @@ -3595,7 +3628,7 @@ toolbar[brighttext] #downloads-indicator-counter { display: none; } #social-sidebar-button[loading="true"] { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); } + list-style-image: url("chrome://global/skin/icons/loading.png"); } #social-sidebar-favico { max-height: 16px; @@ -3973,6 +4006,13 @@ toolbarpaletteitem[place="toolbar"] { #customization-palette:not([hidden]) { margin-bottom: 25px; } +toolbarpaletteitem[place="palette"]:-moz-focusring, +toolbarpaletteitem[place="panel"]:-moz-focusring, +toolbarpaletteitem[place="toolbar"]:-moz-focusring { + outline: 1px dotted rgba(0, 0, 0, 0.5); + outline-offset: -5px; + -moz-outline-radius: 2.5px; } + #wrapper-edit-controls[place="palette"] > #edit-controls > toolbarbutton, #wrapper-edit-controls[place="palette"] > #edit-controls > separator, #wrapper-zoom-controls[place="palette"] > #zoom-controls > toolbarbutton, @@ -4225,19 +4265,16 @@ toolbarpaletteitem[place="toolbar"] { min-width: 32px; } #UITourTooltipBody { - -moz-margin-end: 14px; } - -#UITourTooltipBody > vbox { - padding-top: 4px; } + -moz-box-align: start; } -#UITourTooltipIconContainer { - -moz-margin-start: -16px; } +#UITourtooltipTitleContainer { + -moz-box-align: start; + margin-bottom: 10px; } #UITourTooltipIcon { width: 48px; height: 48px; - -moz-margin-start: 28px; - -moz-margin-end: 28px; } + -moz-margin-end: 10px; } #UITourTooltipTitle, #UITourTooltipDescription { @@ -4246,9 +4283,7 @@ toolbarpaletteitem[place="toolbar"] { #UITourTooltipTitle { font-size: 1.45rem; font-weight: bold; - -moz-margin-start: 0; - -moz-margin-end: 0; - margin: 0 0 9px 0; } + margin: 0; } #UITourTooltipDescription { -moz-margin-start: 0; @@ -4259,6 +4294,7 @@ toolbarpaletteitem[place="toolbar"] { /* Override global.css */ } #UITourTooltipClose { + position: relative; -moz-appearance: none; border: none; background-color: transparent; @@ -4273,8 +4309,8 @@ toolbarpaletteitem[place="toolbar"] { -moz-box-pack: end; background-color: rgba(24, 26, 27, 0.07); border-top: 1px solid rgba(24, 26, 27, 0.14); - margin: 24px -16px -16px; - padding: 2em 15px; } + margin: 10px -16px -16px; + padding: 16px; } #UITourTooltipButtons > label, #UITourTooltipButtons > button { @@ -4284,6 +4320,10 @@ toolbarpaletteitem[place="toolbar"] { #UITourTooltipButtons > button:first-child { -moz-margin-start: 0; } +#UITourTooltipButtons > label:last-child, +#UITourTooltipButtons > button:last-child { + margin-inline-end: 0; } + #UITourTooltipButtons > button[image] > .button-box > .button-icon { width: 16px; height: 16px; @@ -4446,7 +4486,12 @@ notification.heartbeat { height: 16px; width: 16px; } +/** + * Override the --panel-arrowcontent-padding so the background extends + * to the sides and bottom of the panel. + */ #UITourTooltipButtons { + margin-left: -10px; margin-bottom: -10px; } #context-navigation > .menuitem-iconic { diff --git a/arc-firefox-theme/chrome/browser/searchbar.css b/arc-firefox-theme/chrome/browser/searchbar.css index 67eaa5c..3b2c2df 100644 --- a/arc-firefox-theme/chrome/browser/searchbar.css +++ b/arc-firefox-theme/chrome/browser/searchbar.css @@ -96,7 +96,7 @@ menuitem[cmd="cmd_clearhistory"][disabled] { font-weight: normal; border-top: 1px solid rgba(0, 0, 0, 0.2); padding: 3px 5px; - color: MenuText; + color: GrayText; } .search-panel-header > label { @@ -163,6 +163,8 @@ menuitem[cmd="cmd_clearhistory"][disabled] { .addengine-item { -moz-appearance: none; + background-color: transparent; + color: inherit; border: none; height: 32px; margin: 0; @@ -227,7 +229,6 @@ menuitem[cmd="cmd_clearhistory"][disabled] { .search-setting-button { -moz-appearance: none; - background-color: Menu; border: none; border-top: 1px solid rgba(0, 0, 0, 0.2); margin: 0; diff --git a/arc-firefox-theme/chrome/browser/syncCommon.css b/arc-firefox-theme/chrome/browser/syncCommon.css index 9a84ceb..0449a59 100644 --- a/arc-firefox-theme/chrome/browser/syncCommon.css +++ b/arc-firefox-theme/chrome/browser/syncCommon.css @@ -14,7 +14,7 @@ } .statusIcon[status="active"] { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); + list-style-image: url("chrome://global/skin/icons/loading.png"); } .statusIcon[status="error"] { diff --git a/arc-firefox-theme/chrome/browser/syncSetup.css b/arc-firefox-theme/chrome/browser/syncSetup.css index 4c6518a..3370718 100644 --- a/arc-firefox-theme/chrome/browser/syncSetup.css +++ b/arc-firefox-theme/chrome/browser/syncSetup.css @@ -112,9 +112,15 @@ description > .text-link:focus { width: 0.5em; } +#pairDeviceThrobber, +#login-throbber { + -moz-box-align: center; +} + #pairDeviceThrobber > image, #login-throbber > image { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); + width: 16px; + list-style-image: url("chrome://global/skin/icons/loading.png"); } #captchaFeedback { diff --git a/arc-firefox-theme/chrome/browser/syncedtabs/sidebar.css b/arc-firefox-theme/chrome/browser/syncedtabs/sidebar.css index 2311d6f..63d5b64 100644 --- a/arc-firefox-theme/chrome/browser/syncedtabs/sidebar.css +++ b/arc-firefox-theme/chrome/browser/syncedtabs/sidebar.css @@ -5,16 +5,36 @@ /* These styles are intended to mimic XUL trees and the XUL search box. */ -:root, body { - overflow-x: hidden; +html { + height: 100%; } body { + height: 100%; margin: 0; font: message-box; color: #333333; -moz-user-select: none; - overflow: hidden; +} + +/* The content-container holds the non-scrollable header and the scrollable + content area. +*/ +.content-container { + display: flex; + flex-flow: column; + height: 100%; +} + +/* The content header is not scrollable */ +.content-header { + flex: 0 1 auto; +} + +/* The main content area is scrollable and fills the rest of the area */ +.content-scrollable { + flex: 1 1 auto; + overflow: auto; } .emptyListInfo { @@ -65,10 +85,21 @@ body { .client .item.tab > .item-title-container { padding-inline-start: 35px; } + .item.tab > .item-title-container { padding-inline-start: 20px; } +.item.tab > .item-title-container > .item-icon-container { + background-image: url("chrome://mozapps/skin/places/defaultFavicon.png"); +} + +@media (min-resolution: 1.1dppx) { +.item.tab > .item-title-container > .item-icon-container { + background-image: url("chrome://mozapps/skin/places/defaultFavicon@2x.png"); + } +} + .item-icon-container { min-width: 16px; max-width: 16px; @@ -169,6 +200,10 @@ body { opacity: 100; } +.sidebar-search-container.tabs-container:not(.selected) { + display: none; +} + .textbox-search-clear:not([disabled]) { cursor: default; } diff --git a/arc-firefox-theme/chrome/browser/tabbrowser/loading.png b/arc-firefox-theme/chrome/browser/tabbrowser/loading.png deleted file mode 100644 index a2f9b79..0000000 Binary files a/arc-firefox-theme/chrome/browser/tabbrowser/loading.png and /dev/null differ diff --git a/arc-firefox-theme/chrome/browser/tabbrowser/newtab-inverted.svg b/arc-firefox-theme/chrome/browser/tabbrowser/newtab-inverted.svg new file mode 100644 index 0000000..2728cda --- /dev/null +++ b/arc-firefox-theme/chrome/browser/tabbrowser/newtab-inverted.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + diff --git a/arc-firefox-theme/chrome/browser/tabbrowser/newtab.svg b/arc-firefox-theme/chrome/browser/tabbrowser/newtab.svg new file mode 100644 index 0000000..40548da --- /dev/null +++ b/arc-firefox-theme/chrome/browser/tabbrowser/newtab.svg @@ -0,0 +1,7 @@ + + + + + diff --git a/arc-firefox-theme/chrome/browser/tabbrowser/tab-selected-end.svg b/arc-firefox-theme/chrome/browser/tabbrowser/tab-selected-end.svg index 75d70c9..319c519 100644 --- a/arc-firefox-theme/chrome/browser/tabbrowser/tab-selected-end.svg +++ b/arc-firefox-theme/chrome/browser/tabbrowser/tab-selected-end.svg @@ -29,10 +29,6 @@ - - - -
diff --git a/arc-firefox-theme/chrome/browser/tabbrowser/tab-selected-start.svg b/arc-firefox-theme/chrome/browser/tabbrowser/tab-selected-start.svg index 66d75dd..8887dd0 100644 --- a/arc-firefox-theme/chrome/browser/tabbrowser/tab-selected-start.svg +++ b/arc-firefox-theme/chrome/browser/tabbrowser/tab-selected-start.svg @@ -29,10 +29,6 @@ - - - -
diff --git a/arc-firefox-theme/chrome/browser/urlbar-star.svg b/arc-firefox-theme/chrome/browser/urlbar-star.svg new file mode 100644 index 0000000..3080aca --- /dev/null +++ b/arc-firefox-theme/chrome/browser/urlbar-star.svg @@ -0,0 +1,20 @@ + + + + + + + + diff --git a/arc-firefox-theme/chrome/browser/urlbar-tab.svg b/arc-firefox-theme/chrome/browser/urlbar-tab.svg new file mode 100644 index 0000000..87a2c7f --- /dev/null +++ b/arc-firefox-theme/chrome/browser/urlbar-tab.svg @@ -0,0 +1,21 @@ + + + + + + + + + diff --git a/arc-firefox-theme/chrome/browser/web-notifications-icon.svg b/arc-firefox-theme/chrome/browser/web-notifications-icon.svg index f7186c7..8c03565 100644 --- a/arc-firefox-theme/chrome/browser/web-notifications-icon.svg +++ b/arc-firefox-theme/chrome/browser/web-notifications-icon.svg @@ -1,15 +1,6 @@ - - - - - - + + diff --git a/arc-firefox-theme/chrome/browser/web-notifications-tray.svg b/arc-firefox-theme/chrome/browser/web-notifications-tray.svg index 314026a..9c47315 100644 --- a/arc-firefox-theme/chrome/browser/web-notifications-tray.svg +++ b/arc-firefox-theme/chrome/browser/web-notifications-tray.svg @@ -2,11 +2,11 @@ - + - + - - - + + + diff --git a/arc-firefox-theme/chrome/global/aboutSupport.css b/arc-firefox-theme/chrome/global/aboutSupport.css index 61f5305..590c190 100644 --- a/arc-firefox-theme/chrome/global/aboutSupport.css +++ b/arc-firefox-theme/chrome/global/aboutSupport.css @@ -53,6 +53,12 @@ th { color: var(--in-content-selected-text); } +th.title-column { + white-space: nowrap; + width: 0px; + font-size: medium; +} + th.column { white-space: nowrap; width: 0px; diff --git a/arc-firefox-theme/chrome/global/autocomplete.css b/arc-firefox-theme/chrome/global/autocomplete.css index fffa2b1..9d1616b 100644 --- a/arc-firefox-theme/chrome/global/autocomplete.css +++ b/arc-firefox-theme/chrome/global/autocomplete.css @@ -54,7 +54,9 @@ panel[type="autocomplete-richlistbox"], -moz-border-bottom-colors: ThreeDDarkShadow; -moz-border-left-colors: ThreeDDarkShadow; padding: 0; + color: -moz-FieldText; background-color: -moz-Field; + -moz-appearance: none; } .autocomplete-history-popup { @@ -67,7 +69,6 @@ panel[type="autocomplete-richlistbox"], -moz-appearance: none !important; border: none !important; background-color: transparent !important; - color: MenuText; } .autocomplete-treecol { @@ -107,96 +108,78 @@ treechildren.autocomplete-treebody::-moz-tree-cell-text(selected) { background-color: transparent; } -.autocomplete-richlistitem[selected="true"] { - background-color: Highlight; +.autocomplete-richlistitem[selected] { color: HighlightText; } -.autocomplete-richlistitem { - padding: 6px 2px; - color: MenuText; -} - -.ac-url-box { - /* When setting a vertical margin here, half of that needs to be added - .ac-title-box's translateY for when .ac-url-box is hidden (see below). */ - margin-top: 1px; -} - -.autocomplete-richlistitem[actiontype="keyword"] .ac-url-box, -.autocomplete-richlistitem[actiontype="searchengine"] .ac-url-box, -.autocomplete-richlistitem[actiontype="visiturl"] .ac-url-box, -.autocomplete-richlistitem[type~="autofill"] .ac-url-box { - visibility: hidden; -} - -.autocomplete-richlistitem[actiontype="keyword"] .ac-title-box, -.autocomplete-richlistitem[actiontype="searchengine"] .ac-title-box, -.autocomplete-richlistitem[actiontype="visiturl"] .ac-title-box, -.autocomplete-richlistitem[type~="autofill"] .ac-title-box { - /* Center the title by moving it down by half of .ac-url-box's height, - including vertical margins (if any). */ - transform: translateY(.5em); -} - -.ac-site-icon { - width: 16px; +.ac-type-icon { + width: 16px; height: 16px; - margin-bottom: -2px; - -moz-margin-start: 3px; + max-width: 16px; + max-height: 16px; + -moz-margin-start: 13px; -moz-margin-end: 6px; } -.ac-type-icon { - width: 16px; +.ac-site-icon { + width: 16px; height: 16px; - -moz-margin-start: 6px; - -moz-margin-end: 4px; + max-width: 16px; + max-height: 16px; + -moz-margin-start: 0; + -moz-margin-end: 11px; + list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png"); } -.ac-extra > .ac-result-type-tag { - margin: 0 4px; +.ac-site-icon[selected] { + list-style-image: url("chrome://mozapps/skin/places/defaultFavicon-inverted.png"); } -.ac-extra > .ac-comment { - padding-right: 4px; +@media (min-resolution: 1.1dppx) { + .ac-site-icon { + list-style-image: url("chrome://mozapps/skin/places/defaultFavicon@2x.png"); + } + .ac-site-icon[selected] { + list-style-image: url("chrome://mozapps/skin/places/defaultFavicon-inverted@2x.png"); + } } -.ac-ellipsis-after { - margin: 0 !important; - padding: 0; - min-width: 1em; +.ac-title { + -moz-margin-start: 0; + -moz-margin-end: 6px; } -.ac-normal-text { - margin: 0 !important; - padding: 0; +html|span.ac-tag { + -moz-margin-start: 0; + -moz-margin-end: 2px; } -.ac-normal-text > html|span { - margin: 0 !important; - padding: 0; -} - -html|span.ac-emphasize-text { - box-shadow: inset 0 0 1px 1px rgba(0,0,0,0.1); - background-color: rgba(0,0,0,0.05); - border-radius: 2px; - text-shadow: 0 0 currentColor; /*faux bold effect*/ +.ac-tags { + -moz-margin-start: 0; + -moz-margin-end: 4px; } -.ac-url-text > html|span.ac-emphasize-text, -.ac-action-text > html|span.ac-emphasize-text { - box-shadow: none; +.ac-separator { + -moz-margin-start: 0; + -moz-margin-end: 6px; } -.ac-normal-text[selected="true"] > html|span.ac-emphasize-text { - box-shadow: inset 0 0 1px 1px rgba(255,255,255,0.3); - background-color: rgba(255,255,255,0.2); +/* Better align the URL/action with the title. */ +.ac-tags, +.ac-separator, +.ac-url, +.ac-action { + margin-bottom: -2px; } -.ac-title, .ac-url { - overflow: hidden; +.ac-title-text, +.ac-tags-text, +.ac-separator-text, +.ac-url-text, +.ac-action-text, +.ac-text-overflow-container { + padding: 0 !important; + margin: 0 !important; } /* ::::: textboxes inside toolbarpaletteitems ::::: */ diff --git a/arc-firefox-theme/chrome/global/findBar.css b/arc-firefox-theme/chrome/global/findBar.css index e70d929..82a9ab7 100644 --- a/arc-firefox-theme/chrome/global/findBar.css +++ b/arc-firefox-theme/chrome/global/findBar.css @@ -156,5 +156,5 @@ findbar[noanim] { } .find-status-icon[status="pending"] { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); + list-style-image: url("chrome://global/skin/icons/loading.png"); } diff --git a/arc-firefox-theme/chrome/global/icons/blocked.svg b/arc-firefox-theme/chrome/global/icons/blocked.svg new file mode 100644 index 0000000..2f1c641 --- /dev/null +++ b/arc-firefox-theme/chrome/global/icons/blocked.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/arc-firefox-theme/chrome/global/icons/loading.png b/arc-firefox-theme/chrome/global/icons/loading.png new file mode 100644 index 0000000..a2f9b79 Binary files /dev/null and b/arc-firefox-theme/chrome/global/icons/loading.png differ diff --git a/arc-firefox-theme/chrome/global/icons/loading_16.png b/arc-firefox-theme/chrome/global/icons/loading_16.png deleted file mode 100644 index 7108ea3..0000000 Binary files a/arc-firefox-theme/chrome/global/icons/loading_16.png and /dev/null differ diff --git a/arc-firefox-theme/chrome/global/icons/webapps-16.png b/arc-firefox-theme/chrome/global/icons/webapps-16.png deleted file mode 100644 index df3978c..0000000 Binary files a/arc-firefox-theme/chrome/global/icons/webapps-16.png and /dev/null differ diff --git a/arc-firefox-theme/chrome/global/icons/webapps-64.png b/arc-firefox-theme/chrome/global/icons/webapps-64.png deleted file mode 100644 index 7c5e48c..0000000 Binary files a/arc-firefox-theme/chrome/global/icons/webapps-64.png and /dev/null differ diff --git a/arc-firefox-theme/chrome/global/in-content/common.css b/arc-firefox-theme/chrome/global/in-content/common.css index 414a9c1..78f429c 100644 --- a/arc-firefox-theme/chrome/global/in-content/common.css +++ b/arc-firefox-theme/chrome/global/in-content/common.css @@ -104,7 +104,7 @@ xul|groupbox { font-size: 1.25rem; } -xul|groupbox xul|label, +xul|groupbox xul|label:not(.menu-accel):not(.menu-text), xul|groupbox xul|description { /* !important needed to override toolkit !important rule */ -moz-margin-start: 0 !important; @@ -739,6 +739,10 @@ xul|treecols { padding: 0; } +.autocomplete-tree > xul|treecols { + border-bottom: none !important; +} + xul|treecol:not([hideheader="true"]), xul|treecolpicker { -moz-appearance: none; diff --git a/arc-firefox-theme/chrome/global/passwordmgr.css b/arc-firefox-theme/chrome/global/passwordmgr.css index b3c7b59..9cb48d1 100644 --- a/arc-firefox-theme/chrome/global/passwordmgr.css +++ b/arc-firefox-theme/chrome/global/passwordmgr.css @@ -11,3 +11,16 @@ .actionButtons { margin: 0px 3px 6px 3px !important; } + +treechildren::-moz-tree-image(siteCol) { + list-style-image: url(chrome://mozapps/skin/places/defaultFavicon.png); + width: 16px; + height: 16px; + -moz-margin-end: 5px; +} + +@media (min-resolution: 1.1dppx) { + treechildren::-moz-tree-image(siteCol) { + list-style-image: url(chrome://mozapps/skin/places/defaultFavicon@2x.png); + } +} diff --git a/arc-firefox-theme/chrome/global/scrollbars.css b/arc-firefox-theme/chrome/global/scrollbars.css index e05aabc..6d8f1c8 100644 --- a/arc-firefox-theme/chrome/global/scrollbars.css +++ b/arc-firefox-theme/chrome/global/scrollbars.css @@ -16,7 +16,6 @@ scrollbar { -moz-binding: url("chrome://global/content/bindings/scrollbar.xml#scrollbar"); cursor: default; background: url("chrome://global/skin/scrollbar/slider.gif") scrollbar; - pointer-events: auto; } @media all and (-moz-overlay-scrollbars) { diff --git a/arc-firefox-theme/chrome/mozapps/extensions/extensions.css b/arc-firefox-theme/chrome/mozapps/extensions/extensions.css index 333d393..226278b 100644 --- a/arc-firefox-theme/chrome/mozapps/extensions/extensions.css +++ b/arc-firefox-theme/chrome/mozapps/extensions/extensions.css @@ -129,11 +129,18 @@ } .loading { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); + list-style-image: url("chrome://global/skin/icons/loading.png"); padding-left: 20px; padding-right: 20px; } +@media (min-resolution: 1.1dppx) { + .loading > image { + width: 16px; + list-style-image: url("chrome://global/skin/icons/loading@2x.png"); + } +} + button.warning { list-style-image: url("chrome://mozapps/skin/extensions/alerticon-warning.svg"); } @@ -441,7 +448,7 @@ button.warning { } .name-container { - font-size: 150%; + font-size: 1.3rem; font-weight: bold; -moz-box-align: end; -moz-box-flex: 1; @@ -454,6 +461,7 @@ button.warning { .description-container { -moz-margin-start: 6px; -moz-box-align: center; + font-size: 1.25rem; } .description { @@ -656,7 +664,7 @@ button.warning { .detail-view-container { -moz-padding-end: 2em; padding-bottom: 2em; - font-size: 110%; + font-size: 1.25rem; color: #333; } @@ -687,31 +695,38 @@ button.warning { } #detail-name-container { - font-size: 200%; + font-size: 2.5rem; + font-weight: normal; } #detail-screenshot-box { -moz-margin-end: 2em; + background-image: linear-gradient(rgba(255,255,255,.5), transparent); + background-color: white; + box-shadow: 0 1px 2px #666; + border-radius: 2px; } #detail-screenshot { max-width: 300px; max-height: 300px; - background-color: white; - box-shadow: 0 1px 2px #666; } #detail-screenshot[loading] { - background-image: url("chrome://global/skin/icons/loading_16.png"), - linear-gradient(rgba(255, 255, 255, 0.5), transparent); + background-image: url("chrome://global/skin/icons/loading.png"); background-position: 50% 50%; background-repeat: no-repeat; - border-radius: 2px; +} + +@media (min-resolution: 1.1dppx) { + #detail-screenshot[loading] { + background-image: url("chrome://global/skin/icons/loading@2x.png"); + background-size: 16px; + } } #detail-screenshot[loading="error"] { - background-image: url("chrome://global/skin/media/error.png"), - linear-gradient(rgba(255, 255, 255, 0.5), transparent); + background-image: url("chrome://global/skin/media/error.png"); } #detail-desc-container { @@ -793,7 +808,6 @@ setting { border-top: 1px solid #c1c1c1; -moz-box-align: center; min-height: 35px; - font-size: 1.25rem; line-height: 20px; text-shadow: 0 1px 1px #fefffe; } @@ -802,6 +816,7 @@ setting { margin-bottom: 1em; } +.inline-options-browser, setting[first-row="true"] { margin-top: 2em; } diff --git a/arc-firefox-theme/chrome/mozapps/extensions/update.css b/arc-firefox-theme/chrome/mozapps/extensions/update.css index d35438a..bda89ca 100644 --- a/arc-firefox-theme/chrome/mozapps/extensions/update.css +++ b/arc-firefox-theme/chrome/mozapps/extensions/update.css @@ -7,7 +7,7 @@ } .throbber { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); + list-style-image: url("chrome://global/skin/icons/loading.png"); width: 16px; height: 16px; margin-top: 5px; @@ -16,6 +16,12 @@ -moz-margin-end: 2px; } +@media (min-resolution: 1.1dppx) { + .throbber { + list-style-image: url("chrome://global/skin/icons/loading@2x.png"); + } +} + .alertBox { background-color: InfoBackground; color: InfoText; diff --git a/arc-firefox-theme/chrome/mozapps/places/defaultFavicon-inverted.png b/arc-firefox-theme/chrome/mozapps/places/defaultFavicon-inverted.png new file mode 100644 index 0000000..220cc1d Binary files /dev/null and b/arc-firefox-theme/chrome/mozapps/places/defaultFavicon-inverted.png differ diff --git a/arc-firefox-theme/chrome/mozapps/places/defaultFavicon-inverted@2x.png b/arc-firefox-theme/chrome/mozapps/places/defaultFavicon-inverted@2x.png new file mode 100644 index 0000000..b1b3571 Binary files /dev/null and b/arc-firefox-theme/chrome/mozapps/places/defaultFavicon-inverted@2x.png differ diff --git a/arc-firefox-theme/chrome/mozapps/plugins/pluginProblem.css b/arc-firefox-theme/chrome/mozapps/plugins/pluginProblem.css index 100c5fc..43c9649 100644 --- a/arc-firefox-theme/chrome/mozapps/plugins/pluginProblem.css +++ b/arc-firefox-theme/chrome/mozapps/plugins/pluginProblem.css @@ -91,10 +91,17 @@ html|a { .throbber { padding-left: 16px; /* width of the background image */ - background: url(chrome://global/skin/icons/loading_16.png) no-repeat; + background: url(chrome://global/skin/icons/loading.png) no-repeat; margin-left: 5px; } +@media (min-resolution: 1.1dppx) { + .throbber { + background-image: url(chrome://global/skin/icons/loading@2x.png); + background-size: 16px; + } +} + .msgTapToPlay, .msgClickToPlay { text-decoration: underline; diff --git a/arc-firefox-theme/chrome/mozapps/update/updates.css b/arc-firefox-theme/chrome/mozapps/update/updates.css index d376634..8663f6c 100644 --- a/arc-firefox-theme/chrome/mozapps/update/updates.css +++ b/arc-firefox-theme/chrome/mozapps/update/updates.css @@ -30,7 +30,7 @@ wizardpage { } .remoteLoadingThrobber[state="loading"] { - list-style-image: url("chrome://global/skin/icons/loading_16.png"); + list-style-image: url("chrome://global/skin/icons/loading.png"); } .remoteLoadingThrobber[state="error"] { -- cgit v1.2.3