1 /* This Source Code Form is subject to the terms of the Mozilla Public
2 * License, v. 2.0. If a copy of the MPL was not distributed with this
3 * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
5 export const ThemeVariableMap = [
7 "--lwt-accent-color-inactive",
9 lwtProperty: "accentcolorInactive",
13 "--lwt-background-alignment",
16 lwtProperty: "backgroundsAlignment",
20 "--lwt-background-tiling",
23 lwtProperty: "backgroundsTiling",
29 lwtProperty: "tab_loading",
30 optionalElementID: "tabbrowser-tabs",
34 "--tab-selected-bgcolor",
36 lwtProperty: "tab_selected",
40 "--tab-selected-textcolor",
42 lwtProperty: "tab_text",
46 "--lwt-tab-line-color",
48 lwtProperty: "tab_line",
49 optionalElementID: "TabsToolbar",
53 "--lwt-background-tab-separator-color",
55 lwtProperty: "tab_background_separator",
59 "--tabs-navbar-separator-color",
61 lwtProperty: "toolbar_top_separator",
65 "--tabs-navbar-separator-style",
67 lwtProperty: "toolbar_top_separator",
68 processColor(rgbaChannels) {
69 // If the separator is transparent, we don't want it to take space.
70 return rgbaChannels?.a === 0 ? "none" : null;
75 "--toolbarseparator-color",
77 lwtProperty: "toolbar_vertical_separator",
81 "--chrome-content-separator-color",
83 lwtProperty: "toolbar_bottom_separator",
87 "--toolbarbutton-icon-fill",
89 lwtProperty: "icon_color",
93 "--lwt-toolbarbutton-icon-fill-attention",
95 lwtProperty: "icon_attention_color",
99 "--toolbarbutton-hover-background",
101 lwtProperty: "button_background_hover",
105 "--toolbarbutton-active-background",
107 lwtProperty: "button_background_active",
111 "--urlbarView-highlight-background",
113 lwtProperty: "popup_highlight",
117 "--urlbarView-highlight-color",
119 lwtProperty: "popup_highlight_text",
123 "--sidebar-background-color",
125 lwtProperty: "sidebar",
126 processColor(rgbaChannels) {
130 const { r, g, b } = rgbaChannels;
131 // Drop alpha channel
132 return `rgb(${r}, ${g}, ${b})`;
137 "--sidebar-text-color",
139 lwtProperty: "sidebar_text",
143 "--sidebar-border-color",
145 lwtProperty: "sidebar_border",
149 "--tabpanel-background-color",
151 lwtProperty: "ntp_background",
152 processColor(rgbaChannels) {
155 !Services.prefs.getBoolPref("browser.newtabpage.enabled")
157 // We only set the tabpanel background to the new tab background color
158 // if the user uses about:home for new tabs. Otherwise, we flash a
159 // colorful background when a new tab is opened. We will flash the
160 // newtab color in new windows if the user uses about:home for new
161 // tabs but not new windows. However, the flash is concealed by the OS
162 // window-open animation.
165 // Drop alpha channel
166 let { r, g, b } = rgbaChannels;
167 return `rgb(${r}, ${g}, ${b})`;
173 export const ThemeContentPropertyList = [
175 "ntp_card_background",
179 "sidebar_highlight_text",