Source code
Revision control
Copy as Markdown
Other Tools
/* 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,
import { Preferences } from "chrome://global/content/preferences/Preferences.mjs";
import { SettingGroupManager } from "chrome://browser/content/preferences/config/SettingGroupManager.mjs";
const FORCED_COLORS_QUERY = matchMedia("(forced-colors)");
Preferences.addAll([
{ id: "layout.css.prefers-color-scheme.content-override", type: "int" },
{ id: "sidebar.verticalTabs", type: "bool" },
{ id: "sidebar.revamp", type: "bool" },
]);
Preferences.addSetting({
id: "browserLayoutRadioGroup",
pref: "sidebar.verticalTabs",
get: prefValue => (prefValue ? "true" : "false"),
set: value => value === "true",
});
Preferences.addSetting({
id: "browserLayoutShowSidebar",
pref: "sidebar.revamp",
onUserChange(checked) {
if (checked) {
window.browsingContext.topChromeWindow.SidebarController?.enabledViaSettings(
true
);
}
},
});
Preferences.addSetting({
id: "web-appearance-override-warning",
setup: emitChange => {
FORCED_COLORS_QUERY.addEventListener("change", emitChange);
return () => FORCED_COLORS_QUERY.removeEventListener("change", emitChange);
},
visible: () => {
return FORCED_COLORS_QUERY.matches;
},
});
Preferences.addSetting(
/** @type {{ themeNames: string[] } & SettingConfig}} */ ({
id: "web-appearance-chooser",
themeNames: ["dark", "light", "auto"],
pref: "layout.css.prefers-color-scheme.content-override",
setup(emitChange) {
Services.obs.addObserver(emitChange, "look-and-feel-changed");
return () =>
Services.obs.removeObserver(emitChange, "look-and-feel-changed");
},
get(val, _, setting) {
return (
this.themeNames[val] ||
this.themeNames[/** @type {number} */ (setting.pref.defaultValue)]
);
},
/** @param {string} val */
set(val) {
return this.themeNames.indexOf(val);
},
getControlConfig(config) {
// Set the auto theme image to the light/dark that matches.
let systemThemeIndex = Services.appinfo
.contentThemeDerivedColorSchemeIsDark
? 2
: 1;
config.options[0].controlAttrs = {
...config.options[0].controlAttrs,
imagesrc: config.options[systemThemeIndex].controlAttrs.imagesrc,
};
return config;
},
})
);
Preferences.addSetting({
id: "web-appearance-manage-themes-link",
onUserClick: e => {
e.preventDefault();
// @ts-ignore topChromeWindow global
window.browsingContext.topChromeWindow.BrowserAddonUI.openAddonsMgr(
);
},
});
Preferences.addSetting({
id: "related-settings-accessibility-link",
onUserClick: e => {
e.preventDefault();
window.gotoPref("paneAccessibility");
},
});
Preferences.addSetting({
id: "related-settings-home-link",
onUserClick: e => {
e.preventDefault();
window.gotoPref("paneHome");
},
});
Preferences.addSetting({ id: "relatedSettingsBoxGroup" });
SettingGroupManager.registerGroups({
appearance: {
l10nId: "appearance-group2",
iconSrc: "chrome://global/skin/icons/defaultFavicon.svg",
headingLevel: 2,
items: [
{
id: "web-appearance-override-warning",
l10nId: "preferences-web-appearance-override-warning3",
control: "moz-message-bar",
},
{
id: "web-appearance-chooser",
control: "moz-visual-picker",
options: [
{
value: "auto",
l10nId: "preferences-web-appearance-choice-auto3",
controlAttrs: {
id: "preferences-web-appearance-choice-auto",
class: "setting-chooser-item",
imagesrc:
"chrome://browser/content/preferences/web-appearance-light.svg",
},
},
{
value: "light",
l10nId: "preferences-web-appearance-choice-light2",
controlAttrs: {
id: "preferences-web-appearance-choice-light",
class: "setting-chooser-item",
imagesrc:
"chrome://browser/content/preferences/web-appearance-light.svg",
},
},
{
value: "dark",
l10nId: "preferences-web-appearance-choice-dark2",
controlAttrs: {
id: "preferences-web-appearance-choice-dark",
class: "setting-chooser-item",
imagesrc:
"chrome://browser/content/preferences/web-appearance-dark.svg",
},
},
],
},
],
},
browserTheme: {
l10nId: "browser-theme-group",
iconSrc: "chrome://browser/skin/customize.svg",
headingLevel: 2,
items: [
{
id: "web-appearance-manage-themes-link",
l10nId: "browser-theme-manage-link",
control: "moz-box-link",
controlAttrs: {
href: "about:addons",
},
},
],
},
browserLayout: {
l10nId: "browser-layout-header2",
iconSrc: "chrome://browser/skin/sidebar-expanded.svg",
headingLevel: 2,
items: [
{
id: "browserLayoutRadioGroup",
control: "moz-visual-picker",
options: [
{
id: "browserLayoutHorizontalTabs",
value: "false",
l10nId: "browser-layout-horizontal-tabs2",
controlAttrs: {
class: "setting-chooser-item",
imagesrc:
"chrome://browser/content/preferences/browser-layout-horizontal.svg",
},
},
{
id: "browserLayoutVerticalTabs",
value: "true",
l10nId: "browser-layout-vertical-tabs2",
controlAttrs: {
class: "setting-chooser-item",
imagesrc:
"chrome://browser/content/preferences/browser-layout-vertical.svg",
},
},
],
},
{
id: "browserLayoutShowSidebar",
l10nId: "browser-layout-show-sidebar2",
},
],
},
relatedSettings: {
l10nId: "related-settings-group",
headingLevel: 2,
items: [
{
id: "relatedSettingsBoxGroup",
control: "moz-box-group",
items: [
{
id: "related-settings-accessibility-link",
l10nId: "related-settings-accessibility-link",
control: "moz-box-link",
controlAttrs: {
href: "about:preferences#accessibility",
},
},
{
id: "related-settings-home-link",
l10nId: "related-settings-home-link",
control: "moz-box-link",
controlAttrs: {
href: "about:preferences#home",
},
},
],
},
],
},
});