diff --git a/src/browser/base/content/ZenStartup.mjs b/src/browser/base/content/ZenStartup.mjs index f2b9f8961..7bba4b136 100644 --- a/src/browser/base/content/ZenStartup.mjs +++ b/src/browser/base/content/ZenStartup.mjs @@ -97,20 +97,21 @@ _changeSidebarLocation() { const kElementsToAppend = ['sidebar-splitter', 'sidebar-box']; - 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'); const browser = document.getElementById('browser'); const toolbox = document.getElementById('navigator-toolbox'); browser.prepend(toolbox); + const sidebarPanelWrapper = document.getElementById('tabbrowser-tabbox'); + for (let id of kElementsToAppend) { + const elem = document.getElementById(id); + if (elem) { + sidebarPanelWrapper.prepend(elem); + } + } + // remove all styles except for the width, since we are xulstoring the complet style list const width = toolbox.style.width; toolbox.removeAttribute('style'); diff --git a/src/browser/base/content/zen-components b/src/browser/base/content/zen-components index fc7f08c82..9f32f780c 160000 --- a/src/browser/base/content/zen-components +++ b/src/browser/base/content/zen-components @@ -1 +1 @@ -Subproject commit fc7f08c827a91f6445cb4dff0f42de6b4ecb3bca +Subproject commit 9f32f780ca3c5cff56f7a9927aea8c3287d9d7fa diff --git a/src/browser/base/content/zen-styles/zen-compact-mode.css b/src/browser/base/content/zen-styles/zen-compact-mode.css index 48fd173b7..0dafb25d9 100644 --- a/src/browser/base/content/zen-styles/zen-compact-mode.css +++ b/src/browser/base/content/zen-styles/zen-compact-mode.css @@ -1,11 +1,5 @@ /* All overrides for compact mode go here */ -@media not (-moz-bool-pref: 'zen.view.compact') { - #sidebar-box { - margin-top: 0 !important; - } -} - @media (-moz-bool-pref: 'zen.view.compact') { :root:not([customizing]) { @media (-moz-bool-pref: 'zen.view.compact.hide-tabbar') { @@ -92,6 +86,11 @@ padding-top: var(--zen-element-separation) !important; } + #sidebar-box, + #zen-sidebar-web-panel-wrapper { + margin-top: var(--zen-element-separation) !important; + } + #zen-appcontent-navbar-container { position: absolute; top: 0; diff --git a/src/browser/base/content/zen-styles/zen-sidebar.css b/src/browser/base/content/zen-styles/zen-sidebar.css index c9491f058..1d7ad8fff 100644 --- a/src/browser/base/content/zen-styles/zen-sidebar.css +++ b/src/browser/base/content/zen-styles/zen-sidebar.css @@ -58,12 +58,13 @@ toolbar { #zen-tabbox-wrapper { & #sidebar-splitter { opacity: 0; + margin-inline-end: -4px; } & #sidebar-box { border-radius: var(--zen-border-radius); box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.1); - margin-bottom: var(--zen-element-separation) !important; + margin-bottom: var(--zen-element-separation); overflow: hidden; border: 1px solid var(--zen-colors-border); diff --git a/src/browser/components/sidebar/browser-sidebar-js.patch b/src/browser/components/sidebar/browser-sidebar-js.patch index 1a2361b87..89a491f0d 100644 --- a/src/browser/components/sidebar/browser-sidebar-js.patch +++ b/src/browser/components/sidebar/browser-sidebar-js.patch @@ -1,17 +1,17 @@ diff --git a/browser/components/sidebar/browser-sidebar.js b/browser/components/sidebar/browser-sidebar.js -index 8b4f22ebc13fd013b82e9544dabcbe53d4429c13..22d21bcb825d35648213945bd4275d37b5c10a11 100644 +index c68a32794996348d95f3b1ee363be2eec587065e..3a163c75ac10a204754648dfd1332c79895799c7 100644 --- a/browser/components/sidebar/browser-sidebar.js +++ b/browser/components/sidebar/browser-sidebar.js -@@ -473,7 +473,7 @@ var SidebarController = { +@@ -521,7 +521,7 @@ var SidebarController = { */ setPosition() { // First reset all ordinals to match DOM ordering. - let browser = document.getElementById("browser"); -+ let browser = document.getElementById("zen-tabbox-wrapper"); ++ let browser = document.getElementById("tabbrowser-tabbox"); [...browser.children].forEach((node, i) => { node.style.order = i + 1; }); -@@ -487,9 +487,11 @@ var SidebarController = { +@@ -535,9 +535,11 @@ var SidebarController = { let boxOrdinal = this._box.style.order; this._box.style.order = appcontent.style.order; @@ -25,11 +25,12 @@ index 8b4f22ebc13fd013b82e9544dabcbe53d4429c13..22d21bcb825d35648213945bd4275d37 // Indicate we've switched ordering to the box this._box.setAttribute("positionend", true); sidebarMain.setAttribute("positionend", true); -@@ -498,6 +500,8 @@ var SidebarController = { +@@ -546,6 +548,9 @@ var SidebarController = { this._box.removeAttribute("positionend"); sidebarMain.removeAttribute("positionend"); sidebarContainer.removeAttribute("positionend"); + this._box.style.order = 1; ++ this._splitter.style.order = 2; + this._splitter.style.removeProperty("margin-right"); }