diff options
author | Horst3180 | 2015-08-21 17:50:24 +0200 |
---|---|---|
committer | Horst3180 | 2015-08-21 17:50:24 +0200 |
commit | c1b1407c9a58e21060e4d09593b02990f6456c25 (patch) | |
tree | c2766a7399187108a423aead852aa4d96a43722c /arc-firefox-theme/chrome/browser/sass | |
parent | dd43717add817a4432aad36a0232c2923a406b05 (diff) | |
download | solarc-firefox-theme-c1b1407c9a58e21060e4d09593b02990f6456c25.tar.gz solarc-firefox-theme-c1b1407c9a58e21060e4d09593b02990f6456c25.tar.xz solarc-firefox-theme-c1b1407c9a58e21060e4d09593b02990f6456c25.zip |
update to 41.0b2
Diffstat (limited to 'arc-firefox-theme/chrome/browser/sass')
4 files changed, 413 insertions, 508 deletions
diff --git a/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss b/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss index 23675f2..358422c 100644 --- a/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss +++ b/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss @@ -37,7 +37,6 @@ $darker_asset_path_2: if($darker=='true', 'dark', $asset_path); --verified-identity-box-backgroundcolor: transparent; } - #menubar-items { -moz-box-orient: vertical; /* for flex hack */ } @@ -1688,7 +1687,7 @@ toolbar[brighttext] #loop-button > .toolbarbutton-badge-container { } //#urlbar { -// background-color: $entry_bg; +// background-color: -moz-field; //} .urlbar-textbox-container { @@ -1742,9 +1741,9 @@ toolbar[brighttext] #loop-button > .toolbarbutton-badge-container { -moz-box-align: center; } -.urlbar-icon { - //padding: 0 3px; -} +//.urlbar-icon { +// padding: 0 3px; +//} #urlbar-search-splitter { -moz-appearance: none; @@ -1752,14 +1751,14 @@ toolbar[brighttext] #loop-button > .toolbarbutton-badge-container { //-moz-margin-start: -4px; } -#urlbar-search-splitter + #search-container > #searchbar > .searchbar-textbox { - //-moz-margin-start: 0; -} +//#urlbar-search-splitter + #search-container > #searchbar > .searchbar-textbox { +// -moz-margin-start: 0; +//} #urlbar-display-box { margin-top: -1px; margin-bottom: -1px; - -moz-border-end: 1px solid red; + -moz-border-end: 1px solid #AAA; -moz-margin-end: 3px; } @@ -1920,21 +1919,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box opacity: 0.3; } -#identity-popup.chromeUI > #identity-popup-container > #identity-popup-icon { - list-style-image: url("chrome://branding/content/icon64.png"); -} - -#identity-popup-brandName { - font-weight: bold; - font-size: 1.25em; - margin-top: .5em; - margin-bottom: .5em; -} - -#identity-popup-content-box { - max-width: 50ch; -} - @media not all and (min-resolution: 1.1dppx) { #page-proxy-favicon { -moz-image-region: rect(0, 16px, 16px, 0); @@ -1988,11 +1972,14 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box #identity-box[open=true] > #page-proxy-favicon { -moz-image-region: rect(0, 96px, 32px, 64px); } +} - #identity-popup.chromeUI > #identity-popup-container > #identity-popup-icon { - list-style-image: url("chrome://branding/content/icon128.png"); - -moz-image-region: rect(0, 128px, 128px, 0); - } +#urlbar[actiontype="searchengine"] > #identity-box > #page-proxy-favicon { + -moz-image-region: inherit; + list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon); + width: 16px; + height: 16px; + opacity: 1; } #page-proxy-favicon { @@ -2002,129 +1989,48 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box -moz-margin-end: 1px; } -/* Identity popup icons */ -#identity-popup-icon { - height: 64px; - width: 64px; - padding: 0; - list-style-image: url("chrome://browser/skin/identity.png"); - -moz-image-region: rect(0px, 64px, 64px, 0px); -} - -#identity-popup.verifiedDomain > #identity-popup-container > #identity-popup-icon { - -moz-image-region: rect(64px, 64px, 128px, 0px); -} - -#identity-popup.verifiedIdentity > #identity-popup-container > #identity-popup-icon { - -moz-image-region: rect(128px, 64px, 192px, 0px); -} - -/* Identity popup body text */ -.identity-popup-description { - white-space: pre-wrap; - -moz-padding-start: 15px; - margin: 2px 0 4px; -} - -.identity-popup-label { - white-space: pre-wrap; - -moz-padding-start: 15px; - margin: 0; -} - -#identity-popup-content-host , -#identity-popup-content-owner { - font-weight: bold; - max-width: 300px; -} - -#identity-popup-content-host , -#identity-popup-content-box.verifiedIdentity > #identity-popup-content-owner { - font-size: 140%; -} - -#identity-popup-content-owner { - margin-bottom: 0 !important; -} - -#identity-popup-content-verifier { - margin: 4px 0 2px; -} - -#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption , -#identity-popup-content-box.verifiedDomain > #identity-popup-encryption { - margin-top: 10px; - -moz-margin-start: -18px; -} - -#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption > vbox > #identity-popup-encryption-icon , -#identity-popup-content-box.verifiedDomain > #identity-popup-encryption > vbox > #identity-popup-encryption-icon { - list-style-image: url("chrome://browser/skin/Secure.png"); -} - -#identity-popup-help-icon { - -moz-appearance: none; - margin-left: 0px; - border: none; - background: none; - min-width: 0; - list-style-image: url("moz-icon://stock/gtk-dialog-question?size=16"); - cursor: pointer; -} -#identity-popup-help-icon > .button-box > .button-text { - display: none; +.popup-notification-icon { + width: 64px; + height: 64px; + -moz-margin-end: 10px; } -#identity-popup-help-icon > .button-box > .button-icon { - height: 16px; - width: 16px; +.popup-notification-icon[popupid="geolocation"] { + list-style-image: url(chrome://browser/skin/Geolocation-64.png); } -#identity-popup-help-icon:-moz-focusring { - outline: 1px dotted; - outline-offset: 1px; +.popup-notification-icon[popupid="push"] { + list-style-image: url(chrome://browser/skin/Push-64.png); } -#identity-popup > .panel-arrowcontainer > .panel-arrowcontent { - padding: 0; +.popup-notification-icon[popupid="xpinstall-disabled"], +.popup-notification-icon[popupid="addon-install-blocked"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-blocked.svg); } -#identity-popup-container { - min-width: 280px; - padding: 10px; +.popup-notification-icon[popupid="addon-progress"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-downloading.svg); } -#identity-popup-button-container { - background: linear-gradient(to bottom, rgba(0,0,0,0.04) 60%, transparent); - padding: 10px; - margin-top: 5px; +.popup-notification-icon[popupid="addon-install-failed"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-error.svg); } - -.popup-notification-icon { - width: 64px; - height: 64px; - -moz-margin-end: 10px; +.popup-notification-icon[popupid="addon-install-confirmation"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-confirm.svg); } -.popup-notification-icon[popupid="geolocation"] { - list-style-image: url(chrome://browser/skin/Geolocation-64.png); +#addon-install-confirmation-notification[warning] .popup-notification-icon[popupid="addon-install-confirmation"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-warning.svg); } -.popup-notification-icon[popupid="push"] { - list-style-image: url(chrome://browser/skin/Push-64.png); +.popup-notification-icon[popupid="addon-install-complete"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-installed.svg); } -.popup-notification-icon[popupid="xpinstall-disabled"], -.popup-notification-icon[popupid="addon-progress"], -.popup-notification-icon[popupid="addon-install-blocked"], -.popup-notification-icon[popupid="addon-install-failed"], -.popup-notification-icon[popupid="addon-install-confirmation"], -.popup-notification-icon[popupid="addon-install-complete"] { - list-style-image: url(chrome://mozapps/skin/extensions/extensionGeneric.png); - width: 32px; - height: 32px; +.popup-notification-icon[popupid="addon-install-restart"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-restart.svg); } .popup-notification-icon[popupid="click-to-play-plugins"] { @@ -2222,7 +2128,15 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box } #addons-notification-icon { - list-style-image: url(chrome://mozapps/skin/extensions/extensionGeneric-16.png); + list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg#default); +} + +#addons-notification-icon:hover { + list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg#hover); +} + +#addons-notification-icon:hover:active { + list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg#active); } .indexedDB-notification-icon, @@ -2234,6 +2148,12 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box list-style-image: url(chrome://mozapps/skin/passwordmgr/key-16.png); } +#login-fill-notification-icon { + /* Temporary icon until the capture and fill doorhangers are unified. */ + 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); @@ -2457,10 +2377,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box list-style-image: url(moz-icon://stock/gtk-dialog-question?size=16); } -#pointerLock-cancel { - margin: 0px; -} - /* Translation infobar */ notification[value="translation"] .messageImage { @@ -2719,12 +2635,10 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- } #urlbar-reload-button:not([disabled]):hover { - background-image: radial-gradient(circle closest-side, hsla(200,100%,70%,.2), transparent); -moz-image-region: rect(14px, 14px, 28px, 0); } #urlbar-reload-button:not([disabled]):hover:active { - background-image: radial-gradient(circle closest-side, hsla(200,100%,60%,.1), transparent); -moz-image-region: rect(28px, 14px, 42px, 0); } @@ -2737,12 +2651,10 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- } #urlbar-go-button:hover { - background-image: radial-gradient(circle closest-side, hsla(110,70%,50%,.2), transparent); -moz-image-region: rect(14px, 42px, 28px, 28px); } #urlbar-go-button:hover:active { - background-image: radial-gradient(circle closest-side, hsla(110,70%,50%,.1), transparent); -moz-image-region: rect(28px, 42px, 42px, 28px); } @@ -2755,12 +2667,10 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- } #urlbar-stop-button:not([disabled]):hover { - background-image: radial-gradient(circle closest-side, hsla(5,100%,75%,.3), transparent); -moz-image-region: rect(14px, 28px, 28px, 14px); } #urlbar-stop-button:hover:active { - background-image: radial-gradient(circle closest-side, hsla(5,100%,75%,.1), transparent); -moz-image-region: rect(28px, 28px, 42px, 14px); } @@ -4416,6 +4326,41 @@ notification.pluginVulnerable .messageImage { .popup-notification-footer[popupid="bad-content"] { padding-top: 1em; } +#notification-popup[popupid="login-fill"] > .panel-arrowcontainer > .panel-arrowcontent { + /* Since we display a sliding subview that extends to the border, we cannot + * keep the default padding of arrow panels. We use the same padding in the + * individual content views instead. Since we removed the padding, we also + * have to ensure the contents are clipped to the border box. */ + padding: 0; + overflow: hidden; +} + +#login-fill-mainview, +#login-fill-details { + padding: var(--panel-arrowcontent-padding); +} + +#login-fill-doorhanger[inDetailView] > #login-fill-mainview { + transform: translateX(-14px); +} + +#login-fill-mainview, +#login-fill-details { + transition: transform 150ms; +} + +#login-fill-doorhanger:not([inDetailView]) > #login-fill-details { + transform: translateX(105%); +} + +#login-fill-doorhanger:not([inDetailView]) > #login-fill-details:-moz-locale-dir(rtl) { + transform: translateX(-105%); +} + +#login-fill-doorhanger[inDetailView] > #login-fill-clickcapturer { + background-color: hsla(210,4%,10%,.1); +} + #login-fill-testing { color: #b33; font-weight: bold; @@ -4426,16 +4371,41 @@ notification.pluginVulnerable .messageImage { max-height: 20em; } +.login-fill-item[disabled] { + color: #888; + background-color: #fff; +} + +.login-fill-item[disabled][selected] { + background-color: #eef; +} + .login-hostname { margin: 4px; font-weight: bold; } +.login-fill-item.different-hostname > .login-hostname { + color: #888; + font-style: italic; +} + .login-username { margin: 4px; color: #888; } +#login-fill-details { + padding: 4px; + background: var(--panel-arrowcontent-background); + color: var(--panel-arrowcontent-color); + background-clip: padding-box; + border-left: 1px solid hsla(210,4%,10%,.3); + box-shadow: 0 3px 5px hsla(210,4%,10%,.1), + 0 0 7px hsla(210,4%,10%,.1); + -moz-margin-start: 38px; +} + /* 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/. */ @@ -4642,10 +4612,6 @@ toolbar[brighttext] #downloads-indicator-counter { /* Social toolbar item */ -#social-undoactivation-button { - -moz-margin-start: 0; /* override default label margin to match description margin */ -} - .social-activation-icon { width: auto; height: auto; @@ -4875,7 +4841,6 @@ chatbox[dark=true] > .chat-titlebar > hbox > .chat-title { .chatbar-innerbox { background: transparent; - margin: -285px 0 0; overflow: hidden; } @@ -5842,6 +5807,18 @@ notification.heartbeat { list-style-image: url("chrome://browser/skin/content-contextmenu.svg#bookmark-disabled"); } +#context-bookmarkpage[starred=true] { + list-style-image: url("chrome://browser/skin/content-contextmenu.svg#bookmarked"); +} + +#context-bookmarkpage[starred=true][_moz-menuactive=true] { + list-style-image: url("chrome://browser/skin/content-contextmenu.svg#bookmarked-active"); +} + +#context-bookmarkpage[starred=true][disabled=true] { + list-style-image: url("chrome://browser/skin/content-contextmenu.svg#bookmarked-disabled"); +} + #context-back:-moz-locale-dir(rtl), #context-forward:-moz-locale-dir(rtl), #context-reload:-moz-locale-dir(rtl) { diff --git a/arc-firefox-theme/chrome/browser/sass/browser-dark.css b/arc-firefox-theme/chrome/browser/sass/browser-dark.css index 1a8a7af..63eb7bb 100644 --- a/arc-firefox-theme/chrome/browser/sass/browser-dark.css +++ b/arc-firefox-theme/chrome/browser/sass/browser-dark.css @@ -1313,7 +1313,7 @@ toolbar[brighttext] #loop-button > .toolbarbutton-badge-container { #urlbar-display-box { margin-top: -1px; margin-bottom: -1px; - -moz-border-end: 1px solid red; + -moz-border-end: 1px solid #AAA; -moz-margin-end: 3px; } .urlbar-display { @@ -1413,18 +1413,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box #page-proxy-favicon[pageproxystate="invalid"] { opacity: 0.3; } -#identity-popup.chromeUI > #identity-popup-container > #identity-popup-icon { - list-style-image: url("chrome://branding/content/icon64.png"); } - -#identity-popup-brandName { - font-weight: bold; - font-size: 1.25em; - margin-top: .5em; - margin-bottom: .5em; } - -#identity-popup-content-box { - max-width: 50ch; } - @media not all and (min-resolution: 1.1dppx) { #page-proxy-favicon { -moz-image-region: rect(0, 16px, 16px, 0); } @@ -1463,98 +1451,20 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box #identity-box:hover:active > #page-proxy-favicon, #identity-box[open=true] > #page-proxy-favicon { - -moz-image-region: rect(0, 96px, 32px, 64px); } + -moz-image-region: rect(0, 96px, 32px, 64px); } } +#urlbar[actiontype="searchengine"] > #identity-box > #page-proxy-favicon { + -moz-image-region: inherit; + list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon); + width: 16px; + height: 16px; + opacity: 1; } - #identity-popup.chromeUI > #identity-popup-container > #identity-popup-icon { - list-style-image: url("chrome://branding/content/icon128.png"); - -moz-image-region: rect(0, 128px, 128px, 0); } } #page-proxy-favicon { margin-top: 1px; margin-bottom: 1px; -moz-margin-start: 3px; -moz-margin-end: 1px; } -/* Identity popup icons */ -#identity-popup-icon { - height: 64px; - width: 64px; - padding: 0; - list-style-image: url("chrome://browser/skin/identity.png"); - -moz-image-region: rect(0px, 64px, 64px, 0px); } - -#identity-popup.verifiedDomain > #identity-popup-container > #identity-popup-icon { - -moz-image-region: rect(64px, 64px, 128px, 0px); } - -#identity-popup.verifiedIdentity > #identity-popup-container > #identity-popup-icon { - -moz-image-region: rect(128px, 64px, 192px, 0px); } - -/* Identity popup body text */ -.identity-popup-description { - white-space: pre-wrap; - -moz-padding-start: 15px; - margin: 2px 0 4px; } - -.identity-popup-label { - white-space: pre-wrap; - -moz-padding-start: 15px; - margin: 0; } - -#identity-popup-content-host, -#identity-popup-content-owner { - font-weight: bold; - max-width: 300px; } - -#identity-popup-content-host, -#identity-popup-content-box.verifiedIdentity > #identity-popup-content-owner { - font-size: 140%; } - -#identity-popup-content-owner { - margin-bottom: 0 !important; } - -#identity-popup-content-verifier { - margin: 4px 0 2px; } - -#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption, -#identity-popup-content-box.verifiedDomain > #identity-popup-encryption { - margin-top: 10px; - -moz-margin-start: -18px; } - -#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption > vbox > #identity-popup-encryption-icon, -#identity-popup-content-box.verifiedDomain > #identity-popup-encryption > vbox > #identity-popup-encryption-icon { - list-style-image: url("chrome://browser/skin/Secure.png"); } - -#identity-popup-help-icon { - -moz-appearance: none; - margin-left: 0px; - border: none; - background: none; - min-width: 0; - list-style-image: url("moz-icon://stock/gtk-dialog-question?size=16"); - cursor: pointer; } - -#identity-popup-help-icon > .button-box > .button-text { - display: none; } - -#identity-popup-help-icon > .button-box > .button-icon { - height: 16px; - width: 16px; } - -#identity-popup-help-icon:-moz-focusring { - outline: 1px dotted; - outline-offset: 1px; } - -#identity-popup > .panel-arrowcontainer > .panel-arrowcontent { - padding: 0; } - -#identity-popup-container { - min-width: 280px; - padding: 10px; } - -#identity-popup-button-container { - background: linear-gradient(to bottom, rgba(0, 0, 0, 0.04) 60%, transparent); - padding: 10px; - margin-top: 5px; } - .popup-notification-icon { width: 64px; height: 64px; @@ -1567,14 +1477,26 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box list-style-image: url(chrome://browser/skin/Push-64.png); } .popup-notification-icon[popupid="xpinstall-disabled"], -.popup-notification-icon[popupid="addon-progress"], -.popup-notification-icon[popupid="addon-install-blocked"], -.popup-notification-icon[popupid="addon-install-failed"], -.popup-notification-icon[popupid="addon-install-confirmation"], +.popup-notification-icon[popupid="addon-install-blocked"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-blocked.svg); } + +.popup-notification-icon[popupid="addon-progress"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-downloading.svg); } + +.popup-notification-icon[popupid="addon-install-failed"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-error.svg); } + +.popup-notification-icon[popupid="addon-install-confirmation"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-confirm.svg); } + +#addon-install-confirmation-notification[warning] .popup-notification-icon[popupid="addon-install-confirmation"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-warning.svg); } + .popup-notification-icon[popupid="addon-install-complete"] { - list-style-image: url(chrome://mozapps/skin/extensions/extensionGeneric.png); - width: 32px; - height: 32px; } + list-style-image: url(chrome://browser/skin/addons/addon-install-installed.svg); } + +.popup-notification-icon[popupid="addon-install-restart"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-restart.svg); } .popup-notification-icon[popupid="click-to-play-plugins"] { list-style-image: url(chrome://mozapps/skin/plugins/pluginBlocked-64.png); } @@ -1649,7 +1571,13 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box list-style-image: url(chrome://browser/skin/Push-16.png); } #addons-notification-icon { - list-style-image: url(chrome://mozapps/skin/extensions/extensionGeneric-16.png); } + list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg#default); } + +#addons-notification-icon:hover { + list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg#hover); } + +#addons-notification-icon:hover:active { + list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg#active); } .indexedDB-notification-icon, #indexedDB-notification-icon { @@ -1658,6 +1586,11 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box #password-notification-icon { list-style-image: url(chrome://mozapps/skin/passwordmgr/key-16.png); } +#login-fill-notification-icon { + /* Temporary icon until the capture and fill doorhangers are unified. */ + 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); } @@ -1834,9 +1767,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box #indexedDB-notification-icon { list-style-image: url(moz-icon://stock/gtk-dialog-question?size=16); } -#pointerLock-cancel { - margin: 0px; } - /* Translation infobar */ notification[value="translation"] .messageImage { list-style-image: url(chrome://browser/skin/translation-16.png); @@ -2042,11 +1972,9 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- -moz-image-region: rect(0, 14px, 14px, 0); } #urlbar-reload-button:not([disabled]):hover { - background-image: radial-gradient(circle closest-side, rgba(102, 204, 255, 0.2), transparent); -moz-image-region: rect(14px, 14px, 28px, 0); } #urlbar-reload-button:not([disabled]):hover:active { - background-image: radial-gradient(circle closest-side, rgba(51, 187, 255, 0.1), transparent); -moz-image-region: rect(28px, 14px, 42px, 0); } #urlbar-reload-button:-moz-locale-dir(rtl) > .toolbarbutton-icon { @@ -2056,11 +1984,9 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- -moz-image-region: rect(0, 42px, 14px, 28px); } #urlbar-go-button:hover { - background-image: radial-gradient(circle closest-side, rgba(68, 217, 38, 0.2), transparent); -moz-image-region: rect(14px, 42px, 28px, 28px); } #urlbar-go-button:hover:active { - background-image: radial-gradient(circle closest-side, rgba(68, 217, 38, 0.1), transparent); -moz-image-region: rect(28px, 42px, 42px, 28px); } #urlbar-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon { @@ -2070,11 +1996,9 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- -moz-image-region: rect(0, 28px, 14px, 14px); } #urlbar-stop-button:not([disabled]):hover { - background-image: radial-gradient(circle closest-side, rgba(255, 138, 128, 0.3), transparent); -moz-image-region: rect(14px, 28px, 28px, 14px); } #urlbar-stop-button:hover:active { - background-image: radial-gradient(circle closest-side, rgba(255, 138, 128, 0.1), transparent); -moz-image-region: rect(28px, 28px, 42px, 14px); } @media (min-resolution: 1.1dppx) { @@ -3362,6 +3286,34 @@ notification.pluginVulnerable .messageImage { .popup-notification-footer[popupid="bad-content"] { padding-top: 1em; } +#notification-popup[popupid="login-fill"] > .panel-arrowcontainer > .panel-arrowcontent { + /* Since we display a sliding subview that extends to the border, we cannot + * keep the default padding of arrow panels. We use the same padding in the + * individual content views instead. Since we removed the padding, we also + * have to ensure the contents are clipped to the border box. */ + padding: 0; + overflow: hidden; } + +#login-fill-mainview, +#login-fill-details { + padding: var(--panel-arrowcontent-padding); } + +#login-fill-doorhanger[inDetailView] > #login-fill-mainview { + transform: translateX(-14px); } + +#login-fill-mainview, +#login-fill-details { + transition: transform 150ms; } + +#login-fill-doorhanger:not([inDetailView]) > #login-fill-details { + transform: translateX(105%); } + +#login-fill-doorhanger:not([inDetailView]) > #login-fill-details:-moz-locale-dir(rtl) { + transform: translateX(-105%); } + +#login-fill-doorhanger[inDetailView] > #login-fill-clickcapturer { + background-color: rgba(24, 26, 27, 0.1); } + #login-fill-testing { color: #b33; font-weight: bold; } @@ -3370,14 +3322,34 @@ notification.pluginVulnerable .messageImage { border: 1px solid black; max-height: 20em; } +.login-fill-item[disabled] { + color: #888; + background-color: #fff; } + +.login-fill-item[disabled][selected] { + background-color: #eef; } + .login-hostname { margin: 4px; font-weight: bold; } +.login-fill-item.different-hostname > .login-hostname { + color: #888; + font-style: italic; } + .login-username { margin: 4px; color: #888; } +#login-fill-details { + padding: 4px; + background: var(--panel-arrowcontent-background); + color: var(--panel-arrowcontent-color); + background-clip: padding-box; + border-left: 1px solid rgba(24, 26, 27, 0.3); + box-shadow: 0 3px 5px rgba(24, 26, 27, 0.1), 0 0 7px rgba(24, 26, 27, 0.1); + -moz-margin-start: 38px; } + /* 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/. */ @@ -3547,10 +3519,6 @@ toolbar[brighttext] #downloads-indicator-counter { -moz-margin-end: 2px; } /* Social toolbar item */ -#social-undoactivation-button { - -moz-margin-start: 0; - /* override default label margin to match description margin */ } - .social-activation-icon { width: auto; height: auto; @@ -3736,7 +3704,6 @@ chatbox[dark=true] > .chat-titlebar > hbox > .chat-title { .chatbar-innerbox { background: transparent; - margin: -285px 0 0; overflow: hidden; } chatbar { @@ -4516,6 +4483,15 @@ notification.heartbeat { #context-bookmarkpage[disabled=true] { list-style-image: url("chrome://browser/skin/content-contextmenu.svg#bookmark-disabled"); } +#context-bookmarkpage[starred=true] { + list-style-image: url("chrome://browser/skin/content-contextmenu.svg#bookmarked"); } + +#context-bookmarkpage[starred=true][_moz-menuactive=true] { + list-style-image: url("chrome://browser/skin/content-contextmenu.svg#bookmarked-active"); } + +#context-bookmarkpage[starred=true][disabled=true] { + list-style-image: url("chrome://browser/skin/content-contextmenu.svg#bookmarked-disabled"); } + #context-back:-moz-locale-dir(rtl), #context-forward:-moz-locale-dir(rtl), #context-reload:-moz-locale-dir(rtl) { diff --git a/arc-firefox-theme/chrome/browser/sass/browser-darker.css b/arc-firefox-theme/chrome/browser/sass/browser-darker.css index fa3a898..a9adffc 100644 --- a/arc-firefox-theme/chrome/browser/sass/browser-darker.css +++ b/arc-firefox-theme/chrome/browser/sass/browser-darker.css @@ -1313,7 +1313,7 @@ toolbar[brighttext] #loop-button > .toolbarbutton-badge-container { #urlbar-display-box { margin-top: -1px; margin-bottom: -1px; - -moz-border-end: 1px solid red; + -moz-border-end: 1px solid #AAA; -moz-margin-end: 3px; } .urlbar-display { @@ -1413,18 +1413,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box #page-proxy-favicon[pageproxystate="invalid"] { opacity: 0.3; } -#identity-popup.chromeUI > #identity-popup-container > #identity-popup-icon { - list-style-image: url("chrome://branding/content/icon64.png"); } - -#identity-popup-brandName { - font-weight: bold; - font-size: 1.25em; - margin-top: .5em; - margin-bottom: .5em; } - -#identity-popup-content-box { - max-width: 50ch; } - @media not all and (min-resolution: 1.1dppx) { #page-proxy-favicon { -moz-image-region: rect(0, 16px, 16px, 0); } @@ -1463,98 +1451,20 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box #identity-box:hover:active > #page-proxy-favicon, #identity-box[open=true] > #page-proxy-favicon { - -moz-image-region: rect(0, 96px, 32px, 64px); } + -moz-image-region: rect(0, 96px, 32px, 64px); } } +#urlbar[actiontype="searchengine"] > #identity-box > #page-proxy-favicon { + -moz-image-region: inherit; + list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon); + width: 16px; + height: 16px; + opacity: 1; } - #identity-popup.chromeUI > #identity-popup-container > #identity-popup-icon { - list-style-image: url("chrome://branding/content/icon128.png"); - -moz-image-region: rect(0, 128px, 128px, 0); } } #page-proxy-favicon { margin-top: 1px; margin-bottom: 1px; -moz-margin-start: 3px; -moz-margin-end: 1px; } -/* Identity popup icons */ -#identity-popup-icon { - height: 64px; - width: 64px; - padding: 0; - list-style-image: url("chrome://browser/skin/identity.png"); - -moz-image-region: rect(0px, 64px, 64px, 0px); } - -#identity-popup.verifiedDomain > #identity-popup-container > #identity-popup-icon { - -moz-image-region: rect(64px, 64px, 128px, 0px); } - -#identity-popup.verifiedIdentity > #identity-popup-container > #identity-popup-icon { - -moz-image-region: rect(128px, 64px, 192px, 0px); } - -/* Identity popup body text */ -.identity-popup-description { - white-space: pre-wrap; - -moz-padding-start: 15px; - margin: 2px 0 4px; } - -.identity-popup-label { - white-space: pre-wrap; - -moz-padding-start: 15px; - margin: 0; } - -#identity-popup-content-host, -#identity-popup-content-owner { - font-weight: bold; - max-width: 300px; } - -#identity-popup-content-host, -#identity-popup-content-box.verifiedIdentity > #identity-popup-content-owner { - font-size: 140%; } - -#identity-popup-content-owner { - margin-bottom: 0 !important; } - -#identity-popup-content-verifier { - margin: 4px 0 2px; } - -#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption, -#identity-popup-content-box.verifiedDomain > #identity-popup-encryption { - margin-top: 10px; - -moz-margin-start: -18px; } - -#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption > vbox > #identity-popup-encryption-icon, -#identity-popup-content-box.verifiedDomain > #identity-popup-encryption > vbox > #identity-popup-encryption-icon { - list-style-image: url("chrome://browser/skin/Secure.png"); } - -#identity-popup-help-icon { - -moz-appearance: none; - margin-left: 0px; - border: none; - background: none; - min-width: 0; - list-style-image: url("moz-icon://stock/gtk-dialog-question?size=16"); - cursor: pointer; } - -#identity-popup-help-icon > .button-box > .button-text { - display: none; } - -#identity-popup-help-icon > .button-box > .button-icon { - height: 16px; - width: 16px; } - -#identity-popup-help-icon:-moz-focusring { - outline: 1px dotted; - outline-offset: 1px; } - -#identity-popup > .panel-arrowcontainer > .panel-arrowcontent { - padding: 0; } - -#identity-popup-container { - min-width: 280px; - padding: 10px; } - -#identity-popup-button-container { - background: linear-gradient(to bottom, rgba(0, 0, 0, 0.04) 60%, transparent); - padding: 10px; - margin-top: 5px; } - .popup-notification-icon { width: 64px; height: 64px; @@ -1567,14 +1477,26 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box list-style-image: url(chrome://browser/skin/Push-64.png); } .popup-notification-icon[popupid="xpinstall-disabled"], -.popup-notification-icon[popupid="addon-progress"], -.popup-notification-icon[popupid="addon-install-blocked"], -.popup-notification-icon[popupid="addon-install-failed"], -.popup-notification-icon[popupid="addon-install-confirmation"], +.popup-notification-icon[popupid="addon-install-blocked"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-blocked.svg); } + +.popup-notification-icon[popupid="addon-progress"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-downloading.svg); } + +.popup-notification-icon[popupid="addon-install-failed"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-error.svg); } + +.popup-notification-icon[popupid="addon-install-confirmation"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-confirm.svg); } + +#addon-install-confirmation-notification[warning] .popup-notification-icon[popupid="addon-install-confirmation"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-warning.svg); } + .popup-notification-icon[popupid="addon-install-complete"] { - list-style-image: url(chrome://mozapps/skin/extensions/extensionGeneric.png); - width: 32px; - height: 32px; } + list-style-image: url(chrome://browser/skin/addons/addon-install-installed.svg); } + +.popup-notification-icon[popupid="addon-install-restart"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-restart.svg); } .popup-notification-icon[popupid="click-to-play-plugins"] { list-style-image: url(chrome://mozapps/skin/plugins/pluginBlocked-64.png); } @@ -1649,7 +1571,13 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box list-style-image: url(chrome://browser/skin/Push-16.png); } #addons-notification-icon { - list-style-image: url(chrome://mozapps/skin/extensions/extensionGeneric-16.png); } + list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg#default); } + +#addons-notification-icon:hover { + list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg#hover); } + +#addons-notification-icon:hover:active { + list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg#active); } .indexedDB-notification-icon, #indexedDB-notification-icon { @@ -1658,6 +1586,11 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box #password-notification-icon { list-style-image: url(chrome://mozapps/skin/passwordmgr/key-16.png); } +#login-fill-notification-icon { + /* Temporary icon until the capture and fill doorhangers are unified. */ + 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); } @@ -1834,9 +1767,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box #indexedDB-notification-icon { list-style-image: url(moz-icon://stock/gtk-dialog-question?size=16); } -#pointerLock-cancel { - margin: 0px; } - /* Translation infobar */ notification[value="translation"] .messageImage { list-style-image: url(chrome://browser/skin/translation-16.png); @@ -2042,11 +1972,9 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- -moz-image-region: rect(0, 14px, 14px, 0); } #urlbar-reload-button:not([disabled]):hover { - background-image: radial-gradient(circle closest-side, rgba(102, 204, 255, 0.2), transparent); -moz-image-region: rect(14px, 14px, 28px, 0); } #urlbar-reload-button:not([disabled]):hover:active { - background-image: radial-gradient(circle closest-side, rgba(51, 187, 255, 0.1), transparent); -moz-image-region: rect(28px, 14px, 42px, 0); } #urlbar-reload-button:-moz-locale-dir(rtl) > .toolbarbutton-icon { @@ -2056,11 +1984,9 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- -moz-image-region: rect(0, 42px, 14px, 28px); } #urlbar-go-button:hover { - background-image: radial-gradient(circle closest-side, rgba(68, 217, 38, 0.2), transparent); -moz-image-region: rect(14px, 42px, 28px, 28px); } #urlbar-go-button:hover:active { - background-image: radial-gradient(circle closest-side, rgba(68, 217, 38, 0.1), transparent); -moz-image-region: rect(28px, 42px, 42px, 28px); } #urlbar-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon { @@ -2070,11 +1996,9 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- -moz-image-region: rect(0, 28px, 14px, 14px); } #urlbar-stop-button:not([disabled]):hover { - background-image: radial-gradient(circle closest-side, rgba(255, 138, 128, 0.3), transparent); -moz-image-region: rect(14px, 28px, 28px, 14px); } #urlbar-stop-button:hover:active { - background-image: radial-gradient(circle closest-side, rgba(255, 138, 128, 0.1), transparent); -moz-image-region: rect(28px, 28px, 42px, 14px); } @media (min-resolution: 1.1dppx) { @@ -3362,6 +3286,34 @@ notification.pluginVulnerable .messageImage { .popup-notification-footer[popupid="bad-content"] { padding-top: 1em; } +#notification-popup[popupid="login-fill"] > .panel-arrowcontainer > .panel-arrowcontent { + /* Since we display a sliding subview that extends to the border, we cannot + * keep the default padding of arrow panels. We use the same padding in the + * individual content views instead. Since we removed the padding, we also + * have to ensure the contents are clipped to the border box. */ + padding: 0; + overflow: hidden; } + +#login-fill-mainview, +#login-fill-details { + padding: var(--panel-arrowcontent-padding); } + +#login-fill-doorhanger[inDetailView] > #login-fill-mainview { + transform: translateX(-14px); } + +#login-fill-mainview, +#login-fill-details { + transition: transform 150ms; } + +#login-fill-doorhanger:not([inDetailView]) > #login-fill-details { + transform: translateX(105%); } + +#login-fill-doorhanger:not([inDetailView]) > #login-fill-details:-moz-locale-dir(rtl) { + transform: translateX(-105%); } + +#login-fill-doorhanger[inDetailView] > #login-fill-clickcapturer { + background-color: rgba(24, 26, 27, 0.1); } + #login-fill-testing { color: #b33; font-weight: bold; } @@ -3370,14 +3322,34 @@ notification.pluginVulnerable .messageImage { border: 1px solid black; max-height: 20em; } +.login-fill-item[disabled] { + color: #888; + background-color: #fff; } + +.login-fill-item[disabled][selected] { + background-color: #eef; } + .login-hostname { margin: 4px; font-weight: bold; } +.login-fill-item.different-hostname > .login-hostname { + color: #888; + font-style: italic; } + .login-username { margin: 4px; color: #888; } +#login-fill-details { + padding: 4px; + background: var(--panel-arrowcontent-background); + color: var(--panel-arrowcontent-color); + background-clip: padding-box; + border-left: 1px solid rgba(24, 26, 27, 0.3); + box-shadow: 0 3px 5px rgba(24, 26, 27, 0.1), 0 0 7px rgba(24, 26, 27, 0.1); + -moz-margin-start: 38px; } + /* 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/. */ @@ -3547,10 +3519,6 @@ toolbar[brighttext] #downloads-indicator-counter { -moz-margin-end: 2px; } /* Social toolbar item */ -#social-undoactivation-button { - -moz-margin-start: 0; - /* override default label margin to match description margin */ } - .social-activation-icon { width: auto; height: auto; @@ -3736,7 +3704,6 @@ chatbox[dark=true] > .chat-titlebar > hbox > .chat-title { .chatbar-innerbox { background: transparent; - margin: -285px 0 0; overflow: hidden; } chatbar { @@ -4516,6 +4483,15 @@ notification.heartbeat { #context-bookmarkpage[disabled=true] { list-style-image: url("chrome://browser/skin/content-contextmenu.svg#bookmark-disabled"); } +#context-bookmarkpage[starred=true] { + list-style-image: url("chrome://browser/skin/content-contextmenu.svg#bookmarked"); } + +#context-bookmarkpage[starred=true][_moz-menuactive=true] { + list-style-image: url("chrome://browser/skin/content-contextmenu.svg#bookmarked-active"); } + +#context-bookmarkpage[starred=true][disabled=true] { + list-style-image: url("chrome://browser/skin/content-contextmenu.svg#bookmarked-disabled"); } + #context-back:-moz-locale-dir(rtl), #context-forward:-moz-locale-dir(rtl), #context-reload:-moz-locale-dir(rtl) { diff --git a/arc-firefox-theme/chrome/browser/sass/browser-light.css b/arc-firefox-theme/chrome/browser/sass/browser-light.css index e78c95e..9f57fa2 100644 --- a/arc-firefox-theme/chrome/browser/sass/browser-light.css +++ b/arc-firefox-theme/chrome/browser/sass/browser-light.css @@ -1313,7 +1313,7 @@ toolbar[brighttext] #loop-button > .toolbarbutton-badge-container { #urlbar-display-box { margin-top: -1px; margin-bottom: -1px; - -moz-border-end: 1px solid red; + -moz-border-end: 1px solid #AAA; -moz-margin-end: 3px; } .urlbar-display { @@ -1413,18 +1413,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box #page-proxy-favicon[pageproxystate="invalid"] { opacity: 0.3; } -#identity-popup.chromeUI > #identity-popup-container > #identity-popup-icon { - list-style-image: url("chrome://branding/content/icon64.png"); } - -#identity-popup-brandName { - font-weight: bold; - font-size: 1.25em; - margin-top: .5em; - margin-bottom: .5em; } - -#identity-popup-content-box { - max-width: 50ch; } - @media not all and (min-resolution: 1.1dppx) { #page-proxy-favicon { -moz-image-region: rect(0, 16px, 16px, 0); } @@ -1463,98 +1451,20 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box #identity-box:hover:active > #page-proxy-favicon, #identity-box[open=true] > #page-proxy-favicon { - -moz-image-region: rect(0, 96px, 32px, 64px); } + -moz-image-region: rect(0, 96px, 32px, 64px); } } +#urlbar[actiontype="searchengine"] > #identity-box > #page-proxy-favicon { + -moz-image-region: inherit; + list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon); + width: 16px; + height: 16px; + opacity: 1; } - #identity-popup.chromeUI > #identity-popup-container > #identity-popup-icon { - list-style-image: url("chrome://branding/content/icon128.png"); - -moz-image-region: rect(0, 128px, 128px, 0); } } #page-proxy-favicon { margin-top: 1px; margin-bottom: 1px; -moz-margin-start: 3px; -moz-margin-end: 1px; } -/* Identity popup icons */ -#identity-popup-icon { - height: 64px; - width: 64px; - padding: 0; - list-style-image: url("chrome://browser/skin/identity.png"); - -moz-image-region: rect(0px, 64px, 64px, 0px); } - -#identity-popup.verifiedDomain > #identity-popup-container > #identity-popup-icon { - -moz-image-region: rect(64px, 64px, 128px, 0px); } - -#identity-popup.verifiedIdentity > #identity-popup-container > #identity-popup-icon { - -moz-image-region: rect(128px, 64px, 192px, 0px); } - -/* Identity popup body text */ -.identity-popup-description { - white-space: pre-wrap; - -moz-padding-start: 15px; - margin: 2px 0 4px; } - -.identity-popup-label { - white-space: pre-wrap; - -moz-padding-start: 15px; - margin: 0; } - -#identity-popup-content-host, -#identity-popup-content-owner { - font-weight: bold; - max-width: 300px; } - -#identity-popup-content-host, -#identity-popup-content-box.verifiedIdentity > #identity-popup-content-owner { - font-size: 140%; } - -#identity-popup-content-owner { - margin-bottom: 0 !important; } - -#identity-popup-content-verifier { - margin: 4px 0 2px; } - -#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption, -#identity-popup-content-box.verifiedDomain > #identity-popup-encryption { - margin-top: 10px; - -moz-margin-start: -18px; } - -#identity-popup-content-box.verifiedIdentity > #identity-popup-encryption > vbox > #identity-popup-encryption-icon, -#identity-popup-content-box.verifiedDomain > #identity-popup-encryption > vbox > #identity-popup-encryption-icon { - list-style-image: url("chrome://browser/skin/Secure.png"); } - -#identity-popup-help-icon { - -moz-appearance: none; - margin-left: 0px; - border: none; - background: none; - min-width: 0; - list-style-image: url("moz-icon://stock/gtk-dialog-question?size=16"); - cursor: pointer; } - -#identity-popup-help-icon > .button-box > .button-text { - display: none; } - -#identity-popup-help-icon > .button-box > .button-icon { - height: 16px; - width: 16px; } - -#identity-popup-help-icon:-moz-focusring { - outline: 1px dotted; - outline-offset: 1px; } - -#identity-popup > .panel-arrowcontainer > .panel-arrowcontent { - padding: 0; } - -#identity-popup-container { - min-width: 280px; - padding: 10px; } - -#identity-popup-button-container { - background: linear-gradient(to bottom, rgba(0, 0, 0, 0.04) 60%, transparent); - padding: 10px; - margin-top: 5px; } - .popup-notification-icon { width: 64px; height: 64px; @@ -1567,14 +1477,26 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box list-style-image: url(chrome://browser/skin/Push-64.png); } .popup-notification-icon[popupid="xpinstall-disabled"], -.popup-notification-icon[popupid="addon-progress"], -.popup-notification-icon[popupid="addon-install-blocked"], -.popup-notification-icon[popupid="addon-install-failed"], -.popup-notification-icon[popupid="addon-install-confirmation"], +.popup-notification-icon[popupid="addon-install-blocked"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-blocked.svg); } + +.popup-notification-icon[popupid="addon-progress"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-downloading.svg); } + +.popup-notification-icon[popupid="addon-install-failed"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-error.svg); } + +.popup-notification-icon[popupid="addon-install-confirmation"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-confirm.svg); } + +#addon-install-confirmation-notification[warning] .popup-notification-icon[popupid="addon-install-confirmation"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-warning.svg); } + .popup-notification-icon[popupid="addon-install-complete"] { - list-style-image: url(chrome://mozapps/skin/extensions/extensionGeneric.png); - width: 32px; - height: 32px; } + list-style-image: url(chrome://browser/skin/addons/addon-install-installed.svg); } + +.popup-notification-icon[popupid="addon-install-restart"] { + list-style-image: url(chrome://browser/skin/addons/addon-install-restart.svg); } .popup-notification-icon[popupid="click-to-play-plugins"] { list-style-image: url(chrome://mozapps/skin/plugins/pluginBlocked-64.png); } @@ -1649,7 +1571,13 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box list-style-image: url(chrome://browser/skin/Push-16.png); } #addons-notification-icon { - list-style-image: url(chrome://mozapps/skin/extensions/extensionGeneric-16.png); } + list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg#default); } + +#addons-notification-icon:hover { + list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg#hover); } + +#addons-notification-icon:hover:active { + list-style-image: url(chrome://browser/skin/addons/addon-install-anchor.svg#active); } .indexedDB-notification-icon, #indexedDB-notification-icon { @@ -1658,6 +1586,11 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box #password-notification-icon { list-style-image: url(chrome://mozapps/skin/passwordmgr/key-16.png); } +#login-fill-notification-icon { + /* Temporary icon until the capture and fill doorhangers are unified. */ + 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); } @@ -1834,9 +1767,6 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar > #identity-box #indexedDB-notification-icon { list-style-image: url(moz-icon://stock/gtk-dialog-question?size=16); } -#pointerLock-cancel { - margin: 0px; } - /* Translation infobar */ notification[value="translation"] .messageImage { list-style-image: url(chrome://browser/skin/translation-16.png); @@ -2042,11 +1972,9 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- -moz-image-region: rect(0, 14px, 14px, 0); } #urlbar-reload-button:not([disabled]):hover { - background-image: radial-gradient(circle closest-side, rgba(102, 204, 255, 0.2), transparent); -moz-image-region: rect(14px, 14px, 28px, 0); } #urlbar-reload-button:not([disabled]):hover:active { - background-image: radial-gradient(circle closest-side, rgba(51, 187, 255, 0.1), transparent); -moz-image-region: rect(28px, 14px, 42px, 0); } #urlbar-reload-button:-moz-locale-dir(rtl) > .toolbarbutton-icon { @@ -2056,11 +1984,9 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- -moz-image-region: rect(0, 42px, 14px, 28px); } #urlbar-go-button:hover { - background-image: radial-gradient(circle closest-side, rgba(68, 217, 38, 0.2), transparent); -moz-image-region: rect(14px, 42px, 28px, 28px); } #urlbar-go-button:hover:active { - background-image: radial-gradient(circle closest-side, rgba(68, 217, 38, 0.1), transparent); -moz-image-region: rect(28px, 42px, 42px, 28px); } #urlbar-go-button:-moz-locale-dir(rtl) > .toolbarbutton-icon { @@ -2070,11 +1996,9 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action- -moz-image-region: rect(0, 28px, 14px, 14px); } #urlbar-stop-button:not([disabled]):hover { - background-image: radial-gradient(circle closest-side, rgba(255, 138, 128, 0.3), transparent); -moz-image-region: rect(14px, 28px, 28px, 14px); } #urlbar-stop-button:hover:active { - background-image: radial-gradient(circle closest-side, rgba(255, 138, 128, 0.1), transparent); -moz-image-region: rect(28px, 28px, 42px, 14px); } @media (min-resolution: 1.1dppx) { @@ -3362,6 +3286,34 @@ notification.pluginVulnerable .messageImage { .popup-notification-footer[popupid="bad-content"] { padding-top: 1em; } +#notification-popup[popupid="login-fill"] > .panel-arrowcontainer > .panel-arrowcontent { + /* Since we display a sliding subview that extends to the border, we cannot + * keep the default padding of arrow panels. We use the same padding in the + * individual content views instead. Since we removed the padding, we also + * have to ensure the contents are clipped to the border box. */ + padding: 0; + overflow: hidden; } + +#login-fill-mainview, +#login-fill-details { + padding: var(--panel-arrowcontent-padding); } + +#login-fill-doorhanger[inDetailView] > #login-fill-mainview { + transform: translateX(-14px); } + +#login-fill-mainview, +#login-fill-details { + transition: transform 150ms; } + +#login-fill-doorhanger:not([inDetailView]) > #login-fill-details { + transform: translateX(105%); } + +#login-fill-doorhanger:not([inDetailView]) > #login-fill-details:-moz-locale-dir(rtl) { + transform: translateX(-105%); } + +#login-fill-doorhanger[inDetailView] > #login-fill-clickcapturer { + background-color: rgba(24, 26, 27, 0.1); } + #login-fill-testing { color: #b33; font-weight: bold; } @@ -3370,14 +3322,34 @@ notification.pluginVulnerable .messageImage { border: 1px solid black; max-height: 20em; } +.login-fill-item[disabled] { + color: #888; + background-color: #fff; } + +.login-fill-item[disabled][selected] { + background-color: #eef; } + .login-hostname { margin: 4px; font-weight: bold; } +.login-fill-item.different-hostname > .login-hostname { + color: #888; + font-style: italic; } + .login-username { margin: 4px; color: #888; } +#login-fill-details { + padding: 4px; + background: var(--panel-arrowcontent-background); + color: var(--panel-arrowcontent-color); + background-clip: padding-box; + border-left: 1px solid rgba(24, 26, 27, 0.3); + box-shadow: 0 3px 5px rgba(24, 26, 27, 0.1), 0 0 7px rgba(24, 26, 27, 0.1); + -moz-margin-start: 38px; } + /* 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/. */ @@ -3547,10 +3519,6 @@ toolbar[brighttext] #downloads-indicator-counter { -moz-margin-end: 2px; } /* Social toolbar item */ -#social-undoactivation-button { - -moz-margin-start: 0; - /* override default label margin to match description margin */ } - .social-activation-icon { width: auto; height: auto; @@ -3736,7 +3704,6 @@ chatbox[dark=true] > .chat-titlebar > hbox > .chat-title { .chatbar-innerbox { background: transparent; - margin: -285px 0 0; overflow: hidden; } chatbar { @@ -4516,6 +4483,15 @@ notification.heartbeat { #context-bookmarkpage[disabled=true] { list-style-image: url("chrome://browser/skin/content-contextmenu.svg#bookmark-disabled"); } +#context-bookmarkpage[starred=true] { + list-style-image: url("chrome://browser/skin/content-contextmenu.svg#bookmarked"); } + +#context-bookmarkpage[starred=true][_moz-menuactive=true] { + list-style-image: url("chrome://browser/skin/content-contextmenu.svg#bookmarked-active"); } + +#context-bookmarkpage[starred=true][disabled=true] { + list-style-image: url("chrome://browser/skin/content-contextmenu.svg#bookmarked-disabled"); } + #context-back:-moz-locale-dir(rtl), #context-forward:-moz-locale-dir(rtl), #context-reload:-moz-locale-dir(rtl) { |