From 2e85784df7f5a3a6f5f0762d0172f9fe7de81229 Mon Sep 17 00:00:00 2001 From: Wes Kocher Date: Fri, 28 Apr 2017 12:32:38 -0700 Subject: [PATCH] Backed out changeset 0e3f9e184e6b (bug 1347543) for landing on the wrong tree a=backout MozReview-Commit-ID: 33rhqi8g77s --HG-- extra : rebase_source : a83a2ee1cdf5778fee3eeae289161600374b4c9a --- browser/base/content/browser-places.js | 2 +- browser/extensions/pocket/skin/osx/pocket.css | 30 ++ .../extensions/pocket/skin/shared/pocket.css | 63 +++- browser/themes/linux/browser.css | 1 - browser/themes/linux/downloads/indicator.css | 38 +- browser/themes/osx/browser.css | 325 +++++++++++++++++- browser/themes/osx/downloads/indicator.css | 34 +- browser/themes/shared/compacttheme.inc.css | 8 +- .../themes/shared/downloads/indicator.inc.css | 5 +- browser/themes/shared/icons/addons.svg | 6 - browser/themes/shared/icons/app.svg | 6 - browser/themes/shared/icons/back-large.svg | 6 - browser/themes/shared/icons/back.svg | 6 - .../themes/shared/icons/bookmark-hollow.svg | 6 - browser/themes/shared/icons/bookmark.svg | 6 - browser/themes/shared/icons/bookmarksMenu.svg | 6 - .../themes/shared/icons/characterEncoding.svg | 6 - browser/themes/shared/icons/chevron.svg | 6 - browser/themes/shared/icons/containers.svg | 6 - .../themes/shared/icons/devTools-panel.svg | 6 - browser/themes/shared/icons/developer.svg | 6 - browser/themes/shared/icons/download.svg | 6 - browser/themes/shared/icons/edit-copy.svg | 6 - browser/themes/shared/icons/edit-cut.svg | 6 - browser/themes/shared/icons/edit-paste.svg | 6 - browser/themes/shared/icons/feed.svg | 6 - browser/themes/shared/icons/find.svg | 6 - browser/themes/shared/icons/forget.svg | 6 - browser/themes/shared/icons/forward.svg | 6 - browser/themes/shared/icons/fullscreen.svg | 6 - browser/themes/shared/icons/history.svg | 6 - browser/themes/shared/icons/home.svg | 6 - browser/themes/shared/icons/mail.svg | 6 - browser/themes/shared/icons/menu.svg | 6 - browser/themes/shared/icons/new-tab.svg | 6 - browser/themes/shared/icons/new-window.svg | 6 - browser/themes/shared/icons/open.svg | 6 - browser/themes/shared/icons/pocket.svg | 6 - browser/themes/shared/icons/print.svg | 6 - .../themes/shared/icons/privateBrowsing.svg | 6 - browser/themes/shared/icons/refresh.svg | 6 - browser/themes/shared/icons/save.svg | 6 - browser/themes/shared/icons/settings.svg | 6 - browser/themes/shared/icons/share.svg | 6 - browser/themes/shared/icons/sidebars.svg | 6 - browser/themes/shared/icons/stop.svg | 6 - browser/themes/shared/icons/sync.svg | 6 - browser/themes/shared/icons/syncedTabs.svg | 6 - browser/themes/shared/icons/tabGroups.svg | 6 - browser/themes/shared/icons/webIDE.svg | 6 - browser/themes/shared/icons/webRTC-camera.svg | 6 - browser/themes/shared/icons/zoom-in.svg | 6 - browser/themes/shared/icons/zoom-out.svg | 6 - browser/themes/shared/jar.inc.mn | 48 --- browser/themes/shared/social/social.inc.css | 5 +- .../themes/shared/toolbarbutton-icons.inc.css | 271 ++++++++++++--- browser/themes/windows/browser.css | 3 - .../themes/windows/downloads/indicator.css | 38 +- browser/themes/windows/places/organizer.css | 16 +- 59 files changed, 730 insertions(+), 421 deletions(-) delete mode 100644 browser/themes/shared/icons/addons.svg delete mode 100644 browser/themes/shared/icons/app.svg delete mode 100644 browser/themes/shared/icons/back-large.svg delete mode 100644 browser/themes/shared/icons/back.svg delete mode 100644 browser/themes/shared/icons/bookmark-hollow.svg delete mode 100644 browser/themes/shared/icons/bookmark.svg delete mode 100644 browser/themes/shared/icons/bookmarksMenu.svg delete mode 100644 browser/themes/shared/icons/characterEncoding.svg delete mode 100644 browser/themes/shared/icons/chevron.svg delete mode 100644 browser/themes/shared/icons/containers.svg delete mode 100644 browser/themes/shared/icons/devTools-panel.svg delete mode 100644 browser/themes/shared/icons/developer.svg delete mode 100644 browser/themes/shared/icons/download.svg delete mode 100644 browser/themes/shared/icons/edit-copy.svg delete mode 100644 browser/themes/shared/icons/edit-cut.svg delete mode 100644 browser/themes/shared/icons/edit-paste.svg delete mode 100644 browser/themes/shared/icons/feed.svg delete mode 100644 browser/themes/shared/icons/find.svg delete mode 100644 browser/themes/shared/icons/forget.svg delete mode 100644 browser/themes/shared/icons/forward.svg delete mode 100644 browser/themes/shared/icons/fullscreen.svg delete mode 100644 browser/themes/shared/icons/history.svg delete mode 100644 browser/themes/shared/icons/home.svg delete mode 100644 browser/themes/shared/icons/mail.svg delete mode 100644 browser/themes/shared/icons/menu.svg delete mode 100644 browser/themes/shared/icons/new-tab.svg delete mode 100644 browser/themes/shared/icons/new-window.svg delete mode 100644 browser/themes/shared/icons/open.svg delete mode 100644 browser/themes/shared/icons/pocket.svg delete mode 100644 browser/themes/shared/icons/print.svg delete mode 100644 browser/themes/shared/icons/privateBrowsing.svg delete mode 100644 browser/themes/shared/icons/refresh.svg delete mode 100644 browser/themes/shared/icons/save.svg delete mode 100644 browser/themes/shared/icons/settings.svg delete mode 100644 browser/themes/shared/icons/share.svg delete mode 100644 browser/themes/shared/icons/sidebars.svg delete mode 100644 browser/themes/shared/icons/stop.svg delete mode 100644 browser/themes/shared/icons/sync.svg delete mode 100644 browser/themes/shared/icons/syncedTabs.svg delete mode 100644 browser/themes/shared/icons/tabGroups.svg delete mode 100644 browser/themes/shared/icons/webIDE.svg delete mode 100644 browser/themes/shared/icons/webRTC-camera.svg delete mode 100644 browser/themes/shared/icons/zoom-in.svg delete mode 100644 browser/themes/shared/icons/zoom-out.svg diff --git a/browser/base/content/browser-places.js b/browser/base/content/browser-places.js index bab75a6b269b..9e3e7d6dc5a1 100644 --- a/browser/base/content/browser-places.js +++ b/browser/base/content/browser-places.js @@ -1795,8 +1795,8 @@ var BookmarkingUI = { this.dropmarkerNotifier.style.transform = dropmarkerTransform; let dropmarkerAnimationNode = this.dropmarkerNotifier.firstChild; + dropmarkerAnimationNode.style.MozImageRegion = dropmarkerStyle.MozImageRegion; dropmarkerAnimationNode.style.listStyleImage = dropmarkerStyle.listStyleImage; - dropmarkerAnimationNode.style.fill = dropmarkerStyle.fill; } let isInOverflowPanel = this.button.getAttribute("overflowedItem") == "true"; diff --git a/browser/extensions/pocket/skin/osx/pocket.css b/browser/extensions/pocket/skin/osx/pocket.css index 4083de5f80c4..534a881a58b1 100644 --- a/browser/extensions/pocket/skin/osx/pocket.css +++ b/browser/extensions/pocket/skin/osx/pocket.css @@ -5,7 +5,37 @@ margin: 0; } +#pocket-button[cui-areatype="toolbar"][open] { + -moz-image-region: rect(36px, 18px, 54px, 0); +} +@media (min-resolution: 2dppx) { + #panelMenu_pocket, + #menu_pocket, + #BMB_pocket { + list-style-image: url("chrome://pocket/content/panels/img/pocketmenuitem16@2x.png"); + } + + #panelMenu_pocket > .toolbarbutton-icon { + width: 16px; + } +} + +@media not all and (min-resolution: 1.1dppx) { + #pocket-button:hover:active:not([disabled="true"]):not([cui-areatype="menu-panel"]) { + -moz-image-region: rect(18px, 18px, 36px, 0); + } +} + +@media (min-resolution: 1.1dppx) { + #pocket-button[cui-areatype="toolbar"][open] { + -moz-image-region: rect(72px, 36px, 108px, 0); + } + + #pocket-button:hover:active:not([disabled="true"]):not([cui-areatype="menu-panel"]) { + -moz-image-region: rect(36px, 36px, 72px, 0); + } +} #PanelUI-pocketView[mainview=true] > .panel-subview-body > #pocket-panel-iframe { border-radius: var(--arrowpanel-border-radius); diff --git a/browser/extensions/pocket/skin/shared/pocket.css b/browser/extensions/pocket/skin/shared/pocket.css index a30877060b52..ec46e1890500 100644 --- a/browser/extensions/pocket/skin/shared/pocket.css +++ b/browser/extensions/pocket/skin/shared/pocket.css @@ -14,11 +14,66 @@ panelmultiview[mainViewId=PanelUI-pocketView] > .panel-viewcontainer > .panel-vi } #pocket-button { - list-style-image: url("chrome://browser/skin/pocket.svg"); - -moz-context-properties: fill; - fill: var(--toolbarbutton-icon-fill); + list-style-image: url("chrome://pocket/skin/Toolbar.png"); + -moz-image-region: rect(0, 18px, 18px, 0); } toolbar[brighttext] #pocket-button { - fill: var(--toolbarbutton-icon-fill-inverted); + list-style-image: url(chrome://pocket/skin/Toolbar-inverted.png); +} + +@media not all and (min-resolution: 1.1dppx) { + #pocket-button[cui-areatype="menu-panel"], + toolbarpaletteitem[place="palette"] > #pocket-button { + list-style-image: url(chrome://pocket/skin/menuPanel.png); + -moz-image-region: rect(0, 32px, 32px, 0); + } + + #pocket-button[cui-areatype="menu-panel"][panel-multiview-anchor=true] { + -moz-image-region: rect(32px, 32px, 64px, 0); + } +} + +@media (min-resolution: 1.1dppx) { + #pocket-button[cui-areatype="menu-panel"], + toolbarpaletteitem[place="palette"] > #pocket-button { + list-style-image: url(chrome://pocket/skin/menuPanel@2x.png); + -moz-image-region: rect(0px, 64px, 64px, 0); + } + + #pocket-button[cui-areatype="menu-panel"][panel-multiview-anchor=true] { + -moz-image-region: rect(64px, 64px, 128px, 0); + } +} + +#pocket-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 18px, 18px, 0); +} + +#pocket-button[cui-areatype="toolbar"][open] { + -moz-image-region: rect(18px, 18px, 36px, 0); +} + +@media (min-resolution: 1.1dppx) { + #pocket-button { + list-style-image: url("chrome://pocket/skin/Toolbar@2x.png"); + } + + toolbar[brighttext] #pocket-button { + list-style-image: url("chrome://pocket/skin/Toolbar-inverted@2x.png"); + } + + #pocket-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 36px, 36px, 0px); + } + + #pocket-button[cui-areatype="toolbar"][open] { + -moz-image-region: rect(36px, 36px, 72px, 0px); + } +} + +#panelMenu_pocket, +#menu_pocket, +#BMB_pocket { + list-style-image: url("chrome://pocket/content/panels/img/pocketmenuitem16.png"); } diff --git a/browser/themes/linux/browser.css b/browser/themes/linux/browser.css index 5d2d0668fa7e..fb62908a0129 100644 --- a/browser/themes/linux/browser.css +++ b/browser/themes/linux/browser.css @@ -232,7 +232,6 @@ toolbarpaletteitem[place="palette"] > #personal-bookmarks > #bookmarks-toolbar-p } #bookmarked-notification-dropmarker-icon { - -moz-context-properties: fill; width: 18px; height: 18px; visibility: hidden; diff --git a/browser/themes/linux/downloads/indicator.css b/browser/themes/linux/downloads/indicator.css index 68134e58c341..0f750c25ba3c 100644 --- a/browser/themes/linux/downloads/indicator.css +++ b/browser/themes/linux/downloads/indicator.css @@ -21,21 +21,33 @@ /*** Main indicator icon ***/ -#downloads-button { - --downloads-indicator-image: url("chrome://browser/skin/download.svg"); +@media not all and (min-resolution: 1.1dppx) { + #downloads-button { + --downloads-indicator-image: -moz-image-rect(url("chrome://browser/skin/Toolbar.png"), 0, 198, 18, 180); + --downloads-indicator-image-attention: -moz-image-rect(url("chrome://browser/skin/Toolbar.png"), 18, 198, 36, 180); + --downloads-indicator-image-inverted: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted.png"), 0, 198, 18, 180); + --downloads-indicator-image-attention-inverted: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted.png"), 18, 198, 36, 180); + } +} + +@media (min-resolution: 1.1dppx) { + #downloads-button { + --downloads-indicator-image: -moz-image-rect(url("chrome://browser/skin/Toolbar@2x.png"), 0, 396, 36, 360); + --downloads-indicator-image-attention: -moz-image-rect(url("chrome://browser/skin/Toolbar@2x.png"), 36, 396, 72, 360); + --downloads-indicator-image-inverted: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted@2x.png"), 0, 396, 36, 360); + --downloads-indicator-image-attention-inverted: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted@2x.png"), 36, 396, 72, 360); + } } #downloads-button[cui-areatype="toolbar"] > #downloads-indicator-anchor > #downloads-indicator-icon { background: var(--downloads-indicator-image) center no-repeat; - -moz-context-properties: fill; - fill: var(--toolbarbutton-icon-fill); width: 18px; height: 18px; background-size: 18px; } toolbar[brighttext] #downloads-button[cui-areatype="toolbar"]:not([attention="success"]) > #downloads-indicator-anchor > #downloads-indicator-icon { - fill: var(--toolbarbutton-icon-fill-inverted); + background-image: var(--downloads-indicator-image-inverted); } #downloads-button[attention="warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, @@ -69,7 +81,11 @@ toolbar[brighttext] #downloads-button[cui-areatype="toolbar"]:not([attention="su } #downloads-button[cui-areatype="toolbar"][attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon { - fill: var(--toolbarbutton-icon-fill-attention); + background-image: var(--downloads-indicator-image-attention); +} + +toolbar[brighttext] #downloads-button[cui-areatype="toolbar"][attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon { + background-image: var(--downloads-indicator-image-attention-inverted); } #downloads-button[cui-areatype="menu-panel"][attention="success"] { @@ -82,17 +98,19 @@ toolbar[brighttext] #downloads-button[cui-areatype="toolbar"]:not([attention="su #downloads-button:not([counter]) > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { background: var(--downloads-indicator-image) center no-repeat; - -moz-context-properties: fill; - fill: var(--toolbarbutton-icon-fill); background-size: 12px; } toolbar[brighttext] #downloads-button:not([counter]):not([attention="success"]) > #downloads-indicator-anchor > #downloads-button-progress-area > #downloads-indicator-counter { - fill: var(--toolbarbutton-icon-fill-inverted); + background-image: var(--downloads-indicator-image-inverted); } #downloads-button:not([counter])[attention="success"] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { - fill: var(--toolbarbutton-icon-fill-attention); + background-image: var(--downloads-indicator-image-attention); +} + +toolbar[brighttext] #downloads-button:not([counter])[attention="success"] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { + background-image: var(--downloads-indicator-image-attention-inverted); } /*** Download notifications ***/ diff --git a/browser/themes/osx/browser.css b/browser/themes/osx/browser.css index bca5d9a521c9..d0eba5e2643d 100644 --- a/browser/themes/osx/browser.css +++ b/browser/themes/osx/browser.css @@ -537,7 +537,6 @@ toolbarpaletteitem[place="palette"] > #personal-bookmarks > #bookmarks-toolbar-p } #bookmarked-notification-dropmarker-icon { - -moz-context-properties: fill; width: 18px; height: 18px; visibility: hidden; @@ -730,6 +729,328 @@ toolbar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-ic %include ../shared/toolbarbutton-icons.inc.css %include ../shared/menupanel.inc.css +@media not all and (min-resolution: 1.1dppx) { + #back-button:hover:active:not([disabled="true"]) { + -moz-image-region: rect(18px, 36px, 36px, 18px); + } + + #forward-button:hover:active:not([disabled="true"]) { + -moz-image-region: rect(18px, 72px, 36px, 54px); + } + + #home-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 126px, 36px, 108px); + } + + #bookmarks-menu-button[buttonover]@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 144px, 36px, 126px); + } + + #bookmarks-menu-button[starred][buttonover]@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 162px, 36px, 144px); + } + + #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon { + -moz-image-region: rect(0px, 630px, 18px, 612px); + } + + #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker:hover:active:not([disabled="true"]) > .dropmarker-icon { + -moz-image-region: rect(18px, 630px, 36px, 612px); + } + + #history-panelmenu@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 180px, 36px, 162px); + } + + #downloads-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 198px, 36px, 180px); + } + + #add-ons-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 216px, 36px, 198px); + } + + #open-file-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 234px, 36px, 216px); + } + + #save-page-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 252px, 36px, 234px); + } + + #sync-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 792px, 36px, 774px); + } + + #containers-panelmenu@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 810px, 36px, 792px); + } + + #feed-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 288px, 36px, 270px); + } + + #social-share-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 306px, 36px, 288px); + } + + #characterencoding-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 324px, 36px, 306px); + } + + #new-window-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 342px, 36px, 324px); + } + + #e10s-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 342px, 36px, 324px); + } + + #webide-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 738px, 36px, 720px); + } + + #new-tab-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 360px, 36px, 342px); + } + + #privatebrowsing-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 378px, 36px, 360px); + } + + #find-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 396px, 36px, 378px); + } + + #print-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 414px, 36px, 396px); + } + + #restore-button:hover:active:not([disabled="true"]), + #fullscreen-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 432px, 36px, 414px); + } + + #developer-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 450px, 36px, 432px); + } + + #preferences-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 468px, 36px, 450px); + } + + #PanelUI-menu-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 486px, 36px, 468px); + } + + #edit-controls[cui-areatype="toolbar"] > #cut-button:hover:active:not([disabled="true"]) { + -moz-image-region: rect(18px, 504px, 36px, 486px); + } + + #edit-controls[cui-areatype="toolbar"] > #copy-button:hover:active:not([disabled="true"]) { + -moz-image-region: rect(18px, 522px, 36px, 504px); + } + + #edit-controls[cui-areatype="toolbar"] > #paste-button:hover:active:not([disabled="true"]) { + -moz-image-region: rect(18px, 540px, 36px, 522px); + } + + #zoom-controls[cui-areatype="toolbar"] > #zoom-out-button:hover:active:not([disabled="true"]) { + -moz-image-region: rect(18px, 558px, 36px, 540px); + } + + #zoom-controls[cui-areatype="toolbar"] > #zoom-in-button:hover:active:not([disabled="true"]) { + -moz-image-region: rect(18px, 576px, 36px, 558px); + } + + #nav-bar-overflow-button:hover:active:not([disabled="true"]) { + -moz-image-region: rect(18px, 612px, 36px, 594px); + } + + #email-link-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 666px, 36px, 648px); + } + + #sidebar-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 684px, 36px, 666px); + } + + #panic-button@toolbarButtonPressed@ { + -moz-image-region: rect(18px, 702px, 36px, 684px); + } + + /** + * OSX has a unique set of icons when fullscreen is in the checked state. + */ + + #fullscreen-button[checked="true"]:not([cui-areatype="menu-panel"]) { + -moz-image-region: rect(36px, 432px, 54px, 414px); + } + + #fullscreen-button[checked="true"]@toolbarButtonPressed@ { + -moz-image-region: rect(54px, 432px, 72px, 414px); + } +} + +@media (min-resolution: 1.1dppx) { + #back-button:hover:active:not([disabled="true"]) { + -moz-image-region: rect(36px, 72px, 72px, 36px); + } + + #forward-button:hover:active:not([disabled="true"]) { + -moz-image-region: rect(36px, 144px, 72px, 108px); + } + + #home-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 252px, 72px, 216px); + } + + #bookmarks-menu-button@toolbarButtonPressed@[buttonover] { + -moz-image-region: rect(36px, 288px, 72px, 252px); + } + + #bookmarks-menu-button@toolbarButtonPressed@[starred][buttonover] { + -moz-image-region: rect(36px, 324px, 72px, 288px); + } + + #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker:hover:active:not([disabled="true"]) > .dropmarker-icon { + -moz-image-region: rect(36px, 1260px, 72px, 1224px); + } + + #history-panelmenu@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 360px, 72px, 324px); + } + + #downloads-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 396px, 72px, 360px); + } + + #add-ons-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 432px, 72px, 396px); + } + + #open-file-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 468px, 72px, 432px); + } + + #save-page-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 504px, 72px, 468px); + } + + #sync-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 1584px, 72px, 1548px); + } + + #containers-panelmenu@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 1620px, 72px, 1584px); + } + + #feed-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 576px, 72px, 540px); + } + + #social-share-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 612px, 72px, 576px); + } + + #characterencoding-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 648px, 72px, 612px); + } + + #new-window-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 684px, 72px, 648px); + } + + #e10s-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 684px, 72px, 648px); + } + + #e10s-button > .toolbarbutton-icon { + transform: scaleY(-1); + } + + #webide-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 1476px, 72px, 1440px); + } + + #new-tab-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 720px, 72px, 684px); + } + + #privatebrowsing-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 756px, 72px, 720px); + } + + #find-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 792px, 72px, 756px); + } + + #print-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 828px, 72px, 792px); + } + + #restore-button:hover:active:not([disabled="true"]), + #fullscreen-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 864px, 72px, 828px); + } + + #fullscreen-button[cui-areatype="toolbar"][checked="true"] { + -moz-image-region: rect(72px, 864px, 108px, 828px); + } + + #fullscreen-button@toolbarButtonPressed@[checked="true"] { + -moz-image-region: rect(108px, 864px, 144px, 828px); + } + + #developer-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 900px, 72px, 864px); + } + + #preferences-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 936px, 72px, 900px); + } + + #PanelUI-menu-button:hover:active:not([disabled="true"]) { + -moz-image-region: rect(36px, 972px, 72px, 936px); + } + + #edit-controls[cui-areatype="toolbar"] > #cut-button:hover:active:not([disabled="true"]) { + -moz-image-region: rect(36px, 1008px, 72px, 972px); + } + + #edit-controls[cui-areatype="toolbar"] > #copy-button:hover:active:not([disabled="true"]) { + -moz-image-region: rect(36px, 1044px, 72px, 1008px); + } + + #edit-controls[cui-areatype="toolbar"] > #paste-button:hover:active:not([disabled="true"]) { + -moz-image-region: rect(36px, 1080px, 72px, 1044px); + } + + #zoom-controls[cui-areatype="toolbar"] > #zoom-out-button:hover:active:not([disabled="true"]) { + -moz-image-region: rect(36px, 1116px, 72px, 1080px); + } + + #zoom-controls[cui-areatype="toolbar"] > #zoom-in-button:hover:active:not([disabled="true"]) { + -moz-image-region: rect(36px, 1152px, 72px, 1116px); + } + + #nav-bar-overflow-button:hover:active:not([disabled="true"]) { + -moz-image-region: rect(36px, 1224px, 72px, 1188px); + } + + #email-link-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 1332px, 72px, 1296px); + } + + #sidebar-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 1368px, 72px, 1332px); + } + + #panic-button@toolbarButtonPressed@ { + -moz-image-region: rect(36px, 1404px, 72px, 1368px); + } +} + toolbar .toolbarbutton-1:not([type="menu-button"]), toolbar .toolbarbutton-1 > .toolbarbutton-menubutton-button { min-width: 28px; @@ -2752,7 +3073,7 @@ html|*.addon-webext-perm-list { .addon-toolbar-icon { width: 14px; height: 14px; - list-style-image: url("chrome://browser/skin/menu.svg"); + list-style-image: url("chrome://browser/skin/Toolbar.png"); -moz-image-region: rect(0, 486px, 18px, 468px); } diff --git a/browser/themes/osx/downloads/indicator.css b/browser/themes/osx/downloads/indicator.css index 75de18d89e16..250064a26037 100644 --- a/browser/themes/osx/downloads/indicator.css +++ b/browser/themes/osx/downloads/indicator.css @@ -27,18 +27,28 @@ /*** Main indicator icon ***/ #downloads-button { - --downloads-indicator-image: url("chrome://browser/skin/download.svg"); + --downloads-indicator-image: -moz-image-rect(url("chrome://browser/skin/Toolbar.png"), 0, 198, 18, 180); + --downloads-indicator-image-attention: -moz-image-rect(url("chrome://browser/skin/Toolbar.png"), 36, 198, 54, 180); + --downloads-indicator-image-inverted: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted.png"), 0, 198, 18, 180); + --downloads-indicator-image-attention-inverted: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted.png"), 36, 198, 54, 180); +} + +@media (min-resolution: 2dppx) { + #downloads-button { + --downloads-indicator-image: -moz-image-rect(url("chrome://browser/skin/Toolbar@2x.png"), 0, 396, 36, 360); + --downloads-indicator-image-attention: -moz-image-rect(url("chrome://browser/skin/Toolbar@2x.png"), 72, 396, 108, 360); + --downloads-indicator-image-inverted: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted@2x.png"), 0, 396, 36, 360); + --downloads-indicator-image-attention-inverted: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted@2x.png"), 72, 396, 108, 360); + } } #downloads-indicator-icon { background: var(--downloads-indicator-image) center no-repeat; - -moz-context-properties: fill; - fill: var(--toolbarbutton-icon-fill); background-size: 18px; } toolbar[brighttext] #downloads-indicator-icon { - fill: var(--toolbarbutton-icon-fill-inverted); + background-image: var(--downloads-indicator-image-inverted); } #downloads-button[attention="warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, @@ -72,7 +82,11 @@ toolbar[brighttext] #downloads-indicator-icon { } #downloads-button[attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon { - fill: var(--toolbarbutton-icon-fill-attention); + background-image: var(--downloads-indicator-image-attention); +} + +toolbar[brighttext] #downloads-button[attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon { + background-image: var(--downloads-indicator-image-attention-inverted); } #downloads-button[cui-areatype="menu-panel"][attention="success"] { @@ -85,17 +99,19 @@ toolbar[brighttext] #downloads-indicator-icon { #downloads-button:not([counter]) > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { background: var(--downloads-indicator-image) center no-repeat; - -moz-context-properties: fill; - fill: var(--toolbarbutton-icon-fill); background-size: 12px; } toolbar[brighttext] #downloads-button:not([counter]):not([attention="success"]) > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { - fill: var(--toolbarbutton-icon-fill-inverted); + background-image: var(--downloads-indicator-image-inverted); } #downloads-button:not([counter])[attention="success"] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { - fill: var(--toolbarbutton-icon-fill-attention); + background-image: var(--downloads-indicator-image-attention); +} + +toolbar[brighttext] #downloads-button:not([counter])[attention="success"] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { + background-image: var(--downloads-indicator-image-attention-inverted); } @media (min-resolution: 2dppx) { diff --git a/browser/themes/shared/compacttheme.inc.css b/browser/themes/shared/compacttheme.inc.css index 35c3b4bad75a..70bb4e7efea4 100644 --- a/browser/themes/shared/compacttheme.inc.css +++ b/browser/themes/shared/compacttheme.inc.css @@ -246,7 +246,13 @@ window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #urlbar:-moz-locale-dir( /* Use smaller back button icon */ #back-button { - list-style-image: url("chrome://browser/skin/back.svg"); + -moz-image-region: rect(0, 54px, 18px, 36px); +} + +@media (min-resolution: 1.1dppx) { + #back-button { + -moz-image-region: rect(0, 108px, 36px, 72px); + } } .tab-background { diff --git a/browser/themes/shared/downloads/indicator.inc.css b/browser/themes/shared/downloads/indicator.inc.css index ed84ed847b90..1e12c46f1021 100644 --- a/browser/themes/shared/downloads/indicator.inc.css +++ b/browser/themes/shared/downloads/indicator.inc.css @@ -3,9 +3,7 @@ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ #downloads-indicator-progress-icon { - background: var(--downloads-indicator-image) bottom no-repeat; - -moz-context-properties: fill; - fill: var(--toolbarbutton-icon-fill-attention); + background: var(--downloads-indicator-image-attention) bottom no-repeat; background-size: 18px; margin-top: 18px; /* From javascript side we use animation delay from 0s to -100s to show @@ -20,6 +18,7 @@ } toolbar[brighttext] #downloads-indicator-progress-icon { + background-image: var(--downloads-indicator-image-attention-inverted); animation-name: indicatorArrowProgressDark; } diff --git a/browser/themes/shared/icons/addons.svg b/browser/themes/shared/icons/addons.svg deleted file mode 100644 index 3ea2ea76b456..000000000000 --- a/browser/themes/shared/icons/addons.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/app.svg b/browser/themes/shared/icons/app.svg deleted file mode 100644 index c2b6467fed0c..000000000000 --- a/browser/themes/shared/icons/app.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/back-large.svg b/browser/themes/shared/icons/back-large.svg deleted file mode 100644 index 411df79c3d20..000000000000 --- a/browser/themes/shared/icons/back-large.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/back.svg b/browser/themes/shared/icons/back.svg deleted file mode 100644 index a6f4138307f9..000000000000 --- a/browser/themes/shared/icons/back.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/bookmark-hollow.svg b/browser/themes/shared/icons/bookmark-hollow.svg deleted file mode 100644 index 7e0c2247580c..000000000000 --- a/browser/themes/shared/icons/bookmark-hollow.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/bookmark.svg b/browser/themes/shared/icons/bookmark.svg deleted file mode 100644 index 3975d86aec94..000000000000 --- a/browser/themes/shared/icons/bookmark.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/bookmarksMenu.svg b/browser/themes/shared/icons/bookmarksMenu.svg deleted file mode 100644 index 55124054a986..000000000000 --- a/browser/themes/shared/icons/bookmarksMenu.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/characterEncoding.svg b/browser/themes/shared/icons/characterEncoding.svg deleted file mode 100644 index 243215722a17..000000000000 --- a/browser/themes/shared/icons/characterEncoding.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/chevron.svg b/browser/themes/shared/icons/chevron.svg deleted file mode 100644 index c47561ad2839..000000000000 --- a/browser/themes/shared/icons/chevron.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/containers.svg b/browser/themes/shared/icons/containers.svg deleted file mode 100644 index 4c4937c76b26..000000000000 --- a/browser/themes/shared/icons/containers.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/devTools-panel.svg b/browser/themes/shared/icons/devTools-panel.svg deleted file mode 100644 index 6a815a9e8b83..000000000000 --- a/browser/themes/shared/icons/devTools-panel.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/developer.svg b/browser/themes/shared/icons/developer.svg deleted file mode 100644 index a9691c2c58d9..000000000000 --- a/browser/themes/shared/icons/developer.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/download.svg b/browser/themes/shared/icons/download.svg deleted file mode 100644 index 6615c00f7e66..000000000000 --- a/browser/themes/shared/icons/download.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/edit-copy.svg b/browser/themes/shared/icons/edit-copy.svg deleted file mode 100644 index d19e5cf312bd..000000000000 --- a/browser/themes/shared/icons/edit-copy.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/edit-cut.svg b/browser/themes/shared/icons/edit-cut.svg deleted file mode 100644 index cef6169ae4fa..000000000000 --- a/browser/themes/shared/icons/edit-cut.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/edit-paste.svg b/browser/themes/shared/icons/edit-paste.svg deleted file mode 100644 index 031234b38f46..000000000000 --- a/browser/themes/shared/icons/edit-paste.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/feed.svg b/browser/themes/shared/icons/feed.svg deleted file mode 100644 index 91749161efa1..000000000000 --- a/browser/themes/shared/icons/feed.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/find.svg b/browser/themes/shared/icons/find.svg deleted file mode 100644 index 5ef3225563db..000000000000 --- a/browser/themes/shared/icons/find.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/forget.svg b/browser/themes/shared/icons/forget.svg deleted file mode 100644 index 6afc9f301bcc..000000000000 --- a/browser/themes/shared/icons/forget.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/forward.svg b/browser/themes/shared/icons/forward.svg deleted file mode 100644 index 339da0266920..000000000000 --- a/browser/themes/shared/icons/forward.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/fullscreen.svg b/browser/themes/shared/icons/fullscreen.svg deleted file mode 100644 index 21f846b91ad8..000000000000 --- a/browser/themes/shared/icons/fullscreen.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/history.svg b/browser/themes/shared/icons/history.svg deleted file mode 100644 index 7a5a1b2e977d..000000000000 --- a/browser/themes/shared/icons/history.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/home.svg b/browser/themes/shared/icons/home.svg deleted file mode 100644 index bc64d5756149..000000000000 --- a/browser/themes/shared/icons/home.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/mail.svg b/browser/themes/shared/icons/mail.svg deleted file mode 100644 index 58f3d4807cec..000000000000 --- a/browser/themes/shared/icons/mail.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/menu.svg b/browser/themes/shared/icons/menu.svg deleted file mode 100644 index 9a4e54ace9c3..000000000000 --- a/browser/themes/shared/icons/menu.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/new-tab.svg b/browser/themes/shared/icons/new-tab.svg deleted file mode 100644 index a723f8733d71..000000000000 --- a/browser/themes/shared/icons/new-tab.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/new-window.svg b/browser/themes/shared/icons/new-window.svg deleted file mode 100644 index 7433565dd7fd..000000000000 --- a/browser/themes/shared/icons/new-window.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/open.svg b/browser/themes/shared/icons/open.svg deleted file mode 100644 index a62b34df4f77..000000000000 --- a/browser/themes/shared/icons/open.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/pocket.svg b/browser/themes/shared/icons/pocket.svg deleted file mode 100644 index fdbdb157bd6a..000000000000 --- a/browser/themes/shared/icons/pocket.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/print.svg b/browser/themes/shared/icons/print.svg deleted file mode 100644 index ba85213fde90..000000000000 --- a/browser/themes/shared/icons/print.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/privateBrowsing.svg b/browser/themes/shared/icons/privateBrowsing.svg deleted file mode 100644 index 109e28194c9e..000000000000 --- a/browser/themes/shared/icons/privateBrowsing.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/refresh.svg b/browser/themes/shared/icons/refresh.svg deleted file mode 100644 index c3a0276e73d2..000000000000 --- a/browser/themes/shared/icons/refresh.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/save.svg b/browser/themes/shared/icons/save.svg deleted file mode 100644 index 4b13393f9460..000000000000 --- a/browser/themes/shared/icons/save.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/settings.svg b/browser/themes/shared/icons/settings.svg deleted file mode 100644 index 148369ee58c5..000000000000 --- a/browser/themes/shared/icons/settings.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/share.svg b/browser/themes/shared/icons/share.svg deleted file mode 100644 index 7ccb2c193e6e..000000000000 --- a/browser/themes/shared/icons/share.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/sidebars.svg b/browser/themes/shared/icons/sidebars.svg deleted file mode 100644 index ca1679fb3604..000000000000 --- a/browser/themes/shared/icons/sidebars.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/stop.svg b/browser/themes/shared/icons/stop.svg deleted file mode 100644 index 35d2c5c3f8ed..000000000000 --- a/browser/themes/shared/icons/stop.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/sync.svg b/browser/themes/shared/icons/sync.svg deleted file mode 100644 index 5e5709f5c535..000000000000 --- a/browser/themes/shared/icons/sync.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/syncedTabs.svg b/browser/themes/shared/icons/syncedTabs.svg deleted file mode 100644 index 176dba29d906..000000000000 --- a/browser/themes/shared/icons/syncedTabs.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/tabGroups.svg b/browser/themes/shared/icons/tabGroups.svg deleted file mode 100644 index d704cdc74381..000000000000 --- a/browser/themes/shared/icons/tabGroups.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/webIDE.svg b/browser/themes/shared/icons/webIDE.svg deleted file mode 100644 index 00467661cb8e..000000000000 --- a/browser/themes/shared/icons/webIDE.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/webRTC-camera.svg b/browser/themes/shared/icons/webRTC-camera.svg deleted file mode 100644 index 924408c270d8..000000000000 --- a/browser/themes/shared/icons/webRTC-camera.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/zoom-in.svg b/browser/themes/shared/icons/zoom-in.svg deleted file mode 100644 index 47c375316de4..000000000000 --- a/browser/themes/shared/icons/zoom-in.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/icons/zoom-out.svg b/browser/themes/shared/icons/zoom-out.svg deleted file mode 100644 index 3ea7e418aa57..000000000000 --- a/browser/themes/shared/icons/zoom-out.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - diff --git a/browser/themes/shared/jar.inc.mn b/browser/themes/shared/jar.inc.mn index bf86a78f2b30..728bf4b7e224 100644 --- a/browser/themes/shared/jar.inc.mn +++ b/browser/themes/shared/jar.inc.mn @@ -89,54 +89,6 @@ skin/classic/browser/fxa/android@2x.png (../shared/fxa/android@2x.png) skin/classic/browser/fxa/ios.png (../shared/fxa/ios.png) skin/classic/browser/fxa/ios@2x.png (../shared/fxa/ios@2x.png) - - - skin/classic/browser/addons.svg (../shared/icons/addons.svg) - skin/classic/browser/app.svg (../shared/icons/app.svg) - skin/classic/browser/back.svg (../shared/icons/back.svg) - skin/classic/browser/back-large.svg (../shared/icons/back-large.svg) - skin/classic/browser/bookmark.svg (../shared/icons/bookmark.svg) - skin/classic/browser/bookmark-hollow.svg (../shared/icons/bookmark-hollow.svg) - skin/classic/browser/bookmarksMenu.svg (../shared/icons/bookmarksMenu.svg) - skin/classic/browser/characterEncoding.svg (../shared/icons/characterEncoding.svg) - skin/classic/browser/chevron.svg (../shared/icons/chevron.svg) - skin/classic/browser/containers.svg (../shared/icons/containers.svg) - skin/classic/browser/developer.svg (../shared/icons/developer.svg) - skin/classic/browser/devTools-panel.svg (../shared/icons/devTools-panel.svg) - skin/classic/browser/download.svg (../shared/icons/download.svg) - skin/classic/browser/edit-copy.svg (../shared/icons/edit-copy.svg) - skin/classic/browser/edit-cut.svg (../shared/icons/edit-cut.svg) - skin/classic/browser/edit-paste.svg (../shared/icons/edit-paste.svg) - skin/classic/browser/feed.svg (../shared/icons/feed.svg) - skin/classic/browser/find.svg (../shared/icons/find.svg) - skin/classic/browser/forget.svg (../shared/icons/forget.svg) - skin/classic/browser/forward.svg (../shared/icons/forward.svg) - skin/classic/browser/fullscreen.svg (../shared/icons/fullscreen.svg) - skin/classic/browser/history.svg (../shared/icons/history.svg) - skin/classic/browser/home.svg (../shared/icons/home.svg) - skin/classic/browser/mail.svg (../shared/icons/mail.svg) - skin/classic/browser/menu.svg (../shared/icons/menu.svg) - skin/classic/browser/new-tab.svg (../shared/icons/new-tab.svg) - skin/classic/browser/new-window.svg (../shared/icons/new-window.svg) - skin/classic/browser/open.svg (../shared/icons/open.svg) - skin/classic/browser/pocket.svg (../shared/icons/pocket.svg) - skin/classic/browser/print.svg (../shared/icons/print.svg) - skin/classic/browser/privateBrowsing.svg (../shared/icons/privateBrowsing.svg) - skin/classic/browser/refresh.svg (../shared/icons/refresh.svg) - skin/classic/browser/save.svg (../shared/icons/save.svg) - skin/classic/browser/settings.svg (../shared/icons/settings.svg) - skin/classic/browser/share.svg (../shared/icons/share.svg) - skin/classic/browser/sidebars.svg (../shared/icons/sidebars.svg) - skin/classic/browser/stop.svg (../shared/icons/stop.svg) - skin/classic/browser/sync.svg (../shared/icons/sync.svg) - skin/classic/browser/syncedTabs.svg (../shared/icons/syncedTabs.svg) - skin/classic/browser/tabGroups.svg (../shared/icons/tabGroups.svg) - skin/classic/browser/webIDE.svg (../shared/icons/webIDE.svg) - skin/classic/browser/webRTC-camera.svg (../shared/icons/webRTC-camera.svg) - skin/classic/browser/zoom-in.svg (../shared/icons/zoom-in.svg) - skin/classic/browser/zoom-out.svg (../shared/icons/zoom-out.svg) - - skin/classic/browser/search-indicator.png (../shared/search/search-indicator.png) skin/classic/browser/search-indicator@2x.png (../shared/search/search-indicator@2x.png) skin/classic/browser/search-engine-placeholder.png (../shared/search/search-engine-placeholder.png) diff --git a/browser/themes/shared/social/social.inc.css b/browser/themes/shared/social/social.inc.css index 6a9638b9439a..31389b2153ee 100644 --- a/browser/themes/shared/social/social.inc.css +++ b/browser/themes/shared/social/social.inc.css @@ -5,9 +5,8 @@ %endif #manage-share-providers { - list-style-image: url("chrome://browser/skin/settings.svg"); - -moz-context-properties: fill; - fill: var(--toolbarbutton-icon-fill); + list-style-image: url("chrome://browser/skin/Toolbar.png"); + -moz-image-region: rect(0, 468px, 18px, 450px); } #manage-share-providers > .toolbarbutton-icon { diff --git a/browser/themes/shared/toolbarbutton-icons.inc.css b/browser/themes/shared/toolbarbutton-icons.inc.css index e9416c23056e..b3b3ffcf8956 100644 --- a/browser/themes/shared/toolbarbutton-icons.inc.css +++ b/browser/themes/shared/toolbarbutton-icons.inc.css @@ -1,93 +1,83 @@ -:root { - --toolbarbutton-icon-fill: #4c4c4c; - --toolbarbutton-icon-fill-inverted: #fff; - --toolbarbutton-icon-fill-attention: #177ee5; +:-moz-any(@primaryToolbarButtons@), +#bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon { + list-style-image: url("chrome://browser/skin/Toolbar.png"); } -:-moz-any(@primaryToolbarButtons@) { - -moz-context-properties: fill; - fill: var(--toolbarbutton-icon-fill); -} - -toolbar[brighttext] :-moz-any(@primaryToolbarButtons@) { - fill: var(--toolbarbutton-icon-fill-inverted); +toolbar[brighttext] :-moz-any(@primaryToolbarButtons@), +toolbar[brighttext] #bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon { + list-style-image: url(chrome://browser/skin/Toolbar-inverted.png); } #back-button { - list-style-image: url("chrome://browser/skin/back-large.svg"); + -moz-image-region: rect(0, 36px, 18px, 18px); } #forward-button { - list-style-image: url("chrome://browser/skin/forward.svg"); + -moz-image-region: rect(0, 72px, 18px, 54px); } #home-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/home.svg"); + -moz-image-region: rect(0, 126px, 18px, 108px); } #bookmarks-menu-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/bookmark-hollow.svg"); + -moz-image-region: rect(0, 144px, 18px, 126px); } #bookmarks-menu-button[cui-areatype="toolbar"][starred] { - list-style-image: url("chrome://browser/skin/bookmark.svg"); -} - -toolbar:not([brighttext]) #bookmarks-menu-button[cui-areatype="toolbar"][starred] > .toolbarbutton-menubutton-button { - -moz-context-properties: fill; - fill: var(--toolbarbutton-icon-fill-attention); + -moz-image-region: rect(0, 162px, 18px, 144px); } #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon { - list-style-image: url("chrome://browser/skin/bookmarksMenu.svg"); + -moz-image-region: rect(0, 630px, 18px, 612px); } #history-panelmenu[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/history.svg"); + -moz-image-region: rect(0, 180px, 18px, 162px); } #downloads-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/download.svg"); + -moz-image-region: rect(0, 198px, 18px, 180px); } #add-ons-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/addons.svg"); + -moz-image-region: rect(0, 216px, 18px, 198px); } #open-file-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/open.svg"); + -moz-image-region: rect(0, 234px, 18px, 216px); } #save-page-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/save.svg"); + -moz-image-region: rect(0, 252px, 18px, 234px); } #sync-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/sync.svg"); + -moz-image-region: rect(0, 792px, 18px, 774px); } #containers-panelmenu[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/containers.svg"); + -moz-image-region: rect(0, 810px, 18px, 792px); } #feed-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/feed.svg"); + -moz-image-region: rect(0, 288px, 18px, 270px); } #social-share-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/share.svg"); + -moz-image-region: rect(0px, 306px, 18px, 288px); } #characterencoding-button[cui-areatype="toolbar"]{ - list-style-image: url("chrome://browser/skin/characterEncoding.svg"); + -moz-image-region: rect(0, 324px, 18px, 306px); } #new-window-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/new-window.svg"); + -moz-image-region: rect(0, 342px, 18px, 324px); } #e10s-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/new-window.svg"); + -moz-image-region: rect(0, 342px, 18px, 324px); } #e10s-button > .toolbarbutton-icon { @@ -95,62 +85,62 @@ toolbar:not([brighttext]) #bookmarks-menu-button[cui-areatype="toolbar"][starred } #new-tab-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/new-tab.svg"); + -moz-image-region: rect(0, 360px, 18px, 342px); } #privatebrowsing-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/privateBrowsing.svg"); + -moz-image-region: rect(0, 378px, 18px, 360px); } #find-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/find.svg"); + -moz-image-region: rect(0, 396px, 18px, 378px); } #print-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/print.svg"); + -moz-image-region: rect(0, 414px, 18px, 396px); } %ifdef XP_MACOSX #restore-button, %endif #fullscreen-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/fullscreen.svg"); + -moz-image-region: rect(0, 432px, 18px, 414px); } #developer-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/developer.svg"); + -moz-image-region: rect(0, 450px, 18px, 432px); } #preferences-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/settings.svg"); + -moz-image-region: rect(0, 468px, 18px, 450px); } #PanelUI-menu-button { - list-style-image: url("chrome://browser/skin/menu.svg"); + -moz-image-region: rect(0, 486px, 18px, 468px); } #edit-controls:not(@inAnyPanel@) > #cut-button { - list-style-image: url("chrome://browser/skin/edit-cut.svg"); + -moz-image-region: rect(0, 504px, 18px, 486px); } #edit-controls:not(@inAnyPanel@) > #copy-button { - list-style-image: url("chrome://browser/skin/edit-copy.svg"); + -moz-image-region: rect(0, 522px, 18px, 504px); } #edit-controls:not(@inAnyPanel@) > #paste-button { - list-style-image: url("chrome://browser/skin/edit-paste.svg"); + -moz-image-region: rect(0, 540px, 18px, 522px); } #zoom-controls:not(@inAnyPanel@) > #zoom-out-button { - list-style-image: url("chrome://browser/skin/zoom-out.svg"); + -moz-image-region: rect(0, 558px, 18px, 540px); } #zoom-controls:not(@inAnyPanel@) > #zoom-in-button { - list-style-image: url("chrome://browser/skin/zoom-in.svg"); + -moz-image-region: rect(0, 576px, 18px, 558px); } #nav-bar-overflow-button { - list-style-image: url("chrome://browser/skin/chevron.svg"); + -moz-image-region: rect(0, 612px, 18px, 594px); } #nav-bar-overflow-button:-moz-locale-dir(rtl) > .toolbarbutton-icon { @@ -158,19 +148,23 @@ toolbar:not([brighttext]) #bookmarks-menu-button[cui-areatype="toolbar"][starred } #email-link-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/mail.svg"); + -moz-image-region: rect(0, 666px, 18px, 648px); } #sidebar-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/sidebars.svg"); + -moz-image-region: rect(0, 684px, 18px, 666px); } #panic-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/forget.svg"); + -moz-image-region: rect(0, 702px, 18px, 684px); } #panic-button[cui-areatype="toolbar"][open] { - fill: rgb(213, 32, 20); +%ifdef XP_MACOSX + -moz-image-region: rect(36px, 702px, 54px, 684px); +%else + -moz-image-region: rect(18px, 702px, 36px, 684px); +%endif } #panic-button:-moz-locale-dir(rtl) > .toolbarbutton-icon { @@ -178,5 +172,176 @@ toolbar:not([brighttext]) #bookmarks-menu-button[cui-areatype="toolbar"][starred } #webide-button[cui-areatype="toolbar"] { - list-style-image: url("chrome://browser/skin/webIDE.svg"); + -moz-image-region: rect(0, 738px, 18px, 720px); +} + +@media (min-resolution: 1.1dppx) { + :-moz-any(@primaryToolbarButtons@), + #bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon { + list-style-image: url("chrome://browser/skin/Toolbar@2x.png"); + } + + toolbar[brighttext] :-moz-any(@primaryToolbarButtons@), + toolbar[brighttext] #bookmarks-menu-button > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon { + list-style-image: url("chrome://browser/skin/Toolbar-inverted@2x.png"); + } + + #back-button { + -moz-image-region: rect(0, 72px, 36px, 36px); + } + + #forward-button { + -moz-image-region: rect(0, 144px, 36px, 108px); + } + + #home-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 252px, 36px, 216px); + } + + #bookmarks-menu-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 288px, 36px, 252px); + } + + #bookmarks-menu-button[cui-areatype="toolbar"][starred] { + -moz-image-region: rect(0, 324px, 36px, 288px); + } + + #bookmarks-menu-button[cui-areatype="toolbar"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon { + -moz-image-region: rect(0px, 1260px, 36px, 1224px); + } + + #history-panelmenu[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 360px, 36px, 324px); + } + + #downloads-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 396px, 36px, 360px); + } + + #add-ons-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 432px, 36px, 396px); + } + + #open-file-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 468px, 36px, 432px); + } + + #save-page-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 504px, 36px, 468px); + } + + #sync-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 1584px, 36px, 1548px); + } + + #containers-panelmenu[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 1620px, 36px, 1584px); + } + + #feed-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 576px, 36px, 540px); + } + + #social-share-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 612px, 36px, 576px); + } + + #characterencoding-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 648px, 36px, 612px); + } + + #new-window-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 684px, 36px, 648px); + } + + #e10s-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 684px, 36px, 648px); + } + + #e10s-button > .toolbarbutton-icon { + transform: scaleY(-1); + } + + #new-tab-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 720px, 36px, 684px); + } + + #privatebrowsing-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 756px, 36px, 720px); + } + + #find-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 792px, 36px, 756px); + } + + #print-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 828px, 36px, 792px); + } + +%ifdef XP_MACOSX + #restore-button, +%endif + #fullscreen-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 864px, 36px, 828px); + } + + #developer-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 900px, 36px, 864px); + } + + #preferences-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 936px, 36px, 900px); + } + + #PanelUI-menu-button { + -moz-image-region: rect(0, 972px, 36px, 936px); + } + + #edit-controls[cui-areatype="toolbar"] > #cut-button { + -moz-image-region: rect(0, 1008px, 36px, 972px); + } + + #edit-controls[cui-areatype="toolbar"] > #copy-button { + -moz-image-region: rect(0, 1044px, 36px, 1008px); + } + + #edit-controls[cui-areatype="toolbar"] > #paste-button { + -moz-image-region: rect(0, 1080px, 36px, 1044px); + } + + #zoom-controls[cui-areatype="toolbar"] > #zoom-out-button { + -moz-image-region: rect(0, 1116px, 36px, 1080px); + } + + #zoom-controls[cui-areatype="toolbar"] > #zoom-in-button { + -moz-image-region: rect(0, 1152px, 36px, 1116px); + } + + #nav-bar-overflow-button { + -moz-image-region: rect(0, 1224px, 36px, 1188px); + } + + #email-link-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 1332px, 36px, 1296px); + } + + #sidebar-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 1368px, 36px, 1332px); + } + + #panic-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 1404px, 36px, 1368px); + } + + #panic-button[cui-areatype="toolbar"][open] { +%ifdef XP_MACOSX + -moz-image-region: rect(72px, 1404px, 108px, 1368px); +%else + -moz-image-region: rect(36px, 1404px, 72px, 1368px); +%endif + } + + #webide-button[cui-areatype="toolbar"] { + -moz-image-region: rect(0, 1476px, 36px, 1440px); + } } diff --git a/browser/themes/windows/browser.css b/browser/themes/windows/browser.css index e5db98463a13..79fd38cca83b 100644 --- a/browser/themes/windows/browser.css +++ b/browser/themes/windows/browser.css @@ -473,7 +473,6 @@ toolbarpaletteitem[place="palette"] > #personal-bookmarks > #bookmarks-toolbar-p } #bookmarked-notification-dropmarker-icon { - -moz-context-properties: fill; width: 18px; height: 18px; visibility: hidden; @@ -487,8 +486,6 @@ toolbarpaletteitem[place="palette"] > #personal-bookmarks > #bookmarks-toolbar-p #bookmarks-menu-button[notification="finish"] > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon { list-style-image: none !important; - min-width: 32px; - min-height: 28px; } #bookmarked-notification-dropmarker-anchor[notification="finish"] > #bookmarked-notification-dropmarker-icon { diff --git a/browser/themes/windows/downloads/indicator.css b/browser/themes/windows/downloads/indicator.css index a74c4baee109..46f5d746d4be 100644 --- a/browser/themes/windows/downloads/indicator.css +++ b/browser/themes/windows/downloads/indicator.css @@ -21,21 +21,33 @@ /*** Main indicator icon ***/ -#downloads-button { - --downloads-indicator-image: url("chrome://browser/skin/download.svg"); +@media not all and (min-resolution: 1.1dppx) { + #downloads-button { + --downloads-indicator-image: -moz-image-rect(url("chrome://browser/skin/Toolbar.png"), 0, 198, 18, 180); + --downloads-indicator-image-attention: -moz-image-rect(url("chrome://browser/skin/Toolbar.png"), 18, 198, 36, 180); + --downloads-indicator-image-inverted: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted.png"), 0, 198, 18, 180); + --downloads-indicator-image-attention-inverted: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted.png"), 18, 198, 36, 180); + } +} + +@media (min-resolution: 1.1dppx) { + #downloads-button { + --downloads-indicator-image: -moz-image-rect(url("chrome://browser/skin/Toolbar@2x.png"), 0, 396, 36, 360); + --downloads-indicator-image-attention: -moz-image-rect(url("chrome://browser/skin/Toolbar@2x.png"), 36, 396, 72, 360); + --downloads-indicator-image-inverted: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted@2x.png"), 0, 396, 36, 360); + --downloads-indicator-image-attention-inverted: -moz-image-rect(url("chrome://browser/skin/Toolbar-inverted@2x.png"), 36, 396, 72, 360); + } } #downloads-indicator-icon { background: var(--downloads-indicator-image) center no-repeat; - -moz-context-properties: fill; - fill: var(--toolbarbutton-icon-fill); width: 18px; height: 18px; background-size: 18px; } toolbar[brighttext] #downloads-button:not([attention="success"]) > #downloads-indicator-anchor > #downloads-indicator-icon { - fill: var(--toolbarbutton-icon-fill-inverted); + background-image: var(--downloads-indicator-image-inverted); } #downloads-button[attention="warning"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, @@ -69,7 +81,11 @@ toolbar[brighttext] #downloads-button:not([attention="success"]) > #downloads-in } #downloads-button[attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon { - fill: var(--toolbarbutton-icon-fill-attention); + background-image: var(--downloads-indicator-image-attention); +} + +toolbar[brighttext] #downloads-button[attention="success"] > #downloads-indicator-anchor > #downloads-indicator-icon { + background-image: var(--downloads-indicator-image-attention-inverted); } #downloads-button[cui-areatype="menu-panel"][attention="success"] { @@ -82,17 +98,19 @@ toolbar[brighttext] #downloads-button:not([attention="success"]) > #downloads-in #downloads-button:not([counter]) > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { background: var(--downloads-indicator-image) center no-repeat; - -moz-context-properties: fill; - fill: var(--toolbarbutton-icon-fill); background-size: 12px; } toolbar[brighttext] #downloads-button:not([counter]):not([attention="success"]) > #downloads-indicator-anchor > #downloads-button-progress-area > #downloads-indicator-counter { - fill: var(--toolbarbutton-icon-fill-inverted); + background-image: var(--downloads-indicator-image-inverted); } #downloads-button:not([counter])[attention="success"] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { - fill: var(--toolbarbutton-icon-fill-attention); + background-image: var(--downloads-indicator-image-attention); +} + +toolbar[brighttext] #downloads-button:not([counter])[attention="success"] > #downloads-indicator-anchor > #downloads-indicator-progress-area > #downloads-indicator-counter { + background-image: var(--downloads-indicator-image-attention-inverted); } /*** Download notifications ***/ diff --git a/browser/themes/windows/places/organizer.css b/browser/themes/windows/places/organizer.css index 6865d0155612..9ae4c83704d0 100644 --- a/browser/themes/windows/places/organizer.css +++ b/browser/themes/windows/places/organizer.css @@ -15,19 +15,17 @@ opacity: .4; } -#back-button > .toolbarbutton-icon, -#forward-button > .toolbarbutton-icon { - -moz-context-properties: fill; - fill: currentcolor; - opacity: 0.65; +#back-button, +#forward-button { + list-style-image: url("chrome://browser/skin/Toolbar.png"); } #back-button { - list-style-image: url("chrome://browser/skin/back.svg"); + -moz-image-region: rect(0, 54px, 18px, 36px); } #forward-button { - list-style-image: url("chrome://browser/skin/forward.svg"); + -moz-image-region: rect(0, 72px, 18px, 54px); } #back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon, @@ -81,8 +79,8 @@ } /* organize, view and maintenance buttons icons */ -#organizeButton, -#viewMenu, +#organizeButton, +#viewMenu, #maintenanceButton { list-style-image: url("chrome://browser/skin/places/libraryToolbar.png"); }