Bug 1418602 - Allow Theming Sidebars(WIP) draft
authorConnor Masini <cjmasini@gmail.com>
Fri, 23 Feb 2018 12:17:56 -0500
changeset 778685 4305a77940d4679331f087d9f2e415ebdc5396ef
parent 775307 b37aa6445611ac2bd30ea7c837e61531f797d2a7
push id105564
push userbmo:masinico@msu.edu
push dateFri, 06 Apr 2018 18:34:43 +0000
bugs1418602
milestone60.0a1
Bug 1418602 - Allow Theming Sidebars(WIP) MozReview-Commit-ID: CM0rRVeCZwE
browser/modules/ThemeVariableMap.jsm
browser/themes/windows/places/places.css
toolkit/components/extensions/ext-theme.js
toolkit/components/extensions/schemas/theme.json
--- a/browser/modules/ThemeVariableMap.jsm
+++ b/browser/modules/ThemeVariableMap.jsm
@@ -18,9 +18,14 @@ const ThemeVariableMap = [
   ["--urlbar-separator-color", "toolbar_field_separator"],
   ["--tabs-border-color", "toolbar_top_separator", "navigator-toolbox"],
   ["--lwt-toolbar-vertical-separator", "toolbar_vertical_separator"],
   ["--toolbox-border-bottom-color", "toolbar_bottom_separator"],
   ["--lwt-toolbarbutton-icon-fill", "icon_color"],
   ["--lwt-toolbarbutton-icon-fill-attention", "icon_attention_color"],
   ["--lwt-toolbarbutton-hover-background", "button_background_hover"],
   ["--lwt-toolbarbutton-active-background", "button_background_active"],
+  ["--lwt-sidebar-background", "sidebar"],
+  ["--lwt-sidebar-text", "sidebar_text"],
+  ["--lwt-sidebar-border", "sidebar_border"],
+  ["--lwt-sidebar-highlight", "sidebar_highlight"],
+  ["--lwt-sidebar-highlight-text", "sidebar_highlight_text"],
 ];
--- a/browser/themes/windows/places/places.css
+++ b/browser/themes/windows/places/places.css
@@ -1,17 +1,18 @@
 /* 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/. */
 
 /* Sidebars */
 
 #history-panel,
 #bookmarksPanel {
-  background-color: transparent;
+  background-color: var(--lwt-sidebar-background, transparent);
+  color: var(--lwt-sidebar-text, black);
 }
 
 .sidebar-placesTree {
   -moz-appearance: none;
   background-color: transparent;
   color: inherit;
   border: 0;
   margin: 0;
--- a/toolkit/components/extensions/ext-theme.js
+++ b/toolkit/components/extensions/ext-theme.js
@@ -157,16 +157,21 @@ class Theme {
         case "toolbar_top_separator":
         case "toolbar_bottom_separator":
         case "toolbar_vertical_separator":
         case "button_background_hover":
         case "button_background_active":
         case "popup":
         case "popup_text":
         case "popup_border":
+        case "sidebar":
+        case "sidebar_text":
+        case "sidebar_border":
+        case "sidebar_highlight":
+        case "sidebar_highlight_text":
           this.lwtStyles[color] = cssColor;
           break;
       }
     }
   }
 
   /**
    * Helper method for loading images found in the extension's manifest.
--- a/toolkit/components/extensions/schemas/theme.json
+++ b/toolkit/components/extensions/schemas/theme.json
@@ -159,16 +159,36 @@
               },
               "popup_text": {
                 "$ref": "ThemeColor",
                 "optional": true
               },
               "popup_border": {
                 "$ref": "ThemeColor",
                 "optional": true
+              },
+              "sidebar": {
+                "$ref": "ThemeColor",
+                "optional": true
+              },
+              "sidebar_text": {
+                "$ref": "ThemeColor",
+                "optional": true
+              },
+              "sidebar_border": {
+                "$ref": "ThemeColor",
+                "optional": true
+              },
+              "sidebar_highlight": {
+                "$ref": "ThemeColor",
+                "optional": true
+              },
+              "sidebar_highlight_text": {
+                "$ref": "ThemeColor",
+                "optional": true
               }
             },
             "additionalProperties": { "$ref": "UnrecognizedProperty" }
           },
           "icons": {
             "type": "object",
             "optional": true,
             "properties": {