diff --git a/src/browser/app/profile/zen-browser.js b/src/browser/app/profile/zen-browser.js
index eb9fc7bc..5f4929e1 100644
--- a/src/browser/app/profile/zen-browser.js
+++ b/src/browser/app/profile/zen-browser.js
@@ -118,12 +118,10 @@ pref('zen.glance.activation-method', 'ctrl'); // ctrl, alt, shift, none, hold
#endif
pref('zen.view.sidebar-height-throttle', 200); // in ms
-pref('zen.view.sidebar-expanded', true);
-pref('zen.view.sidebar-expanded.on-hover', false);
pref('zen.view.sidebar-expanded.max-width', 400);
pref('zen.view.show-bottom-border', false);
-pref('zen.view.sidebar-collapsed.hide-mute-button', true);
+pref('zen.view.use-single-toolbar', true);
pref('zen.tabs.dim-pending', true);
pref('zen.tabs.newtab-on-middle-click', true);
diff --git a/src/browser/base/content/ZenCustomizableUI.sys.mjs b/src/browser/base/content/ZenCustomizableUI.sys.mjs
index e1d5368b..d1172747 100644
--- a/src/browser/base/content/ZenCustomizableUI.sys.mjs
+++ b/src/browser/base/content/ZenCustomizableUI.sys.mjs
@@ -9,7 +9,7 @@ export var ZenCustomizableUI = new (class {
'zen-sidebar-top-buttons',
{
type: this.TYPE_TOOLBAR,
- defaultPlacements: ['preferences-button', 'zen-expand-sidebar-button', 'zen-sidepanel-button'],
+ defaultPlacements: ['zen-sidepanel-button'],
defaultCollapsed: null,
},
true
@@ -45,7 +45,6 @@ export var ZenCustomizableUI = new (class {
customizationtarget="zen-sidebar-top-buttons-customization-target"
mode="icons">
diff --git a/src/browser/base/content/ZenUIManager.mjs b/src/browser/base/content/ZenUIManager.mjs
index 235b830a..49ccc4e9 100644
--- a/src/browser/base/content/ZenUIManager.mjs
+++ b/src/browser/base/content/ZenUIManager.mjs
@@ -118,10 +118,8 @@ var gZenUIManager = {
var gZenVerticalTabsManager = {
init() {
var updateEvent = this._updateEvent.bind(this);
- Services.prefs.addObserver('zen.view.sidebar-expanded', updateEvent);
Services.prefs.addObserver('zen.tabs.vertical.right-side', updateEvent);
Services.prefs.addObserver('zen.view.sidebar-expanded.max-width', updateEvent);
- Services.prefs.addObserver('zen.view.sidebar-expanded.on-hover', updateEvent);
gZenCompactModeManager.addEventListener(updateEvent);
this._updateEvent();
@@ -152,31 +150,6 @@ var gZenVerticalTabsManager = {
return this._navigatorToolbox;
},
- _updateOnHoverVerticalTabs() {
- const onHover = Services.prefs.getBoolPref('zen.view.sidebar-expanded.on-hover');
- const expanded = Services.prefs.getBoolPref('zen.view.sidebar-expanded');
- const sidebar = this.navigatorToolbox;
-
- if (onHover) {
- // if the sidebar is not expanded, and hover detection is enabled, show the sidebar
- sidebar.removeAttribute('zen-expanded');
- sidebar.setAttribute('zen-user-hover', 'true');
-
- sidebar.removeAttribute('zen-has-hover');
- }
- else if (expanded) {
- // if the sidebar is expanded, close, and remove hover detection
- sidebar.setAttribute('zen-expanded', 'true');
- sidebar.removeAttribute('zen-user-hover');
- sidebar.removeAttribute('zen-has-hover');
- } else {
- // if the sidebar is not expanded, and hover detection is disabled, hide the sidebar
- sidebar.removeAttribute('zen-expanded');
- sidebar.removeAttribute('zen-user-show');
- sidebar.removeAttribute('zen-user-hover');
- }
- },
-
initRightSideOrderContextMenu() {
const kConfigKey = 'zen.tabs.vertical.right-side';
const fragment = window.MozXULElement.parseXULToFragment(`
@@ -190,13 +163,14 @@ var gZenVerticalTabsManager = {
document.getElementById('viewToolbarsMenuSeparator').before(fragment);
},
+ get isWindowsStyledButtons() {
+ return !(window.AppConstants.platform === 'macosx'|| window.matchMedia('(-moz-gtk-csd-reversed-placement)').matches);
+ },
+
_updateEvent() {
this._updateMaxWidth();
const topButtons = document.getElementById('zen-sidebar-top-buttons');
const customizationTarget = document.getElementById('nav-bar-customization-target');
- const tabboxWrapper = document.getElementById('zen-tabbox-wrapper');
- const browser = document.getElementById('browser');
- const sidebarExpanded = Services.prefs.getBoolPref('zen.view.sidebar-expanded');
if (Services.prefs.getBoolPref('zen.tabs.vertical.right-side')) {
this.navigatorToolbox.setAttribute('zen-right-side', 'true');
@@ -206,10 +180,8 @@ var gZenVerticalTabsManager = {
// Check if the sidebar is in hover mode
if (
- sidebarExpanded &&
!this.navigatorToolbox.hasAttribute('zen-right-side') &&
- !Services.prefs.getBoolPref('zen.view.compact') &&
- !Services.prefs.getBoolPref('zen.view.sidebar-expanded.on-hover')
+ !Services.prefs.getBoolPref('zen.view.compact')
) {
this.navigatorToolbox.prepend(topButtons);
// browser.prepend(this.navigatorToolbox);
@@ -218,28 +190,39 @@ var gZenVerticalTabsManager = {
// tabboxWrapper.prepend(this.navigatorToolbox);
}
+ if (Services.prefs.getBoolPref('zen.view.use-single-toolbar')) {
+ if (!topButtons.contains(document.getElementById('nav-bar'))) {
+ topButtons.after(document.getElementById('nav-bar'));
+ }
+ let elements = document.querySelectorAll('#nav-bar-customization-target > *:is(toolbarbutton, #stop-reload-button)');
+ elements = Array.from(elements);
+ const buttonsTarget = document.getElementById('zen-sidebar-top-buttons-customization-target');
+ for (const button of elements) {
+ buttonsTarget.append(button);
+ }
+ topButtons.appendChild(document.getElementById('PanelUI-button'));
+ if (this.isWindowsStyledButtons) {
+ document.getElementById('zen-appcontent-navbar-container').append(
+ document.querySelector('#nav-bar > .titlebar-buttonbox-container')
+ );
+ }
+ }
+
// Always move the splitter next to the sidebar
this.navigatorToolbox.after(document.getElementById('zen-sidebar-splitter'));
-
- this._updateOnHoverVerticalTabs();
},
_updateMaxWidth() {
const isCompactMode = Services.prefs.getBoolPref('zen.view.compact');
- const expanded = this.expanded;
const maxWidth = Services.prefs.getIntPref('zen.view.sidebar-expanded.max-width');
const toolbox = document.getElementById('navigator-toolbox');
- if (expanded && !isCompactMode) {
+ if (!isCompactMode) {
toolbox.style.maxWidth = `${maxWidth}px`;
} else {
toolbox.style.removeProperty('maxWidth');
}
},
- get expanded() {
- return Services.prefs.getBoolPref('zen.view.sidebar-expanded');
- },
-
get expandButton() {
if (this._expandButton) {
return this._expandButton;
@@ -248,30 +231,6 @@ var gZenVerticalTabsManager = {
return this._expandButton;
},
- toggleExpand() {
- const pausedForExpand = this._hoverPausedForExpand;
- const onHover = Services.prefs.getBoolPref('zen.view.sidebar-expanded.on-hover');
- const expanded = Services.prefs.getBoolPref('zen.view.sidebar-expanded');
-
-
- if (onHover && !expanded) {
- // Expand sidebar and disable hover detection
- Services.prefs.setBoolPref('zen.view.sidebar-expanded.on-hover', false);
- this._hoverPausedForExpand = true;
- Services.prefs.setBoolPref('zen.view.sidebar-expanded', true);
- } else if (pausedForExpand && expanded) {
- // Re-enable hover detection when closing
- this._hoverPausedForExpand = false;
- Services.prefs.setBoolPref('zen.view.sidebar-expanded', false);
- Services.prefs.setBoolPref('zen.view.sidebar-expanded.on-hover', true); // Re-enable hover detection when closing
- }
- else {
- // Toggle sidebar
- Services.prefs.setBoolPref('zen.view.sidebar-expanded.on-hover', false);
- Services.prefs.setBoolPref('zen.view.sidebar-expanded', !expanded);
- }
- },
-
toggleTabsOnRight() {
const newVal = !Services.prefs.getBoolPref('zen.tabs.vertical.right-side');
Services.prefs.setBoolPref('zen.tabs.vertical.right-side', newVal);
diff --git a/src/browser/base/content/zen-assets.inc.xhtml b/src/browser/base/content/zen-assets.inc.xhtml
index bf1fef9c..f7f430d0 100644
--- a/src/browser/base/content/zen-assets.inc.xhtml
+++ b/src/browser/base/content/zen-assets.inc.xhtml
@@ -20,7 +20,6 @@
-
diff --git a/src/browser/base/content/zen-assets.jar.inc.mn b/src/browser/base/content/zen-assets.jar.inc.mn
index 52d6305e..db767710 100644
--- a/src/browser/base/content/zen-assets.jar.inc.mn
+++ b/src/browser/base/content/zen-assets.jar.inc.mn
@@ -43,7 +43,6 @@
content/browser/zen-styles/zen-popup.css (content/zen-styles/zen-popup.css)
content/browser/zen-styles/zen-sidebar-panels.css (content/zen-styles/zen-sidebar-panels.css)
content/browser/zen-styles/zen-gradient-generator.css (content/zen-styles/zen-gradient-generator.css)
- content/browser/zen-styles/zen-cool-toolbar.css (content/zen-styles/zen-cool-toolbar.css)
content/browser/zen-styles/zen-panels/bookmarks.css (content/zen-styles/zen-panels/bookmarks.css)
content/browser/zen-styles/zen-panels/extensions.css (content/zen-styles/zen-panels/extensions.css)
diff --git a/src/browser/base/content/zen-styles/zen-browser-container.css b/src/browser/base/content/zen-styles/zen-browser-container.css
index 5d8b9991..95c2e832 100644
--- a/src/browser/base/content/zen-styles/zen-browser-container.css
+++ b/src/browser/base/content/zen-styles/zen-browser-container.css
@@ -4,9 +4,17 @@
border-radius: var(--zen-webview-border-radius, var(--zen-border-radius));
position: relative;
- &:not([zen-split="true"]) {
- border-bottom-left-radius: 0;
- border-bottom-right-radius: 0;
+ box-shadow: 0 0 1px 1px light-dark(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5));
+ border-radius: var(--zen-border-radius);
+ overflow: hidden;
+
+ #browser:has(#navigator-toolbox[zen-right-side='true']) & {
+ margin-right: 0;
+ margin-left: var(--zen-element-separation);
+ }
+
+ :root[zen-no-padding='true'] &:not([zen-split="true"]) {
+ border-radius: 0 !important;
}
}
}
diff --git a/src/browser/base/content/zen-styles/zen-browser-ui.css b/src/browser/base/content/zen-styles/zen-browser-ui.css
index 318d7c40..decc7a7a 100644
--- a/src/browser/base/content/zen-styles/zen-browser-ui.css
+++ b/src/browser/base/content/zen-styles/zen-browser-ui.css
@@ -77,6 +77,19 @@
overflow-x: hidden;
}
+:root:not([inDOMFullscreen='true']):not([chromehidden~='location']):not([chromehidden~='toolbar']) {
+ & #zen-appcontent-wrapper {
+ margin: var(--zen-element-separation);
+ margin-left: 0;
+ margin-top: 0;
+ }
+
+ #browser:has(#navigator-toolbox[zen-right-side='true']) & #zen-appcontent-wrapper {
+ margin-right: 0;
+ margin-left: var(--zen-element-separation);
+ }
+}
+
#tabbrowser-tabbox {
display: flex;
flex-direction: row;
diff --git a/src/browser/base/content/zen-styles/zen-cool-toolbar.css b/src/browser/base/content/zen-styles/zen-cool-toolbar.css
deleted file mode 100644
index 2da1d7d8..00000000
--- a/src/browser/base/content/zen-styles/zen-cool-toolbar.css
+++ /dev/null
@@ -1,45 +0,0 @@
-
-:root:not([inDOMFullscreen='true']):not([chromehidden~='location']):not([chromehidden~='toolbar']):not(:has(#tabbrowser-tabpanels[zen-split-view='true'])) {
- & #zen-appcontent-wrapper {
- box-shadow: 0 0 1px 1px light-dark(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5));
- border-radius: var(--zen-border-radius);
- padding: 0;
- overflow: hidden;
- margin: var(--zen-element-separation);
- margin-left: 0;
-
- #browser:has(#navigator-toolbox[zen-right-side='true']) & {
- margin-right: 0;
- margin-left: var(--zen-element-separation);
- }
-
- & #zen-appcontent-navbar-container {
- background: color-mix(in srgb, var(--zen-colors-tertiary) 90%, transparent 10%);
- }
-
- :root[zen-no-padding='true'] & {
- border-radius: 0 !important;
- }
- }
-
- & #zen-appcontent-navbar-container {
- padding-left: 5px;
- }
-
- @media (-moz-platform: macos) {
- & #zen-appcontent-navbar-container {
- padding-right: 5px;
- }
- }
-
- & #zen-appcontent-navbar-container {
- border-bottom: 1px solid light-dark(rgba(0,0,0,.04), rgba(255,255,255,.04));
- }
-
- @media (-moz-bool-pref: 'zen.view.compact') {
- @media (-moz-bool-pref: 'zen.view.compact.hide-toolbar') {
- @media not (-moz-platform: macos) {
- }
- }
- }
-}
diff --git a/src/browser/base/content/zen-styles/zen-glance.css b/src/browser/base/content/zen-styles/zen-glance.css
index 31d37b84..cc7bd901 100644
--- a/src/browser/base/content/zen-styles/zen-glance.css
+++ b/src/browser/base/content/zen-styles/zen-glance.css
@@ -4,11 +4,11 @@
visibility: inherit;
}
-#zen-appcontent-wrapper {
+#tabbrowser-tabpanels {
transition: transform 0.1s ease-in-out;
}
-#zen-appcontent-wrapper:has(.zen-glance-background) {
+#tabbrowser-tabpanels:has(.zen-glance-background) {
transform: scale(0.98);
backdrop-filter: blur(5px);
diff --git a/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css b/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css
index a83113fb..bf79270b 100644
--- a/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css
+++ b/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css
@@ -51,6 +51,19 @@
order: 0 !important;
display: flex;
+
+ & toolbarspring { display: none; }
+ }
+
+ @media (-moz-bool-pref: 'zen.view.use-single-toolbar') {
+ & #zen-appcontent-navbar-container > .titlebar-buttonbox-container {
+ margin-left: auto;
+ width: fit-content;
+ }
+
+ & #urlbar-container {
+ width: -moz-available !important;
+ }
}
.titlebar-spacer[type='pre-tabs'],
@@ -219,15 +232,7 @@
}
/* Mark: toolbox as expanded */
- #navigator-toolbox:is(
- #navigator-toolbox[zen-user-hover='true'][zen-has-hover],
- #navigator-toolbox[zen-user-hover='true']:focus-within,
- #navigator-toolbox[zen-user-hover='true'][movingtab],
- #navigator-toolbox[zen-user-hover='true'][flash-popup],
- #navigator-toolbox[zen-user-hover='true'][has-popup-menu],
- #navigator-toolbox[zen-user-hover='true']:has(*[open='true']:not(tab):not(.zen-compact-mode-ignore)),
- #navigator-toolbox[zen-expanded='true']:not([zen-user-hover='true'])
- ) {
+ #navigator-toolbox {
--zen-toolbox-min-width: fit-content;
--tab-icon-end-margin: 8.5px;
padding: var(--zen-toolbox-padding);
@@ -242,11 +247,16 @@
margin-inline: var(--tab-block-margin);
}
- & #zen-sidebar-top-buttons {
+ & #zen-sidebar-top-buttons,
+ & #nav-bar {
padding: var(--zen-element-separation);
margin-top: var(--zen-element-separation);
}
+ & #nav-bar {
+ margin-top: 0;
+ }
+
& #zen-workspaces-button[as-button='true'] {
width: calc(100% - 10px) !important;
}
@@ -378,198 +388,6 @@
}
}
- /* Mark: toolbox as collapsed */
- #navigator-toolbox:not(
- #navigator-toolbox:is(
- #navigator-toolbox[zen-user-hover='true'][zen-has-hover],
- #navigator-toolbox[zen-user-hover='true']:focus-within,
- #navigator-toolbox[zen-user-hover='true'][movingtab],
- #navigator-toolbox[zen-user-hover='true'][flash-popup],
- #navigator-toolbox[zen-user-hover='true'][has-popup-menu],
- #navigator-toolbox[zen-user-hover='true']:has(*[open='true']:not(tab):not(.zen-compact-mode-ignore)),
- #navigator-toolbox[zen-expanded='true']:not([zen-user-hover='true'])
- )
- ) {
- --tab-min-width: 36px !important;
-
- /* Important: When changin this value, make sure expand on hover doesn't break! */
- --zen-toolbox-padding: calc(var(--zen-element-separation) / 2 + 1px);
- --zen-toolbox-max-width: calc(var(--tab-min-width) + var(--zen-toolbox-padding) * 2);
- max-width: var(--zen-toolbox-max-width) !important;
- min-width: var(--zen-toolbox-max-width) !important;
-
- --zen-tabbar-offset: 1px; /* Fix the tabbar offset, because there's a shadow */
- &[zen-right-side='true'] {
- margin-left: var(--zen-tabbar-offset);
- }
-
- &:not([zen-right-side='true']) {
- margin-right: var(--zen-tabbar-offset);
- }
-
- & #zen-current-workspace-indicator-name {
- display: none;
- }
-
- & #TabsToolbar {
- padding-top: var(--zen-element-separation);
- }
-
- & #zen-current-workspace-indicator {
- padding-left: 0;
- padding-right: 0;
- display: flex;
- align-items: center;
- justify-content: center;
- opacity: .4;
- }
-
- & #zen-essentials-container {
- justify-content: center;
- }
-
- & #vertical-tabs-newtab-button {
- padding: 0 !important;
- background: transparent !important;
- }
-
- :root[customizing] & #zen-sidebar-icons-wrapper {
- min-width: unset !important;
- }
-
- & #zen-sidebar-icons-wrapper {
- display: flex;
- flex-direction: column;
- padding-top: var(--zen-element-separation);
- align-items: center;
- }
-
- :root:has(&) #zen-sidebar-splitter {
- display: none !important;
- }
-
- & #tabbrowser-arrowscrollbox-periphery {
- & > toolbarbutton {
- margin: 0 auto !important;
- padding: 0 !important;
- }
-
- &::before {
- width: 90% !important;
- }
- }
-
- & #EssentialsToolbar {
- display: none !important;
- }
-
- & #essentials-accordion-header {
- display: none !important;
- }
-
- & #vertical-pinned-tabs-container:has(tab:not([hidden])) {
- position: relative;
-
- & .tabbrowser-tab {
- max-width: var(--tab-min-width);
- }
- }
-
- & #TabsToolbar-customization-target {
- padding-bottom: var(--zen-toolbox-padding);
-
- &::after {
- bottom: -1px !important;
- }
- }
-
- & #tabbrowser-tabs {
- margin-top: -2px;
-
- & .tabbrowser-tab {
- margin: 0 auto;
-
- & .tab-background {
- margin-inline: auto !important;
-
- &:is([selected], [multiselected]) {
- box-shadow: 0 0 1px 1px rgba(0,0,0,.1);
-
- @media not (prefers-color-scheme: dark) {
- box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.12) !important;
- }
- }
- }
-
- & .tab-reset-button {
- display: none !important;
- }
-
- & .tab-content {
- display: flex;
- align-content: center;
- justify-content: center;
- padding: 0 !important;
-
- & .tab-label-container {
- display: none !important;
- }
-
- & .tab-icon-image,
- & .tab-icon-pending {
- margin-inline-end: 0 !important;
- }
-
- /* Hide glances */
- & .tabbrowser-tab {
- display: none !important;
- }
- }
- }
-
- @media (-moz-bool-pref: 'zen.view.sidebar-collapsed.hide-mute-button') {
- & .tab-icon-overlay:is([soundplaying], [muted]):not([selected]) {
- display: none !important;
-
- :is(
- :root[uidensity='compact'],
- #tabbrowser-tabs[secondarytext-unsupported],
- :root:not([uidensity='compact']) #tabbrowser-tabs:not([secondarytext-unsupported]) .tabbrowser-tab:hover
- )
- .tab-icon-stack[indicator-replaces-favicon]
- > :not(&),
- :root:not([uidensity='compact'])
- #tabbrowser-tabs:not([secondarytext-unsupported])
- .tabbrowser-tab:not(:hover)
- &[indicator-replaces-favicon] {
- opacity: 1 !important;
- }
- }
- }
-
- & .tab-throbber,
- & .tab-icon-pending,
- & .tab-icon-image,
- & .tab-sharing-icon-overlay,
- & .tab-icon-overlay {
- margin-inline-end: 0 !important;
- }
- }
-
- & #zen-workspaces-button {
- flex-direction: column;
-
- &:not([as-button='true']) {
- & toolbarbutton {
- &[active='true']::after {
- bottom: 50% !important;
- transform: translateY(50%) !important;
- }
- }
- }
- }
- }
-
/* Mark: Separator styling */
#zen-sidebar-splitter {
opacity: 0;
@@ -577,91 +395,6 @@
height: 100%;
}
- /* Mark: Expand on hover */
- @media (-moz-bool-pref: 'zen.view.sidebar-expanded.on-hover') and (not ((-moz-bool-pref: 'zen.view.compact') and (-moz-bool-pref: 'zen.view.compact.hide-tabbar'))) {
- #zen-sidebar-splitter {
- display: none !important;
- }
-
- #navigator-toolbox {
- z-index: 1;
- }
-
- #TabsToolbar {
- z-index: 1;
- background-repeat: no-repeat !important;
- background-position: center center !important;
- background-size: cover !important;
-
- border-top: 1px solid transparent;
-
- height: 100%;
-
- border-top-right-radius: var(--zen-border-radius);
- width: var(--zen-toolbox-max-width);
-
- & .tabbrowser-tab {
- transition: 0s !important;
- }
- }
-
- #navigator-toolbox[zen-has-hover],
- #navigator-toolbox:focus-within,
- #navigator-toolbox[movingtab],
- #navigator-toolbox[flash-popup],
- #navigator-toolbox[has-popup-menu],
- #navigator-toolbox:has(.tabbrowser-tab:active),
- #navigator-toolbox:has(*[open='true']:not(tab):not(.zen-compact-mode-ignore)) {
- --zen-toolbox-max-width: 45px;
- max-width: var(--zen-toolbox-max-width) !important;
- min-width: var(--zen-toolbox-max-width) !important;
- padding: 0 !important;
-
- & #TabsToolbar {
- z-index: 100 !important;
- width: 250px !important;
-
- background: var(--zen-main-browser-background-toolbar) !important;
- background-attachment: fixed !important;
- background-size: 2000px !important; /* Dont ask me why */
-
- box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.2);
-
- position: absolute;
- padding: var(--zen-toolbox-padding);
- transition: 0 !important;
- /*animation: zen-vtabs-animation 0.3s ease-in-out;*/
- -moz-window-dragging: no-drag;
- overflow: hidden;
- transition: width 0.2s !important;
-
- & .tab-throbber,
- & .tab-icon-pending,
- & .tab-icon-image,
- & .tab-sharing-icon-overlay,
- & .tab-icon-overlay {
- transition: 0.1s !important;
- }
- }
-
- &[zen-right-side='true'] #TabsToolbar {
- right: 0;
- border-top-left-radius: var(--zen-border-radius);
- border-top-right-radius: 0;
- }
-
- #navigator-toolbox:not(&)
- #TabsToolbar
- #tabbrowser-tabs[closebuttons='activetab']
- .tabbrowser-tab
- .tab-content[class]
- > .tab-close-button[class] {
- display: none !important;
- visibility: hidden !important;
- }
- }
- }
-
/* Mark: Move sidebar to the right */
#browser:has(#navigator-toolbox[zen-right-side='true']) {
& #navigator-toolbox {
diff --git a/src/browser/base/content/zen-styles/zen-workspaces.css b/src/browser/base/content/zen-styles/zen-workspaces.css
index 2c91c6dd..ca7879c8 100644
--- a/src/browser/base/content/zen-styles/zen-workspaces.css
+++ b/src/browser/base/content/zen-styles/zen-workspaces.css
@@ -108,46 +108,37 @@
font-size: 13px;
}
-@media (-moz-bool-pref: 'zen.view.sidebar-expanded') {
- /** Keep these selectors in sync with the ones in vertical-tabs.css */
- #navigator-toolbox:is(
- #navigator-toolbox[zen-user-hover='true'][zen-has-hover],
- #navigator-toolbox[zen-user-hover='true'][has-popup-menu],
- #navigator-toolbox[zen-user-hover='true']:focus-within,
- #mainPopupSet[zen-user-hover='true']:has(> #appMenu-popup:hover) ~ toolbox,
- #navigator-toolbox[zen-user-hover='true']:has(*[open='true']:not(tab):not(#zen-sidepanel-button)),
- :not([zen-user-hover='true'])
- ) {
- & #zen-workspaces-button[as-button='true'] {
- width: calc(100% - var(--toolbarbutton-outer-padding));
- margin: 2px;
- min-width: calc(2 * var(--toolbarbutton-inner-padding) + 16px);
- height: calc(2 * var(--toolbarbutton-inner-padding) + 16px);
- }
+/** Keep these selectors in sync with the ones in vertical-tabs.css */
+#navigator-toolbox {
+ & #zen-workspaces-button[as-button='true'] {
+ width: calc(100% - var(--toolbarbutton-outer-padding));
+ margin: 2px;
+ min-width: calc(2 * var(--toolbarbutton-inner-padding) + 16px);
+ height: calc(2 * var(--toolbarbutton-inner-padding) + 16px);
+ }
- & #zen-workspaces-button .zen-workspace-sidebar-name {
- display: block;
- }
+ & #zen-workspaces-button .zen-workspace-sidebar-name {
+ display: block;
+ }
- & #zen-workspaces-button .zen-workspace-sidebar-icon {
- margin-inline-end: 5px;
+ & #zen-workspaces-button .zen-workspace-sidebar-icon {
+ margin-inline-end: 5px;
- & [no-icon='true'] {
- display: none;
- }
+ & [no-icon='true'] {
+ display: none;
}
+ }
- & #zen-workspaces-button .zen-workspace-sidebar-icon[no-icon='true'] + .zen-workspace-sidebar-name {
- margin-left: 0;
- }
+ & #zen-workspaces-button .zen-workspace-sidebar-icon[no-icon='true'] + .zen-workspace-sidebar-name {
+ margin-left: 0;
+ }
- & #zen-workspaces-button {
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
- display: flex;
- gap: 0.5ch;
- }
+ & #zen-workspaces-button {
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ display: flex;
+ gap: 0.5ch;
}
}
diff --git a/src/browser/components/customizableui/CustomizableUI-sys-mjs.patch b/src/browser/components/customizableui/CustomizableUI-sys-mjs.patch
index 4d5f2014..80ac9439 100644
--- a/src/browser/components/customizableui/CustomizableUI-sys-mjs.patch
+++ b/src/browser/components/customizableui/CustomizableUI-sys-mjs.patch
@@ -1,5 +1,5 @@
diff --git a/browser/components/customizableui/CustomizableUI.sys.mjs b/browser/components/customizableui/CustomizableUI.sys.mjs
-index 989e69245aeb1185125752db6b9c58e462d554e4..a4825653b48aa5012e58a277c862caaf0e37abab 100644
+index 989e69245aeb1185125752db6b9c58e462d554e4..7f03aa20386ace32a340131a84c484865883905f 100644
--- a/browser/components/customizableui/CustomizableUI.sys.mjs
+++ b/browser/components/customizableui/CustomizableUI.sys.mjs
@@ -13,6 +13,7 @@ ChromeUtils.defineESModuleGetters(lazy, {
@@ -78,13 +78,11 @@ index 989e69245aeb1185125752db6b9c58e462d554e4..a4825653b48aa5012e58a277c862caaf
// For toolbars that need it, mark as dirty.
let defaultPlacements = areaProperties.get("defaultPlacements");
if (
-@@ -3521,6 +3527,9 @@ var CustomizableUIInternal = {
- gSeenWidgets.add(widgetId);
- }
- }
-+
-+
-+
- if (gSeenWidgets.size || gNewElementCount) {
- gDirty = true;
- this.saveState();
+@@ -3603,6 +3609,7 @@ var CustomizableUIInternal = {
+ if (area.get("type") == CustomizableUI.TYPE_TOOLBAR) {
+ let defaultCollapsed = area.get("defaultCollapsed");
+ let win = areaNode.ownerGlobal;
++ win.gZenVerticalTabsManager._updateEvent();
+ if (defaultCollapsed !== null) {
+ win.setToolbarVisibility(
+ areaNode,
diff --git a/src/browser/components/preferences/zen-settings.js b/src/browser/components/preferences/zen-settings.js
index 76cffa4a..159769be 100644
--- a/src/browser/components/preferences/zen-settings.js
+++ b/src/browser/components/preferences/zen-settings.js
@@ -563,17 +563,11 @@ var gZenLooksAndFeel = {
value = Services.prefs.getBoolPref('zen.view.compact.hide-tabbar') ? 'left' : 'top';
}
chooser.querySelector(`[value='${value}']`).checked = true;
- const disableExpandTabsOnHover = () => {
- if (Services.prefs.getBoolPref('zen.view.sidebar-expanded.on-hover')) {
- document.querySelector(`#zen-expand-tabbar-strat input[value='expand']`).click();
- }
- };
for (let radio of radios) {
radio.addEventListener('change', (e) => {
let value = e.target.value;
switch (value) {
case 'left':
- disableExpandTabsOnHover();
Services.prefs.setBoolPref('zen.view.compact.hide-tabbar', true);
Services.prefs.setBoolPref('zen.view.compact.hide-toolbar', false);
break;
@@ -582,7 +576,6 @@ var gZenLooksAndFeel = {
Services.prefs.setBoolPref('zen.view.compact.hide-toolbar', true);
break;
default:
- disableExpandTabsOnHover();
Services.prefs.setBoolPref('zen.view.compact.hide-tabbar', true);
Services.prefs.setBoolPref('zen.view.compact.hide-toolbar', true);
break;
@@ -591,47 +584,6 @@ var gZenLooksAndFeel = {
}
},
- _initializeTabbarExpandForm() {
- const form = document.getElementById('zen-expand-tabbar-strat');
- const radios = form.querySelectorAll('input[type=radio]');
- const onHoverPref = 'zen.view.sidebar-expanded.on-hover';
- const defaultExpandPref = 'zen.view.sidebar-expanded';
- if (Services.prefs.getBoolPref(onHoverPref)) {
- form.querySelector('input[value="hover"]').checked = true;
- } else if (Services.prefs.getBoolPref(defaultExpandPref)) {
- form.querySelector('input[value="expand"]').checked = true;
- } else {
- form.querySelector('input[value="none"]').checked = true;
- }
- const disableCompactTabbar = () => {
- const toolbarEnable = Services.prefs.getBoolPref('zen.view.compact.hide-toolbar');
- if (toolbarEnable) {
- document.querySelector(`#ZenCompactModeStyle input[value='top']`).click();
- } else if (Services.prefs.getBoolPref('zen.view.compact')) {
- document.getElementById('zenLooksAndFeelShowCompactView').click();
- }
- };
- for (let radio of radios) {
- radio.addEventListener('change', (e) => {
- switch (e.target.value) {
- case 'expand':
- Services.prefs.setBoolPref(onHoverPref, false);
- Services.prefs.setBoolPref(defaultExpandPref, true);
- break;
- case 'none':
- Services.prefs.setBoolPref(onHoverPref, false);
- Services.prefs.setBoolPref(defaultExpandPref, false);
- break;
- case 'hover':
- disableCompactTabbar();
- Services.prefs.setBoolPref(onHoverPref, true);
- Services.prefs.setBoolPref(defaultExpandPref, false);
- break;
- }
- });
- }
- },
-
_initializeColorPicker(accentColor) {
let elem = document.getElementById('zenLooksAndFeelColorOptions');
elem.innerHTML = '';
@@ -1000,11 +952,6 @@ Preferences.addAll([
type: 'bool',
default: true,
},
- {
- id: 'zen.view.sidebar-expanded',
- type: 'bool',
- default: true,
- },
{
id: 'zen.theme.pill-button',
type: 'bool',
diff --git a/src/browser/components/preferences/zenLooksAndFeel.inc.xhtml b/src/browser/components/preferences/zenLooksAndFeel.inc.xhtml
index fc5f4b80..d60d96d9 100644
--- a/src/browser/components/preferences/zenLooksAndFeel.inc.xhtml
+++ b/src/browser/components/preferences/zenLooksAndFeel.inc.xhtml
@@ -337,23 +337,6 @@
data-l10n-id="zen-vertical-tabs-show-bottom-border"
preference="zen.view.show-bottom-border"/>
-
-
-
-
diff --git a/src/browser/themes/shared/tabbrowser/tabs-css.patch b/src/browser/themes/shared/tabbrowser/tabs-css.patch
index 17264881..31c642ca 100644
--- a/src/browser/themes/shared/tabbrowser/tabs-css.patch
+++ b/src/browser/themes/shared/tabbrowser/tabs-css.patch
@@ -1,5 +1,5 @@
diff --git a/browser/themes/shared/tabbrowser/tabs.css b/browser/themes/shared/tabbrowser/tabs.css
-index d48aad3a397909056ee43be4e65797875e80b772..89d2b381153d137ccfd080844bdb9abbbd90e1d5 100644
+index d48aad3a397909056ee43be4e65797875e80b772..d9728867a69a935caf2176d492a7aa78dcee7424 100644
--- a/browser/themes/shared/tabbrowser/tabs.css
+++ b/browser/themes/shared/tabbrowser/tabs.css
@@ -26,7 +26,7 @@
@@ -40,6 +40,15 @@ index d48aad3a397909056ee43be4e65797875e80b772..89d2b381153d137ccfd080844bdb9abb
direction: rtl;
mask-image: linear-gradient(to right, transparent, black var(--tab-label-mask-size));
}
+@@ -863,7 +862,7 @@ tab-group {
+ margin-inline: var(--tab-inner-inline-margin);
+
+ #tabbrowser-tabs[orient="vertical"]:not([expanded]) & > .toolbarbutton-text {
+- display: none;
++ display: flex;
+ }
+
+ &:hover {
@@ -1052,7 +1051,7 @@ tab-group {
toolbarbutton:not(#firefox-view-button),
toolbarpaletteitem:not(#wrapper-firefox-view-button)