Bug 1368311 - Fix sidebar header icon colors. r?bgrins draft
authorDão Gottwald <dao@mozilla.com>
Wed, 31 May 2017 09:57:56 +0200
changeset 586873 54e3972eceb3de661f44bccbca66c0e56df149b7
parent 586849 925230851743b9a969a3142f00aea5014a33cb02
child 631137 dc1def06488cd2fcc06c94715aed745bad2f6ec1
push id61564
push userdgottwald@mozilla.com
push dateWed, 31 May 2017 07:58:22 +0000
reviewersbgrins
bugs1368311
milestone55.0a1
Bug 1368311 - Fix sidebar header icon colors. r?bgrins MozReview-Commit-ID: 3qgY6NdgFGd
browser/themes/shared/sidebar.inc.css
--- a/browser/themes/shared/sidebar.inc.css
+++ b/browser/themes/shared/sidebar.inc.css
@@ -1,24 +1,24 @@
 %if 0
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 %endif
 
 #sidebar-box {
-  --icon-fill: rgba(12, 12, 13, 0.8);
   --header-background-color: #F2F2F2;
   --header-background-color-hover: rgba(204, 204, 204, 0.6);
 }
 
 .sidebar-header,
 #sidebar-header {
   padding: 4px;
   background-color: var(--header-background-color);
+  color: -moz-dialogText;
   text-shadow: none;
 }
 
 .sidebar-splitter {
   -moz-appearance: none;
   border: 0 solid #ccc;
   border-inline-end-width: 1px;
   min-width: 1px;
@@ -48,40 +48,43 @@
   }
 }
 
 #sidebar-title {
   margin: 0;
   padding: 0;
   padding-inline-start: 8px;
   padding-inline-end: 4px;
-  color: -moz-DialogText;
+}
+
+#sidebar-icon,
+#sidebar-switcher-arrow,
+#sidebar-close > .toolbarbutton-icon {
+  -moz-context-properties: fill;
+  fill: currentColor;
+  opacity: 0.8;
 }
 
 #sidebar-switcher-arrow {
-  -moz-context-properties: fill;
-  fill: var(--icon-fill);
   list-style-image: url(chrome://browser/skin/arrow-dropdown.svg);
   width: 12px;
   height: 12px;
 }
 
 #sidebar-close {
   -moz-appearance: none;
-  -moz-context-properties: fill;
-  fill: var(--icon-fill);
   list-style-image: url(chrome://browser/skin/sidebar/close.svg);
   margin: 0;
   padding: 4px;
 }
 
 #sidebar-switcher-target {
   -moz-appearance: none;
   padding: 4px;
-  margin-inline-end: 4px;
+  color: inherit;
 }
 
 #sidebar-box #sidebar-switcher-target:hover,
 #sidebar-switcher-target.active,
 #sidebar-close:hover {
   background: var(--header-background-color-hover);
 }
 
@@ -100,27 +103,22 @@
 }
 #sidebarMenu-popup .subviewbutton-iconic > .toolbarbutton-text {
   padding-inline-start: 0;
 }
 %endif
 
 /* Use bookmarks star as default icon for the sidebar box (including when opening a web page) */
 #sidebar-switcher-bookmarks > .toolbarbutton-icon,
-#sidebar-box #sidebar-icon {
-  -moz-context-properties: fill;
-  fill: var(--icon-fill);
+#sidebar-box[sidebarcommand="viewWebPanelsSidebar"] > #sidebar-header > #sidebar-switcher-target > #sidebar-icon,
+#sidebar-box[sidebarcommand="viewBookmarksSidebar"] > #sidebar-header > #sidebar-switcher-target > #sidebar-icon {
   list-style-image: url(chrome://browser/skin/bookmark.svg);
 }
 
 #sidebar-switcher-history > .toolbarbutton-icon,
-#sidebar-box[sidebarcommand="viewHistorySidebar"] #sidebar-icon {
-  -moz-context-properties: fill;
-  fill: var(--icon-fill);
+#sidebar-box[sidebarcommand="viewHistorySidebar"] > #sidebar-header > #sidebar-switcher-target > #sidebar-icon {
   list-style-image: url(chrome://browser/skin/history.svg);
 }
 
 #sidebar-switcher-tabs > .toolbarbutton-icon,
-#sidebar-box[sidebarcommand="viewTabsSidebar"] #sidebar-icon {
-  -moz-context-properties: fill;
-  fill: var(--icon-fill);
+#sidebar-box[sidebarcommand="viewTabsSidebar"] > #sidebar-header > #sidebar-switcher-target > #sidebar-icon {
   list-style-image: url(chrome://browser/skin/sync.svg);
 }