mirrors/desktop
1
0
Fork 0
mirror of https://github.com/zen-browser/desktop.git synced 2025-10-03 16:36:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

Enhance ZenUIManager for improved toolbar handling and compact mode layout

Browse Source
This commit is contained in:
mr. M
2024-11-24 21:12:33 +01:00
parent 065834567a
commit 3f58521db2
2 changed files with 20 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/browser/base/content/ZenUIManager.mjs
View File

@@ -127,6 +127,8 @@ var gZenVerticalTabsManager = {
Services.prefs.addObserver('zen.view.sidebar-expanded.max-width', updateEvent); Services.prefs.addObserver('zen.view.sidebar-expanded.max-width', updateEvent);
Services.prefs.addObserver('zen.view.use-single-toolbar', updateEvent); Services.prefs.addObserver('zen.view.use-single-toolbar', updateEvent);
this._toolbarOriginalParent = document.getElementById('nav-bar').parentElement;
gZenCompactModeManager.addEventListener(updateEvent); gZenCompactModeManager.addEventListener(updateEvent);
this._updateEvent(); this._updateEvent();
this.initRightSideOrderContextMenu(); this.initRightSideOrderContextMenu();
@@ -192,6 +194,10 @@ var gZenVerticalTabsManager = {
}, },
_updateEvent() { _updateEvent() {
if (this._isUpdating) {
return;
}
this._isUpdating = true;
this._updateMaxWidth(); this._updateMaxWidth();
const topButtons = document.getElementById('zen-sidebar-top-buttons'); const topButtons = document.getElementById('zen-sidebar-top-buttons');
const isCompactMode = Services.prefs.getBoolPref('zen.view.compact'); const isCompactMode = Services.prefs.getBoolPref('zen.view.compact');
@@ -228,9 +234,9 @@ var gZenVerticalTabsManager = {
let windowButtons = this.actualWindowButtons; let windowButtons = this.actualWindowButtons;
let doNotChangeWindowButtons = !isCompactMode && isRightSide && this.isWindowsStyledButtons; let doNotChangeWindowButtons = !isCompactMode && isRightSide && this.isWindowsStyledButtons;
const navBar = document.getElementById('nav-bar');
if (isSingleToolbar) { if (isSingleToolbar) {
const navBar = document.getElementById('nav-bar');
this._navbarParent = navBar.parentElement; this._navbarParent = navBar.parentElement;
let elements = document.querySelectorAll('#nav-bar-customization-target > *:is(toolbarbutton, #stop-reload-button)'); let elements = document.querySelectorAll('#nav-bar-customization-target > *:is(toolbarbutton, #stop-reload-button)');
elements = Array.from(elements); elements = Array.from(elements);
@@ -247,12 +253,18 @@ var gZenVerticalTabsManager = {
if (this.isWindowsStyledButtons && !doNotChangeWindowButtons) { if (this.isWindowsStyledButtons && !doNotChangeWindowButtons) {
document.getElementById('zen-appcontent-navbar-container').append(windowButtons); document.getElementById('zen-appcontent-navbar-container').append(windowButtons);
} }
if (isCompactMode) {
titlebar.prepend(navBar);
titlebar.prepend(topButtons);
} else {
titlebar.before(topButtons);
titlebar.before(navBar);
}
document.documentElement.setAttribute("zen-single-toolbar", true); document.documentElement.setAttribute("zen-single-toolbar", true);
this._hasSetSingleToolbar = true; this._hasSetSingleToolbar = true;
} else if (this._hasSetSingleToolbar) { } else if (this._hasSetSingleToolbar) {
this._hasSetSingleToolbar = false; this._hasSetSingleToolbar = false;
// Do the opposite // Do the opposite
const navBar = document.getElementById('nav-bar');
this._navbarParent.prepend(navBar); this._navbarParent.prepend(navBar);
const elements = document.querySelectorAll('#zen-sidebar-top-buttons-customization-target > *:is(toolbarbutton, #stop-reload-button)'); const elements = document.querySelectorAll('#zen-sidebar-top-buttons-customization-target > *:is(toolbarbutton, #stop-reload-button)');
for (const button of elements) { for (const button of elements) {
@@ -270,15 +282,14 @@ var gZenVerticalTabsManager = {
navBar.prepend(windowButtons); navBar.prepend(windowButtons);
} }
} }
this._toolbarOriginalParent.prepend(navBar);
CustomizableUI.zenInternalCU._rebuildRegisteredAreas(); CustomizableUI.zenInternalCU._rebuildRegisteredAreas();
} }
if (isCompactMode) { if (isCompactMode) {
titlebar.prepend(navBar);
titlebar.prepend(topButtons); titlebar.prepend(topButtons);
} else { } else {
titlebar.before(topButtons); titlebar.before(topButtons);
titlebar.before(navBar);
} }
if (doNotChangeWindowButtons) { if (doNotChangeWindowButtons) {
@@ -287,6 +298,7 @@ var gZenVerticalTabsManager = {
// Always move the splitter next to the sidebar // Always move the splitter next to the sidebar
this.navigatorToolbox.after(document.getElementById('zen-sidebar-splitter')); this.navigatorToolbox.after(document.getElementById('zen-sidebar-splitter'));
this._isUpdating = false;
}, },
_updateMaxWidth() { _updateMaxWidth() {

4
src/browser/base/content/zen-styles/zen-compact-mode.css
View File

@@ -35,6 +35,10 @@
:root[zen-single-toolbar='true'] & { :root[zen-single-toolbar='true'] & {
top: var(--zen-element-separation); top: var(--zen-element-separation);
& #nav-bar {
margin-left: calc(var(--zen-toolbox-padding) / 2) !important;
}
} }
} }