diff options
Diffstat (limited to 'arc-firefox-theme/chrome/browser/sass')
4 files changed, 224 insertions, 291 deletions
diff --git a/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss b/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss index 1e89eed..90b5124 100644 --- a/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss +++ b/arc-firefox-theme/chrome/browser/sass/_browser-sass.scss @@ -1009,7 +1009,7 @@ toolbarpaletteitem[place="palette"] > :-moz-any(#back-button, #forward-button, # :-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, #containers-panelmenu)[cui-areatype="menu-panel"][panel-multiview-anchor=true] > .toolbarbutton-icon, :-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, #containers-panelmenu)[cui-areatype="menu-panel"][panel-multiview-anchor=true] > .toolbarbutton-badge-stack > .toolbarbutton-icon, :-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, #containers-panelmenu)[cui-areatype="menu-panel"][panel-multiview-anchor=true] > .toolbarbutton-menubutton-button > .toolbarbutton-icon { - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } @@ -1546,6 +1546,9 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { visibility: visible; } +#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon, +#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon, +#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon, #urlbar[pageproxystate="valid"] > #identity-box.certUserOverridden > #connection-icon { list-style-image: url(chrome://browser/skin/connection-mixed-passive-loaded.svg#icon); visibility: visible; @@ -1557,13 +1560,6 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { visibility: visible; } -#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon, -#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon, -#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon { - list-style-image: url(chrome://browser/skin/connection-mixed-passive-loaded.svg#icon); - visibility: visible; -} - #identity-icon:-moz-lwtheme { list-style-image: url(chrome://browser/skin/identity-icon.svg#normal-black); @@ -1604,6 +1600,9 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { visibility: visible; } +#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon:-moz-lwtheme, +#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon:-moz-lwtheme, +#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon:-moz-lwtheme, #urlbar[pageproxystate="valid"] > #identity-box.certUserOverridden > #connection-icon:-moz-lwtheme { list-style-image: url(chrome://browser/skin/connection-mixed-passive-loaded.svg#icon-black); visibility: visible; @@ -1615,13 +1614,6 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { visibility: visible; } -#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon:-moz-lwtheme, -#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon:-moz-lwtheme, -#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon:-moz-lwtheme { - list-style-image: url(chrome://browser/skin/connection-mixed-passive-loaded.svg#icon-black); - visibility: visible; -} - #identity-box { --identity-box-verified-color: hsl(92,100%,30%); --identity-box-chrome-color: rgb(229,115,0); @@ -1727,10 +1719,11 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { #identity-box[sharing] > #identity-icon, #sharing-icon { - animation: 3s linear pulse infinite; + animation: 3s linear identity-box-sharing-icon-pulse infinite; } -@keyframes pulse { +/* This should remain identical to tab-sharing-icon-pulse in tabs.inc.css */ +@keyframes identity-box-sharing-icon-pulse { 0%, 16.66%, 83.33%, 100% { opacity: 0; } @@ -1793,31 +1786,15 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { type of icon displayed. This rule must be defined before the others in order for its list-style-image to be overridden. */ .notification-anchor-icon { - list-style-image: url(moz-icon://stock/gtk-dialog-info?size=16); -} - -@media (min-resolution: 1.1dppx) { - .notification-anchor-icon { - list-style-image: url(moz-icon://stock/gtk-dialog-info?size=dialog); - } -} - -.popup-notification-icon { - width: 64px; - height: 64px; - margin-inline-end: 10px; + list-style-image: url(chrome://browser/skin/notification-icons.svg#default-info); } .notification-anchor-icon:not(.plugin-blocked):-moz-lwtheme, #blocked-permissions-container > .blocked-permission-icon:-moz-lwtheme { - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } -.notification-anchor-icon:not(.plugin-blocked):not(:hover) { - opacity: .8; -} - /* INDIVIDUAL NOTIFICATIONS */ .popup-notification-icon[popupid="web-notifications"], @@ -2063,6 +2040,29 @@ html|*#webRTC-previewVideo { font-weight: bold; } +.addon-webext-perm-header { + font-size: 1.3em; +} + +.addon-webext-name { + font-weight: bold; + margin: 0; +} + +.addon-addon-icon { + width: 14px; + height: 14px; + list-style-image: url("chrome://browser/skin/menuPanel.svg"); + -moz-image-region: rect(0px, 288px, 32px, 256px); +} + +.addon-toolbar-icon { + width: 14px; + height: 14px; + list-style-image: url("chrome://browser/skin/Toolbar.png"); + -moz-image-region: rect(0, 486px, 18px, 468px); +} + /* Notification icon box */ .notification-anchor-icon:-moz-focusring { @@ -2315,14 +2315,13 @@ notification[value="translation"] menulist > .menulist-dropmarker { border: 1px solid transparent; } -.autocomplete-richlistitem[selected=true] { - background-color: Highlight; -} - .ac-title { font-size: 1.05em; } +.ac-separator, +.ac-url, +.ac-action, .ac-tags { font-size: 0.9em; } @@ -2335,20 +2334,12 @@ html|span.ac-tag { padding: 0 1px; } -.ac-separator, -.ac-url, -.ac-action { - font-size: 0.9em; +.ac-separator:not([selected=true]), +.ac-url:not([selected=true]), +.ac-action:not([selected=true]) { 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; @@ -2368,30 +2359,16 @@ html|span.ac-emphasize-text-url { 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-type-icon[type=keyword], -.ac-site-icon[type=searchengine], -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) { +.ac-site-icon[type=searchengine] { list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon); } .ac-type-icon[type=keyword][selected], -.ac-site-icon[type=searchengine][selected], -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage, selected) { +.ac-site-icon[type=searchengine][selected] { list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon-inverted); } -.autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) { - list-style-image: url("chrome://browser/skin/places/tag.png"); - width: 16px; - height: 16px; -} - .ac-type-icon[type=switchtab], .ac-type-icon[type=remotetab] { list-style-image: url("chrome://browser/skin/urlbar-tab.svg#tab"); @@ -2865,10 +2842,11 @@ html|span.ac-emphasize-text-url { .tab-icon-image[sharing]:not([selected]), .tab-sharing-icon-overlay { - animation: 3s linear pulse infinite; + animation: 3s linear tab-sharing-icon-pulse infinite; } -@keyframes pulse { +/* This should remain identical to identity-box-sharing-icon-pulse in identity-block.inc.css */ +@keyframes tab-sharing-icon-pulse { 0%, 16.66%, 83.33%, 100% { opacity: 0; } @@ -2980,7 +2958,7 @@ html|span.ac-emphasize-text-url { .tab-icon-sound[muted], .tab-icon-sound[blocked] { list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio); - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } @@ -2995,13 +2973,13 @@ html|span.ac-emphasize-text-url { .tab-icon-sound:-moz-lwtheme-darktext[soundplaying], .tab-icon-sound:-moz-lwtheme-darktext[muted], .tab-icon-sound:-moz-lwtheme-darktext[blocked] { - filter: url(chrome://browser/skin/filters.svg#fill) drop-shadow(1px 1px 1px white); + filter: url(chrome://global/skin/filters.svg#fill) drop-shadow(1px 1px 1px white); } .tab-icon-sound:-moz-lwtheme-brighttext[soundplaying], .tab-icon-sound:-moz-lwtheme-brighttext[muted], .tab-icon-sound:-moz-lwtheme-brighttext[blocked] { - filter: url(chrome://browser/skin/filters.svg#fill) drop-shadow(1px 1px 1px black); + filter: url(chrome://global/skin/filters.svg#fill) drop-shadow(1px 1px 1px black); } .tab-icon-sound[soundplaying]:not(:hover), @@ -3277,7 +3255,7 @@ html|span.ac-emphasize-text-url { .alltabs-endimage[muted], .alltabs-endimage[blocked] { list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio); - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } @@ -3964,7 +3942,7 @@ html|*.pointerlockfswarning-exit-button { /* NOTE: THESE NEED TO STAY IN SYNC WITH LIGHT-THEME.CSS AND DARK-THEME.CSS. We are copy/pasting variables from light-theme and dark-theme, since they aren't loaded in this context (within browser.css). */ -:root[devtoolstheme="light"] #developer-toolbar { +#browser-bottombox[devtoolstheme="light"] #developer-toolbar { --gcli-background-color: #fcfcfc; /* --theme-tab-toolbar-background */ --gcli-input-background: #fcfcfc; /* --theme-toolbar-background */ --gcli-input-focused-background: #ffffff; /* --theme-sidebar-background */ @@ -3976,7 +3954,7 @@ html|*.pointerlockfswarning-exit-button { --command-line-image-focus: url(chrome://devtools/skin/images/commandline-icon.svg#light-theme-focus); /* --theme-command-line-image-focus */ } -:root[devtoolstheme="dark"] #developer-toolbar { +#browser-bottombox[devtoolstheme="dark"] #developer-toolbar { --gcli-background-color: #272b35; /* --theme-toolbar-background */ --gcli-input-background: #272b35; /* --theme-tab-toolbar-background */ --gcli-input-focused-background: #272b35; /* --theme-tab-toolbar-background */ @@ -4009,8 +3987,8 @@ html|*.pointerlockfswarning-exit-button { margin: auto 10px; } -:root[devtoolstheme="light"] #developer-toolbar > .developer-toolbar-button:not([checked=true]) > image, -:root[devtoolstheme="light"] .gclitoolbar-input-node:not([focused=true])::before { +#browser-bottombox[devtoolstheme="light"] #developer-toolbar > .developer-toolbar-button:not([checked=true]) > image, +#browser-bottombox[devtoolstheme="light"] .gclitoolbar-input-node:not([focused=true])::before { filter: invert(1); } @@ -4020,7 +3998,7 @@ html|*.pointerlockfswarning-exit-button { } /* The toolkit close button is low contrast in the dark theme so invert it. */ -:root[devtoolstheme="dark"] #developer-toolbar > .close-icon:not(:hover) > image { +#browser-bottombox[devtoolstheme="dark"] #developer-toolbar > .close-icon:not(:hover) > image { filter: invert(1); } @@ -4614,7 +4592,7 @@ toolbar[brighttext] #downloads-indicator-counter { width: 20px; height: 20px; border-radius: 2px; - background-image: url("chrome://browser/skin/theme-switcher-icon.png"); + background-image: url("chrome://browser/content/default-theme-icon.svg"); background-size: contain; } @@ -4783,7 +4761,7 @@ toolbarpaletteitem[place="toolbar"]:not([mousedown="true"]):-moz-focusring { } .customization-lwtheme-menu-theme[defaulttheme] { - list-style-image: url(chrome://browser/skin/theme-switcher-icon.png); + list-style-image: url(chrome://browser/content/default-theme-icon.svg); } .customization-lwtheme-menu-theme[active="true"], @@ -5292,7 +5270,7 @@ notification.heartbeat { } /** - * Override the --panel-arrowcontent-padding so the background extends + * Override the --arrowpanel-padding so the background extends * to the sides and bottom of the panel. */ #UITourTooltipButtons { @@ -5314,7 +5292,7 @@ notification.heartbeat { width: 16px; height: 16px; margin: 7px; - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } diff --git a/arc-firefox-theme/chrome/browser/sass/browser-dark.css b/arc-firefox-theme/chrome/browser/sass/browser-dark.css index 4a15269..1171e26 100644 --- a/arc-firefox-theme/chrome/browser/sass/browser-dark.css +++ b/arc-firefox-theme/chrome/browser/sass/browser-dark.css @@ -760,7 +760,7 @@ toolbarpaletteitem[place="palette"] > :-moz-any(#back-button, #forward-button, # :-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, #containers-panelmenu)[cui-areatype="menu-panel"][panel-multiview-anchor=true] > .toolbarbutton-icon, :-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, #containers-panelmenu)[cui-areatype="menu-panel"][panel-multiview-anchor=true] > .toolbarbutton-badge-stack > .toolbarbutton-icon, :-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, #containers-panelmenu)[cui-areatype="menu-panel"][panel-multiview-anchor=true] > .toolbarbutton-menubutton-button > .toolbarbutton-icon { - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } #home-button[cui-areatype="menu-panel"], @@ -1154,6 +1154,9 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { list-style-image: url(chrome://browser/skin/connection-secure.svg); visibility: visible; } +#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon, +#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon, +#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon, #urlbar[pageproxystate="valid"] > #identity-box.certUserOverridden > #connection-icon { list-style-image: url(chrome://browser/skin/connection-mixed-passive-loaded.svg#icon); visibility: visible; } @@ -1163,12 +1166,6 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { list-style-image: url(chrome://browser/skin/connection-mixed-active-loaded.svg#icon); visibility: visible; } -#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon, -#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon, -#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon { - list-style-image: url(chrome://browser/skin/connection-mixed-passive-loaded.svg#icon); - visibility: visible; } - #identity-icon:-moz-lwtheme { list-style-image: url(chrome://browser/skin/identity-icon.svg#normal-black); } @@ -1198,6 +1195,9 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { list-style-image: url(chrome://browser/skin/connection-secure.svg); visibility: visible; } +#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon:-moz-lwtheme, +#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon:-moz-lwtheme, +#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon:-moz-lwtheme, #urlbar[pageproxystate="valid"] > #identity-box.certUserOverridden > #connection-icon:-moz-lwtheme { list-style-image: url(chrome://browser/skin/connection-mixed-passive-loaded.svg#icon-black); visibility: visible; } @@ -1207,12 +1207,6 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { list-style-image: url(chrome://browser/skin/connection-mixed-active-loaded.svg#icon-black); visibility: visible; } -#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon:-moz-lwtheme, -#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon:-moz-lwtheme, -#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon:-moz-lwtheme { - list-style-image: url(chrome://browser/skin/connection-mixed-passive-loaded.svg#icon-black); - visibility: visible; } - #identity-box { --identity-box-verified-color: #479900; --identity-box-chrome-color: #e57300; @@ -1281,9 +1275,10 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { #identity-box[sharing] > #identity-icon, #sharing-icon { - animation: 3s linear pulse infinite; } + animation: 3s linear identity-box-sharing-icon-pulse infinite; } -@keyframes pulse { +/* This should remain identical to tab-sharing-icon-pulse in tabs.inc.css */ +@keyframes identity-box-sharing-icon-pulse { 0%, 16.66%, 83.33%, 100% { opacity: 0; } 33.33%, 66.66% { @@ -1331,24 +1326,13 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { type of icon displayed. This rule must be defined before the others in order for its list-style-image to be overridden. */ .notification-anchor-icon { - list-style-image: url(moz-icon://stock/gtk-dialog-info?size=16); } - -@media (min-resolution: 1.1dppx) { - .notification-anchor-icon { - list-style-image: url(moz-icon://stock/gtk-dialog-info?size=dialog); } } -.popup-notification-icon { - width: 64px; - height: 64px; - margin-inline-end: 10px; } + list-style-image: url(chrome://browser/skin/notification-icons.svg#default-info); } .notification-anchor-icon:not(.plugin-blocked):-moz-lwtheme, #blocked-permissions-container > .blocked-permission-icon:-moz-lwtheme { - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } -.notification-anchor-icon:not(.plugin-blocked):not(:hover) { - opacity: .8; } - /* INDIVIDUAL NOTIFICATIONS */ .popup-notification-icon[popupid="web-notifications"], .desktop-notification-icon { @@ -1536,6 +1520,25 @@ html|*#webRTC-previewVideo { .addon-install-confirmation-name { font-weight: bold; } +.addon-webext-perm-header { + font-size: 1.3em; } + +.addon-webext-name { + font-weight: bold; + margin: 0; } + +.addon-addon-icon { + width: 14px; + height: 14px; + list-style-image: url("chrome://browser/skin/menuPanel.svg"); + -moz-image-region: rect(0px, 288px, 32px, 256px); } + +.addon-toolbar-icon { + width: 14px; + height: 14px; + list-style-image: url("chrome://browser/skin/Toolbar.png"); + -moz-image-region: rect(0, 486px, 18px, 468px); } + /* Notification icon box */ .notification-anchor-icon:-moz-focusring { outline: 1px dotted -moz-DialogText; } @@ -1733,12 +1736,12 @@ notification[value="translation"] menulist > .menulist-dropmarker { border-radius: 2px; border: 1px solid transparent; } -.autocomplete-richlistitem[selected=true] { - background-color: Highlight; } - .ac-title { font-size: 1.05em; } +.ac-separator, +.ac-url, +.ac-action, .ac-tags { font-size: 0.9em; } @@ -1749,18 +1752,11 @@ html|span.ac-tag { border: 1px solid transparent; padding: 0 1px; } -.ac-separator, -.ac-url, -.ac-action { - font-size: 0.9em; +.ac-separator:not([selected=true]), +.ac-url:not([selected=true]), +.ac-action:not([selected=true]) { 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; } @@ -1776,26 +1772,14 @@ html|span.ac-emphasize-text-url { .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-type-icon[type=keyword], -.ac-site-icon[type=searchengine], -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) { +.ac-site-icon[type=searchengine] { list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon); } .ac-type-icon[type=keyword][selected], -.ac-site-icon[type=searchengine][selected], -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage, selected) { +.ac-site-icon[type=searchengine][selected] { list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon-inverted); } -.autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) { - list-style-image: url("chrome://browser/skin/places/tag.png"); - width: 16px; - height: 16px; } - .ac-type-icon[type=switchtab], .ac-type-icon[type=remotetab] { list-style-image: url("chrome://browser/skin/urlbar-tab.svg#tab"); } @@ -2158,9 +2142,10 @@ html|span.ac-emphasize-text-url { .tab-icon-image[sharing]:not([selected]), .tab-sharing-icon-overlay { - animation: 3s linear pulse infinite; } + animation: 3s linear tab-sharing-icon-pulse infinite; } -@keyframes pulse { +/* This should remain identical to identity-box-sharing-icon-pulse in identity-block.inc.css */ +@keyframes tab-sharing-icon-pulse { 0%, 16.66%, 83.33%, 100% { opacity: 0; } 33.33%, 66.66% { @@ -2236,7 +2221,7 @@ html|span.ac-emphasize-text-url { .tab-icon-sound[muted], .tab-icon-sound[blocked] { list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio); - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } .tab-icon-sound[muted] { @@ -2248,12 +2233,12 @@ html|span.ac-emphasize-text-url { .tab-icon-sound:-moz-lwtheme-darktext[soundplaying], .tab-icon-sound:-moz-lwtheme-darktext[muted], .tab-icon-sound:-moz-lwtheme-darktext[blocked] { - filter: url(chrome://browser/skin/filters.svg#fill) drop-shadow(1px 1px 1px white); } + filter: url(chrome://global/skin/filters.svg#fill) drop-shadow(1px 1px 1px white); } .tab-icon-sound:-moz-lwtheme-brighttext[soundplaying], .tab-icon-sound:-moz-lwtheme-brighttext[muted], .tab-icon-sound:-moz-lwtheme-brighttext[blocked] { - filter: url(chrome://browser/skin/filters.svg#fill) drop-shadow(1px 1px 1px black); } + filter: url(chrome://global/skin/filters.svg#fill) drop-shadow(1px 1px 1px black); } .tab-icon-sound[soundplaying]:not(:hover), .tab-icon-sound[muted]:not(:hover), @@ -2454,7 +2439,7 @@ lwtHeader;*/ .alltabs-endimage[muted], .alltabs-endimage[blocked] { list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio); - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } .alltabs-endimage[muted] { @@ -2987,7 +2972,7 @@ html|*.pointerlockfswarning-exit-button { /* NOTE: THESE NEED TO STAY IN SYNC WITH LIGHT-THEME.CSS AND DARK-THEME.CSS. We are copy/pasting variables from light-theme and dark-theme, since they aren't loaded in this context (within browser.css). */ -:root[devtoolstheme="light"] #developer-toolbar { +#browser-bottombox[devtoolstheme="light"] #developer-toolbar { --gcli-background-color: #fcfcfc; /* --theme-tab-toolbar-background */ --gcli-input-background: #fcfcfc; @@ -3007,7 +2992,7 @@ html|*.pointerlockfswarning-exit-button { --command-line-image-focus: url(chrome://devtools/skin/images/commandline-icon.svg#light-theme-focus); /* --theme-command-line-image-focus */ } -:root[devtoolstheme="dark"] #developer-toolbar { +#browser-bottombox[devtoolstheme="dark"] #developer-toolbar { --gcli-background-color: #272b35; /* --theme-toolbar-background */ --gcli-input-background: #272b35; @@ -3045,8 +3030,8 @@ html|*.pointerlockfswarning-exit-button { .developer-toolbar-button > image { margin: auto 10px; } -:root[devtoolstheme="light"] #developer-toolbar > .developer-toolbar-button:not([checked=true]) > image, -:root[devtoolstheme="light"] .gclitoolbar-input-node:not([focused=true])::before { +#browser-bottombox[devtoolstheme="light"] #developer-toolbar > .developer-toolbar-button:not([checked=true]) > image, +#browser-bottombox[devtoolstheme="light"] .gclitoolbar-input-node:not([focused=true])::before { filter: invert(1); } .developer-toolbar-button > .toolbarbutton-icon { @@ -3054,7 +3039,7 @@ html|*.pointerlockfswarning-exit-button { height: 16px; } /* The toolkit close button is low contrast in the dark theme so invert it. */ -:root[devtoolstheme="dark"] #developer-toolbar > .close-icon:not(:hover) > image { +#browser-bottombox[devtoolstheme="dark"] #developer-toolbar > .close-icon:not(:hover) > image { filter: invert(1); } #developer-toolbar-toolbox-button { @@ -3534,7 +3519,7 @@ toolbar[brighttext] #downloads-indicator-counter { width: 20px; height: 20px; border-radius: 2px; - background-image: url("chrome://browser/skin/theme-switcher-icon.png"); + background-image: url("chrome://browser/content/default-theme-icon.svg"); background-size: contain; } #main-window[customize-entered] #customization-panel-container { @@ -3671,7 +3656,7 @@ toolbarpaletteitem[place="toolbar"]:not([mousedown="true"]):-moz-focusring { padding-inline-start: 0; } .customization-lwtheme-menu-theme[defaulttheme] { - list-style-image: url(chrome://browser/skin/theme-switcher-icon.png); } + list-style-image: url(chrome://browser/content/default-theme-icon.svg); } .customization-lwtheme-menu-theme[active="true"], .customization-lwtheme-menu-theme:hover { @@ -4086,7 +4071,7 @@ notification.heartbeat { width: 16px; } /** - * Override the --panel-arrowcontent-padding so the background extends + * Override the --arrowpanel-padding so the background extends * to the sides and bottom of the panel. */ #UITourTooltipButtons { @@ -4105,7 +4090,7 @@ notification.heartbeat { width: 16px; height: 16px; margin: 7px; - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } #context-back { diff --git a/arc-firefox-theme/chrome/browser/sass/browser-darker.css b/arc-firefox-theme/chrome/browser/sass/browser-darker.css index f48dd3c..ddc4dfd 100644 --- a/arc-firefox-theme/chrome/browser/sass/browser-darker.css +++ b/arc-firefox-theme/chrome/browser/sass/browser-darker.css @@ -760,7 +760,7 @@ toolbarpaletteitem[place="palette"] > :-moz-any(#back-button, #forward-button, # :-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, #containers-panelmenu)[cui-areatype="menu-panel"][panel-multiview-anchor=true] > .toolbarbutton-icon, :-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, #containers-panelmenu)[cui-areatype="menu-panel"][panel-multiview-anchor=true] > .toolbarbutton-badge-stack > .toolbarbutton-icon, :-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, #containers-panelmenu)[cui-areatype="menu-panel"][panel-multiview-anchor=true] > .toolbarbutton-menubutton-button > .toolbarbutton-icon { - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } #home-button[cui-areatype="menu-panel"], @@ -1153,6 +1153,9 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { list-style-image: url(chrome://browser/skin/connection-secure.svg); visibility: visible; } +#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon, +#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon, +#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon, #urlbar[pageproxystate="valid"] > #identity-box.certUserOverridden > #connection-icon { list-style-image: url(chrome://browser/skin/connection-mixed-passive-loaded.svg#icon); visibility: visible; } @@ -1162,12 +1165,6 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { list-style-image: url(chrome://browser/skin/connection-mixed-active-loaded.svg#icon); visibility: visible; } -#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon, -#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon, -#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon { - list-style-image: url(chrome://browser/skin/connection-mixed-passive-loaded.svg#icon); - visibility: visible; } - #identity-icon:-moz-lwtheme { list-style-image: url(chrome://browser/skin/identity-icon.svg#normal-black); } @@ -1197,6 +1194,9 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { list-style-image: url(chrome://browser/skin/connection-secure.svg); visibility: visible; } +#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon:-moz-lwtheme, +#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon:-moz-lwtheme, +#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon:-moz-lwtheme, #urlbar[pageproxystate="valid"] > #identity-box.certUserOverridden > #connection-icon:-moz-lwtheme { list-style-image: url(chrome://browser/skin/connection-mixed-passive-loaded.svg#icon-black); visibility: visible; } @@ -1206,12 +1206,6 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { list-style-image: url(chrome://browser/skin/connection-mixed-active-loaded.svg#icon-black); visibility: visible; } -#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon:-moz-lwtheme, -#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon:-moz-lwtheme, -#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon:-moz-lwtheme { - list-style-image: url(chrome://browser/skin/connection-mixed-passive-loaded.svg#icon-black); - visibility: visible; } - #identity-box { --identity-box-verified-color: #479900; --identity-box-chrome-color: #e57300; @@ -1280,9 +1274,10 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { #identity-box[sharing] > #identity-icon, #sharing-icon { - animation: 3s linear pulse infinite; } + animation: 3s linear identity-box-sharing-icon-pulse infinite; } -@keyframes pulse { +/* This should remain identical to tab-sharing-icon-pulse in tabs.inc.css */ +@keyframes identity-box-sharing-icon-pulse { 0%, 16.66%, 83.33%, 100% { opacity: 0; } 33.33%, 66.66% { @@ -1330,24 +1325,13 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { type of icon displayed. This rule must be defined before the others in order for its list-style-image to be overridden. */ .notification-anchor-icon { - list-style-image: url(moz-icon://stock/gtk-dialog-info?size=16); } - -@media (min-resolution: 1.1dppx) { - .notification-anchor-icon { - list-style-image: url(moz-icon://stock/gtk-dialog-info?size=dialog); } } -.popup-notification-icon { - width: 64px; - height: 64px; - margin-inline-end: 10px; } + list-style-image: url(chrome://browser/skin/notification-icons.svg#default-info); } .notification-anchor-icon:not(.plugin-blocked):-moz-lwtheme, #blocked-permissions-container > .blocked-permission-icon:-moz-lwtheme { - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } -.notification-anchor-icon:not(.plugin-blocked):not(:hover) { - opacity: .8; } - /* INDIVIDUAL NOTIFICATIONS */ .popup-notification-icon[popupid="web-notifications"], .desktop-notification-icon { @@ -1535,6 +1519,25 @@ html|*#webRTC-previewVideo { .addon-install-confirmation-name { font-weight: bold; } +.addon-webext-perm-header { + font-size: 1.3em; } + +.addon-webext-name { + font-weight: bold; + margin: 0; } + +.addon-addon-icon { + width: 14px; + height: 14px; + list-style-image: url("chrome://browser/skin/menuPanel.svg"); + -moz-image-region: rect(0px, 288px, 32px, 256px); } + +.addon-toolbar-icon { + width: 14px; + height: 14px; + list-style-image: url("chrome://browser/skin/Toolbar.png"); + -moz-image-region: rect(0, 486px, 18px, 468px); } + /* Notification icon box */ .notification-anchor-icon:-moz-focusring { outline: 1px dotted -moz-DialogText; } @@ -1732,12 +1735,12 @@ notification[value="translation"] menulist > .menulist-dropmarker { border-radius: 2px; border: 1px solid transparent; } -.autocomplete-richlistitem[selected=true] { - background-color: Highlight; } - .ac-title { font-size: 1.05em; } +.ac-separator, +.ac-url, +.ac-action, .ac-tags { font-size: 0.9em; } @@ -1748,18 +1751,11 @@ html|span.ac-tag { border: 1px solid transparent; padding: 0 1px; } -.ac-separator, -.ac-url, -.ac-action { - font-size: 0.9em; +.ac-separator:not([selected=true]), +.ac-url:not([selected=true]), +.ac-action:not([selected=true]) { 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; } @@ -1775,26 +1771,14 @@ html|span.ac-emphasize-text-url { .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-type-icon[type=keyword], -.ac-site-icon[type=searchengine], -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) { +.ac-site-icon[type=searchengine] { list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon); } .ac-type-icon[type=keyword][selected], -.ac-site-icon[type=searchengine][selected], -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage, selected) { +.ac-site-icon[type=searchengine][selected] { list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon-inverted); } -.autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) { - list-style-image: url("chrome://browser/skin/places/tag.png"); - width: 16px; - height: 16px; } - .ac-type-icon[type=switchtab], .ac-type-icon[type=remotetab] { list-style-image: url("chrome://browser/skin/urlbar-tab.svg#tab"); } @@ -2158,9 +2142,10 @@ html|span.ac-emphasize-text-url { .tab-icon-image[sharing]:not([selected]), .tab-sharing-icon-overlay { - animation: 3s linear pulse infinite; } + animation: 3s linear tab-sharing-icon-pulse infinite; } -@keyframes pulse { +/* This should remain identical to identity-box-sharing-icon-pulse in identity-block.inc.css */ +@keyframes tab-sharing-icon-pulse { 0%, 16.66%, 83.33%, 100% { opacity: 0; } 33.33%, 66.66% { @@ -2236,7 +2221,7 @@ html|span.ac-emphasize-text-url { .tab-icon-sound[muted], .tab-icon-sound[blocked] { list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio); - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } .tab-icon-sound[muted] { @@ -2248,12 +2233,12 @@ html|span.ac-emphasize-text-url { .tab-icon-sound:-moz-lwtheme-darktext[soundplaying], .tab-icon-sound:-moz-lwtheme-darktext[muted], .tab-icon-sound:-moz-lwtheme-darktext[blocked] { - filter: url(chrome://browser/skin/filters.svg#fill) drop-shadow(1px 1px 1px white); } + filter: url(chrome://global/skin/filters.svg#fill) drop-shadow(1px 1px 1px white); } .tab-icon-sound:-moz-lwtheme-brighttext[soundplaying], .tab-icon-sound:-moz-lwtheme-brighttext[muted], .tab-icon-sound:-moz-lwtheme-brighttext[blocked] { - filter: url(chrome://browser/skin/filters.svg#fill) drop-shadow(1px 1px 1px black); } + filter: url(chrome://global/skin/filters.svg#fill) drop-shadow(1px 1px 1px black); } .tab-icon-sound[soundplaying]:not(:hover), .tab-icon-sound[muted]:not(:hover), @@ -2454,7 +2439,7 @@ lwtHeader;*/ .alltabs-endimage[muted], .alltabs-endimage[blocked] { list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio); - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } .alltabs-endimage[muted] { @@ -2987,7 +2972,7 @@ html|*.pointerlockfswarning-exit-button { /* NOTE: THESE NEED TO STAY IN SYNC WITH LIGHT-THEME.CSS AND DARK-THEME.CSS. We are copy/pasting variables from light-theme and dark-theme, since they aren't loaded in this context (within browser.css). */ -:root[devtoolstheme="light"] #developer-toolbar { +#browser-bottombox[devtoolstheme="light"] #developer-toolbar { --gcli-background-color: #fcfcfc; /* --theme-tab-toolbar-background */ --gcli-input-background: #fcfcfc; @@ -3007,7 +2992,7 @@ html|*.pointerlockfswarning-exit-button { --command-line-image-focus: url(chrome://devtools/skin/images/commandline-icon.svg#light-theme-focus); /* --theme-command-line-image-focus */ } -:root[devtoolstheme="dark"] #developer-toolbar { +#browser-bottombox[devtoolstheme="dark"] #developer-toolbar { --gcli-background-color: #272b35; /* --theme-toolbar-background */ --gcli-input-background: #272b35; @@ -3045,8 +3030,8 @@ html|*.pointerlockfswarning-exit-button { .developer-toolbar-button > image { margin: auto 10px; } -:root[devtoolstheme="light"] #developer-toolbar > .developer-toolbar-button:not([checked=true]) > image, -:root[devtoolstheme="light"] .gclitoolbar-input-node:not([focused=true])::before { +#browser-bottombox[devtoolstheme="light"] #developer-toolbar > .developer-toolbar-button:not([checked=true]) > image, +#browser-bottombox[devtoolstheme="light"] .gclitoolbar-input-node:not([focused=true])::before { filter: invert(1); } .developer-toolbar-button > .toolbarbutton-icon { @@ -3054,7 +3039,7 @@ html|*.pointerlockfswarning-exit-button { height: 16px; } /* The toolkit close button is low contrast in the dark theme so invert it. */ -:root[devtoolstheme="dark"] #developer-toolbar > .close-icon:not(:hover) > image { +#browser-bottombox[devtoolstheme="dark"] #developer-toolbar > .close-icon:not(:hover) > image { filter: invert(1); } #developer-toolbar-toolbox-button { @@ -3534,7 +3519,7 @@ toolbar[brighttext] #downloads-indicator-counter { width: 20px; height: 20px; border-radius: 2px; - background-image: url("chrome://browser/skin/theme-switcher-icon.png"); + background-image: url("chrome://browser/content/default-theme-icon.svg"); background-size: contain; } #main-window[customize-entered] #customization-panel-container { @@ -3671,7 +3656,7 @@ toolbarpaletteitem[place="toolbar"]:not([mousedown="true"]):-moz-focusring { padding-inline-start: 0; } .customization-lwtheme-menu-theme[defaulttheme] { - list-style-image: url(chrome://browser/skin/theme-switcher-icon.png); } + list-style-image: url(chrome://browser/content/default-theme-icon.svg); } .customization-lwtheme-menu-theme[active="true"], .customization-lwtheme-menu-theme:hover { @@ -4086,7 +4071,7 @@ notification.heartbeat { width: 16px; } /** - * Override the --panel-arrowcontent-padding so the background extends + * Override the --arrowpanel-padding so the background extends * to the sides and bottom of the panel. */ #UITourTooltipButtons { @@ -4105,7 +4090,7 @@ notification.heartbeat { width: 16px; height: 16px; margin: 7px; - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } #context-back { diff --git a/arc-firefox-theme/chrome/browser/sass/browser-light.css b/arc-firefox-theme/chrome/browser/sass/browser-light.css index 6ccccc4..e3de08a 100644 --- a/arc-firefox-theme/chrome/browser/sass/browser-light.css +++ b/arc-firefox-theme/chrome/browser/sass/browser-light.css @@ -760,7 +760,7 @@ toolbarpaletteitem[place="palette"] > :-moz-any(#back-button, #forward-button, # :-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, #containers-panelmenu)[cui-areatype="menu-panel"][panel-multiview-anchor=true] > .toolbarbutton-icon, :-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, #containers-panelmenu)[cui-areatype="menu-panel"][panel-multiview-anchor=true] > .toolbarbutton-badge-stack > .toolbarbutton-icon, :-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, #containers-panelmenu)[cui-areatype="menu-panel"][panel-multiview-anchor=true] > .toolbarbutton-menubutton-button > .toolbarbutton-icon { - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } #home-button[cui-areatype="menu-panel"], @@ -1153,6 +1153,9 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { list-style-image: url(chrome://browser/skin/connection-secure.svg); visibility: visible; } +#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon, +#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon, +#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon, #urlbar[pageproxystate="valid"] > #identity-box.certUserOverridden > #connection-icon { list-style-image: url(chrome://browser/skin/connection-mixed-passive-loaded.svg#icon); visibility: visible; } @@ -1162,12 +1165,6 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { list-style-image: url(chrome://browser/skin/connection-mixed-active-loaded.svg#icon); visibility: visible; } -#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon, -#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon, -#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon { - list-style-image: url(chrome://browser/skin/connection-mixed-passive-loaded.svg#icon); - visibility: visible; } - #identity-icon:-moz-lwtheme { list-style-image: url(chrome://browser/skin/identity-icon.svg#normal-black); } @@ -1197,6 +1194,9 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { list-style-image: url(chrome://browser/skin/connection-secure.svg); visibility: visible; } +#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon:-moz-lwtheme, +#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon:-moz-lwtheme, +#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon:-moz-lwtheme, #urlbar[pageproxystate="valid"] > #identity-box.certUserOverridden > #connection-icon:-moz-lwtheme { list-style-image: url(chrome://browser/skin/connection-mixed-passive-loaded.svg#icon-black); visibility: visible; } @@ -1206,12 +1206,6 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { list-style-image: url(chrome://browser/skin/connection-mixed-active-loaded.svg#icon-black); visibility: visible; } -#urlbar[pageproxystate="valid"] > #identity-box.weakCipher > #connection-icon:-moz-lwtheme, -#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContent > #connection-icon:-moz-lwtheme, -#urlbar[pageproxystate="valid"] > #identity-box.mixedDisplayContentLoadedActiveBlocked > #connection-icon:-moz-lwtheme { - list-style-image: url(chrome://browser/skin/connection-mixed-passive-loaded.svg#icon-black); - visibility: visible; } - #identity-box { --identity-box-verified-color: #479900; --identity-box-chrome-color: #e57300; @@ -1280,9 +1274,10 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { #identity-box[sharing] > #identity-icon, #sharing-icon { - animation: 3s linear pulse infinite; } + animation: 3s linear identity-box-sharing-icon-pulse infinite; } -@keyframes pulse { +/* This should remain identical to tab-sharing-icon-pulse in tabs.inc.css */ +@keyframes identity-box-sharing-icon-pulse { 0%, 16.66%, 83.33%, 100% { opacity: 0; } 33.33%, 66.66% { @@ -1330,24 +1325,13 @@ toolbarpaletteitem[place="palette"] > #zoom-controls > #zoom-in-button { type of icon displayed. This rule must be defined before the others in order for its list-style-image to be overridden. */ .notification-anchor-icon { - list-style-image: url(moz-icon://stock/gtk-dialog-info?size=16); } - -@media (min-resolution: 1.1dppx) { - .notification-anchor-icon { - list-style-image: url(moz-icon://stock/gtk-dialog-info?size=dialog); } } -.popup-notification-icon { - width: 64px; - height: 64px; - margin-inline-end: 10px; } + list-style-image: url(chrome://browser/skin/notification-icons.svg#default-info); } .notification-anchor-icon:not(.plugin-blocked):-moz-lwtheme, #blocked-permissions-container > .blocked-permission-icon:-moz-lwtheme { - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } -.notification-anchor-icon:not(.plugin-blocked):not(:hover) { - opacity: .8; } - /* INDIVIDUAL NOTIFICATIONS */ .popup-notification-icon[popupid="web-notifications"], .desktop-notification-icon { @@ -1535,6 +1519,25 @@ html|*#webRTC-previewVideo { .addon-install-confirmation-name { font-weight: bold; } +.addon-webext-perm-header { + font-size: 1.3em; } + +.addon-webext-name { + font-weight: bold; + margin: 0; } + +.addon-addon-icon { + width: 14px; + height: 14px; + list-style-image: url("chrome://browser/skin/menuPanel.svg"); + -moz-image-region: rect(0px, 288px, 32px, 256px); } + +.addon-toolbar-icon { + width: 14px; + height: 14px; + list-style-image: url("chrome://browser/skin/Toolbar.png"); + -moz-image-region: rect(0, 486px, 18px, 468px); } + /* Notification icon box */ .notification-anchor-icon:-moz-focusring { outline: 1px dotted -moz-DialogText; } @@ -1732,12 +1735,12 @@ notification[value="translation"] menulist > .menulist-dropmarker { border-radius: 2px; border: 1px solid transparent; } -.autocomplete-richlistitem[selected=true] { - background-color: Highlight; } - .ac-title { font-size: 1.05em; } +.ac-separator, +.ac-url, +.ac-action, .ac-tags { font-size: 0.9em; } @@ -1748,18 +1751,11 @@ html|span.ac-tag { border: 1px solid transparent; padding: 0 1px; } -.ac-separator, -.ac-url, -.ac-action { - font-size: 0.9em; +.ac-separator:not([selected=true]), +.ac-url:not([selected=true]), +.ac-action:not([selected=true]) { 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; } @@ -1775,26 +1771,14 @@ html|span.ac-emphasize-text-url { .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-type-icon[type=keyword], -.ac-site-icon[type=searchengine], -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage) { +.ac-site-icon[type=searchengine] { list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon); } .ac-type-icon[type=keyword][selected], -.ac-site-icon[type=searchengine][selected], -.autocomplete-treebody::-moz-tree-image(keyword, treecolAutoCompleteImage, selected) { +.ac-site-icon[type=searchengine][selected] { list-style-image: url(chrome://global/skin/icons/autocomplete-search.svg#search-icon-inverted); } -.autocomplete-treebody::-moz-tree-image(tag, treecolAutoCompleteImage) { - list-style-image: url("chrome://browser/skin/places/tag.png"); - width: 16px; - height: 16px; } - .ac-type-icon[type=switchtab], .ac-type-icon[type=remotetab] { list-style-image: url("chrome://browser/skin/urlbar-tab.svg#tab"); } @@ -2158,9 +2142,10 @@ html|span.ac-emphasize-text-url { .tab-icon-image[sharing]:not([selected]), .tab-sharing-icon-overlay { - animation: 3s linear pulse infinite; } + animation: 3s linear tab-sharing-icon-pulse infinite; } -@keyframes pulse { +/* This should remain identical to identity-box-sharing-icon-pulse in identity-block.inc.css */ +@keyframes tab-sharing-icon-pulse { 0%, 16.66%, 83.33%, 100% { opacity: 0; } 33.33%, 66.66% { @@ -2236,7 +2221,7 @@ html|span.ac-emphasize-text-url { .tab-icon-sound[muted], .tab-icon-sound[blocked] { list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio); - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } .tab-icon-sound[muted] { @@ -2248,12 +2233,12 @@ html|span.ac-emphasize-text-url { .tab-icon-sound:-moz-lwtheme-darktext[soundplaying], .tab-icon-sound:-moz-lwtheme-darktext[muted], .tab-icon-sound:-moz-lwtheme-darktext[blocked] { - filter: url(chrome://browser/skin/filters.svg#fill) drop-shadow(1px 1px 1px white); } + filter: url(chrome://global/skin/filters.svg#fill) drop-shadow(1px 1px 1px white); } .tab-icon-sound:-moz-lwtheme-brighttext[soundplaying], .tab-icon-sound:-moz-lwtheme-brighttext[muted], .tab-icon-sound:-moz-lwtheme-brighttext[blocked] { - filter: url(chrome://browser/skin/filters.svg#fill) drop-shadow(1px 1px 1px black); } + filter: url(chrome://global/skin/filters.svg#fill) drop-shadow(1px 1px 1px black); } .tab-icon-sound[soundplaying]:not(:hover), .tab-icon-sound[muted]:not(:hover), @@ -2454,7 +2439,7 @@ lwtHeader;*/ .alltabs-endimage[muted], .alltabs-endimage[blocked] { list-style-image: url(chrome://browser/skin/tabbrowser/tab-audio.svg#tab-audio); - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } .alltabs-endimage[muted] { @@ -2987,7 +2972,7 @@ html|*.pointerlockfswarning-exit-button { /* NOTE: THESE NEED TO STAY IN SYNC WITH LIGHT-THEME.CSS AND DARK-THEME.CSS. We are copy/pasting variables from light-theme and dark-theme, since they aren't loaded in this context (within browser.css). */ -:root[devtoolstheme="light"] #developer-toolbar { +#browser-bottombox[devtoolstheme="light"] #developer-toolbar { --gcli-background-color: #fcfcfc; /* --theme-tab-toolbar-background */ --gcli-input-background: #fcfcfc; @@ -3007,7 +2992,7 @@ html|*.pointerlockfswarning-exit-button { --command-line-image-focus: url(chrome://devtools/skin/images/commandline-icon.svg#light-theme-focus); /* --theme-command-line-image-focus */ } -:root[devtoolstheme="dark"] #developer-toolbar { +#browser-bottombox[devtoolstheme="dark"] #developer-toolbar { --gcli-background-color: #272b35; /* --theme-toolbar-background */ --gcli-input-background: #272b35; @@ -3045,8 +3030,8 @@ html|*.pointerlockfswarning-exit-button { .developer-toolbar-button > image { margin: auto 10px; } -:root[devtoolstheme="light"] #developer-toolbar > .developer-toolbar-button:not([checked=true]) > image, -:root[devtoolstheme="light"] .gclitoolbar-input-node:not([focused=true])::before { +#browser-bottombox[devtoolstheme="light"] #developer-toolbar > .developer-toolbar-button:not([checked=true]) > image, +#browser-bottombox[devtoolstheme="light"] .gclitoolbar-input-node:not([focused=true])::before { filter: invert(1); } .developer-toolbar-button > .toolbarbutton-icon { @@ -3054,7 +3039,7 @@ html|*.pointerlockfswarning-exit-button { height: 16px; } /* The toolkit close button is low contrast in the dark theme so invert it. */ -:root[devtoolstheme="dark"] #developer-toolbar > .close-icon:not(:hover) > image { +#browser-bottombox[devtoolstheme="dark"] #developer-toolbar > .close-icon:not(:hover) > image { filter: invert(1); } #developer-toolbar-toolbox-button { @@ -3534,7 +3519,7 @@ toolbar[brighttext] #downloads-indicator-counter { width: 20px; height: 20px; border-radius: 2px; - background-image: url("chrome://browser/skin/theme-switcher-icon.png"); + background-image: url("chrome://browser/content/default-theme-icon.svg"); background-size: contain; } #main-window[customize-entered] #customization-panel-container { @@ -3671,7 +3656,7 @@ toolbarpaletteitem[place="toolbar"]:not([mousedown="true"]):-moz-focusring { padding-inline-start: 0; } .customization-lwtheme-menu-theme[defaulttheme] { - list-style-image: url(chrome://browser/skin/theme-switcher-icon.png); } + list-style-image: url(chrome://browser/content/default-theme-icon.svg); } .customization-lwtheme-menu-theme[active="true"], .customization-lwtheme-menu-theme:hover { @@ -4086,7 +4071,7 @@ notification.heartbeat { width: 16px; } /** - * Override the --panel-arrowcontent-padding so the background extends + * Override the --arrowpanel-padding so the background extends * to the sides and bottom of the panel. */ #UITourTooltipButtons { @@ -4105,7 +4090,7 @@ notification.heartbeat { width: 16px; height: 16px; margin: 7px; - filter: url(chrome://browser/skin/filters.svg#fill); + filter: url(chrome://global/skin/filters.svg#fill); fill: currentColor; } #context-back { |