mirror of
https://github.com/zen-browser/desktop.git
synced 2025-07-10 04:25:31 +02:00
Remove unused CSS files related to Zen theme
This commit is contained in:
parent
194056007a
commit
36e7fdad8b
9 changed files with 122 additions and 125 deletions
|
@ -143,3 +143,7 @@ pref("network.http.rcwn.enabled", false);
|
||||||
pref("devtools.debugger.remote-enabled", true);
|
pref("devtools.debugger.remote-enabled", true);
|
||||||
pref("devtools.chrome.enabled", true);
|
pref("devtools.chrome.enabled", true);
|
||||||
|
|
||||||
|
// Disable firefox's revamp
|
||||||
|
pref("sidebar.revamp", false, locked);
|
||||||
|
pref("sidebar.verticalTabs", false, locked);
|
||||||
|
|
||||||
|
|
106
src/browser/base/content/ZenStartup.mjs
Normal file
106
src/browser/base/content/ZenStartup.mjs
Normal file
|
@ -0,0 +1,106 @@
|
||||||
|
|
||||||
|
var ZenStartup = {
|
||||||
|
init() {
|
||||||
|
this._changeSidebarLocation();
|
||||||
|
this._zenInitBrowserLayout();
|
||||||
|
},
|
||||||
|
|
||||||
|
_zenInitBrowserLayout() {
|
||||||
|
if (this.__hasInitBrowserLayout) return;
|
||||||
|
this.__hasInitBrowserLayout = true;
|
||||||
|
this.openWatermark();
|
||||||
|
console.info("ZenThemeModifier: init browser layout");
|
||||||
|
const kNavbarItems = [
|
||||||
|
"nav-bar",
|
||||||
|
"PersonalToolbar"
|
||||||
|
];
|
||||||
|
const kNewContainerId = "zen-appcontent-navbar-container";
|
||||||
|
let newContainer = document.getElementById(kNewContainerId);
|
||||||
|
for (let id of kNavbarItems) {
|
||||||
|
const node = document.getElementById(id);
|
||||||
|
console.assert(node, "Could not find node with id: " + id);
|
||||||
|
if (!node) continue;
|
||||||
|
newContainer.appendChild(node);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Fix notification deck
|
||||||
|
document.getElementById("zen-appcontent-navbar-container")
|
||||||
|
.appendChild(document.getElementById("tab-notification-deck-template"));
|
||||||
|
|
||||||
|
gZenVerticalTabsManager.init();
|
||||||
|
gZenCompactModeManager.init();
|
||||||
|
gZenKeyboardShortcuts.init();
|
||||||
|
|
||||||
|
function throttle(f, delay) {
|
||||||
|
let timer = 0;
|
||||||
|
return function(...args) {
|
||||||
|
clearTimeout(timer);
|
||||||
|
timer = setTimeout(() => f.apply(this, args), delay);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
new ResizeObserver(throttle(
|
||||||
|
this._updateTabsToolbar.bind(this), 1000
|
||||||
|
)).observe(document.getElementById("tabbrowser-tabs"));
|
||||||
|
|
||||||
|
this.closeWatermark();
|
||||||
|
},
|
||||||
|
|
||||||
|
_updateTabsToolbar() {
|
||||||
|
// Set tabs max-height to the "toolbar-items" height
|
||||||
|
const toolbarItems = document.getElementById("tabbrowser-tabs");
|
||||||
|
const tabs = document.getElementById("tabbrowser-arrowscrollbox");
|
||||||
|
tabs.style.maxHeight = '0px'; // reset to 0
|
||||||
|
const toolbarRect = toolbarItems.getBoundingClientRect();
|
||||||
|
// -5 for the controls padding
|
||||||
|
tabs.style.maxHeight = toolbarRect.height - 5 + "px";
|
||||||
|
console.info("ZenThemeModifier: set tabs max-height to", toolbarRect.height + "px");
|
||||||
|
},
|
||||||
|
|
||||||
|
openWatermark() {
|
||||||
|
if (!Services.prefs.getBoolPref("zen.watermark.enabled", false)) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const watermark = window.MozXULElement.parseXULToFragment(`
|
||||||
|
<html:div id="zen-watermark">
|
||||||
|
<image src="chrome://branding/content/about-logo.png" />
|
||||||
|
</html:div>
|
||||||
|
`);
|
||||||
|
document.body.appendChild(watermark);
|
||||||
|
},
|
||||||
|
|
||||||
|
closeWatermark() {
|
||||||
|
const watermark = document.getElementById("zen-watermark");
|
||||||
|
if (watermark) {
|
||||||
|
watermark.setAttribute("hidden", "true");
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
_changeSidebarLocation() {
|
||||||
|
const kElementsToAppend = [
|
||||||
|
"sidebar-splitter",
|
||||||
|
"sidebar-box",
|
||||||
|
"navigator-toolbox",
|
||||||
|
];
|
||||||
|
const wrapper = document.getElementById("zen-tabbox-wrapper");
|
||||||
|
const appWrapepr = document.getElementById("zen-sidebar-box-container");
|
||||||
|
for (let id of kElementsToAppend) {
|
||||||
|
const elem = document.getElementById(id);
|
||||||
|
if (elem) {
|
||||||
|
wrapper.prepend(elem);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
appWrapepr.setAttribute("hidden", "true");
|
||||||
|
|
||||||
|
// Set a splitter to navigator-toolbox
|
||||||
|
const splitter = document.createXULElement("splitter");
|
||||||
|
splitter.setAttribute("id", "zen-sidebar-splitter");
|
||||||
|
splitter.setAttribute("orient", "horizontal");
|
||||||
|
splitter.setAttribute("resizebefore", "sibling");
|
||||||
|
splitter.setAttribute("resizeafter", "none");
|
||||||
|
const titlebar = document.getElementById("navigator-toolbox");
|
||||||
|
titlebar.insertAdjacentElement("afterend", splitter);
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
ZenStartup.init();
|
|
@ -1,12 +1,13 @@
|
||||||
diff --git a/browser/base/content/browser-init.js b/browser/base/content/browser-init.js
|
diff --git a/browser/base/content/browser-init.js b/browser/base/content/browser-init.js
|
||||||
index a79a9734619f89639c15087fe28e9615354a7209..edaef604d33d76b570571e1bbb2ebc590e045d87 100644
|
index f8d49ac2a3a62f389ea44b07a26fcb102abc0b24..c29415e10c776ebc435f33e55f8afb71f0dcf22a 100644
|
||||||
--- a/browser/base/content/browser-init.js
|
--- a/browser/base/content/browser-init.js
|
||||||
+++ b/browser/base/content/browser-init.js
|
+++ b/browser/base/content/browser-init.js
|
||||||
@@ -237,6 +237,9 @@ var gBrowserInit = {
|
@@ -237,6 +237,10 @@ var gBrowserInit = {
|
||||||
gPrivateBrowsingUI.init();
|
gPrivateBrowsingUI.init();
|
||||||
BrowserSearch.init();
|
BrowserSearch.init();
|
||||||
BrowserPageActions.init();
|
BrowserPageActions.init();
|
||||||
+
|
+
|
||||||
|
+ Services.scriptloader.loadSubScript("chrome://browser/content/ZenStartup.mjs", window);
|
||||||
+ Services.scriptloader.loadSubScript("chrome://browser/content/zenThemeModifier.js", window);
|
+ Services.scriptloader.loadSubScript("chrome://browser/content/zenThemeModifier.js", window);
|
||||||
+
|
+
|
||||||
if (gToolbarKeyNavEnabled) {
|
if (gToolbarKeyNavEnabled) {
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
diff --git a/browser/base/content/browser.xhtml b/browser/base/content/browser.xhtml
|
diff --git a/browser/base/content/browser.xhtml b/browser/base/content/browser.xhtml
|
||||||
index 481ebbee437250c71e9bd10c4fb6fc0c31314925..b83cbabc85fd0647d0d71b7928a9256bba4dece6 100644
|
index 481ebbee437250c71e9bd10c4fb6fc0c31314925..3bb046a4635fad831cc447e29516ee5ed407a3f2 100644
|
||||||
--- a/browser/base/content/browser.xhtml
|
--- a/browser/base/content/browser.xhtml
|
||||||
+++ b/browser/base/content/browser.xhtml
|
+++ b/browser/base/content/browser.xhtml
|
||||||
@@ -138,6 +138,8 @@
|
@@ -138,6 +138,8 @@
|
||||||
|
@ -27,10 +27,3 @@ index 481ebbee437250c71e9bd10c4fb6fc0c31314925..b83cbabc85fd0647d0d71b7928a9256b
|
||||||
|
|
||||||
<html:template id="customizationPanel">
|
<html:template id="customizationPanel">
|
||||||
<box id="customization-container" flex="1" hidden="true"><![CDATA[
|
<box id="customization-container" flex="1" hidden="true"><![CDATA[
|
||||||
@@ -175,5 +180,6 @@
|
|
||||||
|
|
||||||
<!-- Put it at the very end to make sure it's not covered by anything. -->
|
|
||||||
<html:div id="fullscr-toggler" hidden="hidden"/>
|
|
||||||
+#include zen-watermark.inc.xhtml
|
|
||||||
</html:body>
|
|
||||||
</html>
|
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
|
|
||||||
|
|
||||||
content/browser/zenThemeModifier.js (content/zenThemeModifier.js)
|
content/browser/zenThemeModifier.js (content/zenThemeModifier.js)
|
||||||
|
content/browser/ZenStartup.mjs (content/ZenStartup.mjs)
|
||||||
content/browser/ZenUIManager.mjs (content/ZenUIManager.mjs)
|
content/browser/ZenUIManager.mjs (content/ZenUIManager.mjs)
|
||||||
content/browser/zen-components/ZenViewSplitter.mjs (content/zen-components/src/ZenViewSplitter.mjs)
|
content/browser/zen-components/ZenViewSplitter.mjs (content/zen-components/src/ZenViewSplitter.mjs)
|
||||||
content/browser/zen-components/ZenWorkspaces.mjs (content/zen-components/src/ZenWorkspaces.mjs)
|
content/browser/zen-components/ZenWorkspaces.mjs (content/zen-components/src/ZenWorkspaces.mjs)
|
||||||
|
@ -8,7 +9,7 @@
|
||||||
content/browser/zen-components/ZenProfileDialogUI.mjs (content/zen-components/src/ZenProfileDialogUI.mjs)
|
content/browser/zen-components/ZenProfileDialogUI.mjs (content/zen-components/src/ZenProfileDialogUI.mjs)
|
||||||
content/browser/zen-components/ZenKeyboardShortcuts.mjs (content/zen-components/src/ZenKeyboardShortcuts.mjs)
|
content/browser/zen-components/ZenKeyboardShortcuts.mjs (content/zen-components/src/ZenKeyboardShortcuts.mjs)
|
||||||
content/browser/zen-components/ZenThemeBuilder.mjs (content/zen-components/src/ZenThemeBuilder.mjs)
|
content/browser/zen-components/ZenThemeBuilder.mjs (content/zen-components/src/ZenThemeBuilder.mjs)
|
||||||
|
|
||||||
content/browser/zen-styles/zen-theme.css (content/zen-styles/zen-theme.css)
|
content/browser/zen-styles/zen-theme.css (content/zen-styles/zen-theme.css)
|
||||||
content/browser/zen-styles/zen-buttons.css (content/zen-styles/zen-buttons.css)
|
content/browser/zen-styles/zen-buttons.css (content/zen-styles/zen-buttons.css)
|
||||||
content/browser/zen-styles/zen-tabs.css (content/zen-styles/zen-tabs.css)
|
content/browser/zen-styles/zen-tabs.css (content/zen-styles/zen-tabs.css)
|
||||||
|
|
|
@ -31,7 +31,7 @@
|
||||||
|
|
||||||
#tabbrowser-tabpanels:has(> [zen-split="true"]) {
|
#tabbrowser-tabpanels:has(> [zen-split="true"]) {
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-gap: 0 5px;
|
grid-gap: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#zen-split-views-box:not([hidden="true"]) {
|
#zen-split-views-box:not([hidden="true"]) {
|
||||||
|
|
|
@ -346,7 +346,7 @@
|
||||||
#zen-sidebar-icons-wrapper {
|
#zen-sidebar-icons-wrapper {
|
||||||
width: -moz-available;
|
width: -moz-available;
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: repeat(auto-fill, minmax(36px, 1fr));
|
grid-template-columns: repeat(auto-fill, minmax(37px, 1fr));
|
||||||
transition: .1s;
|
transition: .1s;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,4 +0,0 @@
|
||||||
|
|
||||||
<html:div id="zen-watermark">
|
|
||||||
<image src="chrome://branding/content/about-logo.png" />
|
|
||||||
</html:div>
|
|
|
@ -33,12 +33,13 @@ var ZenThemeModifier = {
|
||||||
init() {
|
init() {
|
||||||
this._inMainBrowserWindow = window.location.href == "chrome://browser/content/browser.xhtml";
|
this._inMainBrowserWindow = window.location.href == "chrome://browser/content/browser.xhtml";
|
||||||
this.listenForEvents();
|
this.listenForEvents();
|
||||||
this.updateExtraBrowserStyles();
|
|
||||||
this.updateAllThemeBasics();
|
this.updateAllThemeBasics();
|
||||||
this._zenInitBrowserLayout();
|
this._onPrefersColorSchemeChange();
|
||||||
},
|
},
|
||||||
|
|
||||||
listenForEvents() {
|
listenForEvents() {
|
||||||
|
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', this._onPrefersColorSchemeChange.bind(this));
|
||||||
|
|
||||||
Services.prefs.addObserver(kZenThemeAccentColorPref, this.handleEvent.bind(this));
|
Services.prefs.addObserver(kZenThemeAccentColorPref, this.handleEvent.bind(this));
|
||||||
Services.prefs.addObserver(kZenThemeBorderRadiusPref, this.handleEvent.bind(this));
|
Services.prefs.addObserver(kZenThemeBorderRadiusPref, this.handleEvent.bind(this));
|
||||||
},
|
},
|
||||||
|
@ -74,96 +75,8 @@ var ZenThemeModifier = {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
updateExtraBrowserStyles() {
|
_onPrefersColorSchemeChange() {
|
||||||
// If we are in the main browser window, we can add some extra styles.
|
|
||||||
if (!this._inMainBrowserWindow) return;
|
|
||||||
this._changeSidebarLocation();
|
|
||||||
},
|
|
||||||
|
|
||||||
_changeSidebarLocation() {
|
|
||||||
const kElementsToAppend = [
|
|
||||||
"sidebar-splitter",
|
|
||||||
"sidebar-box",
|
|
||||||
"navigator-toolbox",
|
|
||||||
];
|
|
||||||
const wrapper = document.getElementById("zen-tabbox-wrapper");
|
|
||||||
const appWrapepr = document.getElementById("zen-sidebar-box-container");
|
|
||||||
for (let id of kElementsToAppend) {
|
|
||||||
const elem = document.getElementById(id);
|
|
||||||
if (elem) {
|
|
||||||
wrapper.prepend(elem);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
appWrapepr.setAttribute("hidden", "true");
|
|
||||||
|
|
||||||
// Set a splitter to navigator-toolbox
|
|
||||||
const splitter = document.createXULElement("splitter");
|
|
||||||
splitter.setAttribute("id", "zen-sidebar-splitter");
|
|
||||||
splitter.setAttribute("orient", "horizontal");
|
|
||||||
splitter.setAttribute("resizebefore", "sibling");
|
|
||||||
splitter.setAttribute("resizeafter", "none");
|
|
||||||
const titlebar = document.getElementById("navigator-toolbox");
|
|
||||||
titlebar.insertAdjacentElement("afterend", splitter);
|
|
||||||
},
|
|
||||||
|
|
||||||
_zenInitBrowserLayout() {
|
|
||||||
if (!this._inMainBrowserWindow) return;
|
|
||||||
if (this.__hasInitBrowserLayout) return;
|
|
||||||
this.__hasInitBrowserLayout = true;
|
|
||||||
this.openWatermark();
|
|
||||||
console.info("ZenThemeModifier: init browser layout");
|
|
||||||
const kNavbarItems = [
|
|
||||||
"nav-bar",
|
|
||||||
"PersonalToolbar"
|
|
||||||
];
|
|
||||||
const kNewContainerId = "zen-appcontent-navbar-container";
|
|
||||||
let newContainer = document.getElementById(kNewContainerId);
|
|
||||||
for (let id of kNavbarItems) {
|
|
||||||
const node = document.getElementById(id);
|
|
||||||
console.assert(node, "Could not find node with id: " + id);
|
|
||||||
if (!node) continue;
|
|
||||||
newContainer.appendChild(node);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Fix notification deck
|
|
||||||
document.getElementById("zen-appcontent-navbar-container")
|
|
||||||
.appendChild(document.getElementById("tab-notification-deck-template"));
|
|
||||||
|
|
||||||
gZenVerticalTabsManager.init();
|
|
||||||
gZenCompactModeManager.init();
|
|
||||||
gZenKeyboardShortcuts.init();
|
|
||||||
|
|
||||||
this._updateZenAvatar();
|
this._updateZenAvatar();
|
||||||
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', this._onPrefersColorSchemeChange.bind(this));
|
|
||||||
|
|
||||||
function throttle(f, delay) {
|
|
||||||
let timer = 0;
|
|
||||||
return function(...args) {
|
|
||||||
clearTimeout(timer);
|
|
||||||
timer = setTimeout(() => f.apply(this, args), delay);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
new ResizeObserver(throttle(
|
|
||||||
this._updateTabsToolbar.bind(this), 1000
|
|
||||||
)).observe(document.getElementById("tabbrowser-tabs"));
|
|
||||||
|
|
||||||
this.closeWatermark();
|
|
||||||
},
|
|
||||||
|
|
||||||
_onPrefersColorSchemeChange(event) {
|
|
||||||
this._updateZenAvatar();
|
|
||||||
},
|
|
||||||
|
|
||||||
_updateTabsToolbar() {
|
|
||||||
// Set tabs max-height to the "toolbar-items" height
|
|
||||||
const toolbarItems = document.getElementById("tabbrowser-tabs");
|
|
||||||
const tabs = document.getElementById("tabbrowser-arrowscrollbox");
|
|
||||||
tabs.style.maxHeight = '0px'; // reset to 0
|
|
||||||
const toolbarRect = toolbarItems.getBoundingClientRect();
|
|
||||||
// -5 for the controls padding
|
|
||||||
tabs.style.maxHeight = toolbarRect.height - 5 + "px";
|
|
||||||
console.info("ZenThemeModifier: set tabs max-height to", toolbarRect.height + "px");
|
|
||||||
},
|
},
|
||||||
|
|
||||||
_updateZenAvatar() {
|
_updateZenAvatar() {
|
||||||
|
@ -192,23 +105,6 @@ var ZenThemeModifier = {
|
||||||
let scheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? "dark" : "light";
|
let scheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? "dark" : "light";
|
||||||
return `${withoutExtension}-${scheme}.svg`;
|
return `${withoutExtension}-${scheme}.svg`;
|
||||||
},
|
},
|
||||||
|
|
||||||
openWatermark() {
|
|
||||||
if (!Services.prefs.getBoolPref("zen.watermark.enabled", false)) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
const watermark = document.getElementById("zen-watermark");
|
|
||||||
if (watermark) {
|
|
||||||
watermark.removeAttribute("hidden");
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
closeWatermark() {
|
|
||||||
const watermark = document.getElementById("zen-watermark");
|
|
||||||
if (watermark) {
|
|
||||||
watermark.setAttribute("hidden", "true");
|
|
||||||
}
|
|
||||||
},
|
|
||||||
};
|
};
|
||||||
|
|
||||||
if (typeof Services !== "undefined")
|
if (typeof Services !== "undefined")
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue