Fixed right sidebar compact mode margin and worked more on the rewrite

This commit is contained in:
mr. M
2024-11-25 21:01:14 +01:00
parent 444c9138e0
commit 2ee8b3c111
9 changed files with 64 additions and 43 deletions

View File

@@ -212,8 +212,17 @@ var gZenVerticalTabsManager = {
const buttonsTarget = document.getElementById('zen-sidebar-top-buttons-customization-target');
if (isRightSide && isVerticalTabs) {
this.navigatorToolbox.setAttribute('zen-right-side', 'true');
document.documentElement.setAttribute('zen-right-side', 'true');
} else {
this.navigatorToolbox.removeAttribute('zen-right-side');
document.documentElement.removeAttribute('zen-right-side');
}
const appContentNavbarContaienr = document.getElementById('zen-appcontent-navbar-container');
if ((!isRightSide && this.isWindowsStyledButtons) || (isRightSide && !this.isWindowsStyledButtons)) {
appContentNavbarContaienr.setAttribute('should-hide', 'true');
} else {
appContentNavbarContaienr.removeAttribute('should-hide');
}
// Check if the sidebar is in hover mode
@@ -275,13 +284,6 @@ var gZenVerticalTabsManager = {
}
document.documentElement.removeAttribute("zen-single-toolbar");
navBar.appendChild(document.getElementById('PanelUI-button'));
if (!doNotChangeWindowButtons) {
if (this.isWindowsStyledButtons) {
navBar.append(windowButtons);
} else {
navBar.prepend(windowButtons);
}
}
this._toolbarOriginalParent.prepend(navBar);
CustomizableUI.zenInternalCU._rebuildRegisteredAreas();
}
@@ -294,6 +296,20 @@ var gZenVerticalTabsManager = {
if (doNotChangeWindowButtons) {
document.getElementById("zen-sidebar-top-buttons-customization-target").appendChild(windowButtons);
} else if (!isSingleToolbar && !isCompactMode) {
if (this.isWindowsStyledButtons) {
if (isRightSide) {
document.getElementById('zen-appcontent-navbar-container').append(windowButtons);
} else {
navBar.append(windowButtons);
}
} else {
if (isRightSide) {
document.getElementById('zen-appcontent-navbar-container').prepend(windowButtons);
} else {
navBar.prepend(windowButtons);
}
}
}
// Always move the splitter next to the sidebar

View File

@@ -26,7 +26,7 @@
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-tabs.css (content/zen-styles/zen-tabs.css)
content/browser/zen-styles/zen-tabs/vertical-tabs.css (content/zen-styles/zen-tabs/vertical-tabs.css)
* content/browser/zen-styles/zen-tabs/vertical-tabs.css (content/zen-styles/zen-tabs/vertical-tabs.css)
content/browser/zen-styles/zen-tabs/horizontal-tabs.css (content/zen-styles/zen-tabs/horizontal-tabs.css)
content/browser/zen-styles/zen-browser-ui.css (content/zen-styles/zen-browser-ui.css)
content/browser/zen-styles/zen-animations.css (content/zen-styles/zen-animations.css)

View File

@@ -9,7 +9,7 @@
overflow: hidden;
margin: 1px;
#browser:has(#navigator-toolbox[zen-right-side='true']) & {
:root[zen-right-side='true'] & {
margin-right: 0;
margin-left: var(--zen-element-separation);
}

View File

@@ -84,7 +84,7 @@
margin-top: 0;
}
& #browser:has(#navigator-toolbox[zen-right-side='true']) #zen-appcontent-wrapper {
&[zen-right-side='true'] #zen-appcontent-wrapper {
margin-right: 0;
}
}

View File

@@ -42,7 +42,7 @@
}
}
& #browser:has(#navigator-toolbox[zen-right-side='true']) {
&[zen-right-side='true'] {
& #navigator-toolbox {
--zen-compact-float: calc(var(--zen-element-separation) + 1px);
padding-left: unset !important;
@@ -91,7 +91,7 @@
opacity: 1;
transform: translateX(calc(100% - var(--zen-element-separation)));
#browser:has(#navigator-toolbox[zen-right-side='true']) & {
:root[zen-right-side='true'] & {
transform: translateX(calc(-100% + var(--zen-element-separation) + 1px));
}
}

View File

@@ -250,7 +250,7 @@
animation: better-sidebar-pinned-hide 0.15s ease-in-out forwards !important;
}
:root:has(#navigator-toolbox:not([zen-right-side='true'])) {
:root:not([zen-right-side='true']) {
#zen-sidebar-web-panel-wrapper:not(:has(#zen-sidebar-web-panel[pinned='true'])) {
margin-left: 0 !important;
}

View File

@@ -60,11 +60,11 @@
overflow: hidden;
border: 1px solid var(--zen-colors-border);
:root:has(#navigator-toolbox:not([zen-right-side='true'])) &[positionend='true'] {
:root:not([zen-right-side='true']) &[positionend='true'] {
margin-right: var(--zen-element-separation);
}
:root:has(#navigator-toolbox[zen-right-side='true']) & {
:root[zen-right-side='true'] & {
margin-left: var(--zen-element-separation);
}
}

View File

@@ -0,0 +1,23 @@
height: var(--zen-toolbar-height);
@media (-moz-bool-pref: 'zen.view.hide-window-controls') {
& {
transition: height 0.2s ease-out, opacity 0.2s ease-out;
transition-delay: 0.05s;
}
&:not([zen-has-hover='true']):not([has-popup-menu]):not(:focus-within) {
transition-delay: 0.2s;
height: var(--zen-element-separation);
overflow: hidden;
opacity: 0;
& > * {
pointer-events: none;
}
}
}
:root:not([zen-window-buttons-reversed='true']) & .titlebar-buttonbox-container {
margin-left: auto;
width: fit-content;
}

View File

@@ -119,11 +119,12 @@
display: none;
}
:root[zen-single-toolbar='true'] {
:root[zen-single-toolbar='true']:not([customizing]) {
#zen-appcontent-navbar-container {
display: flex;
-moz-window-dragging: drag;
min-height: var(--zen-element-separation);
height: var(--zen-element-separation);
& #PersonalToolbar {
width: -moz-available;
@@ -134,31 +135,12 @@
* - We are on a Linux with reversed CSD
* - If we are not in any of the above, we can still enable it if the user has bookmarks toolbar enabled
*/
:root:is(
[zen-window-buttons-reversed='true']:has(#TabsToolbar:not([collapsed='true'])),
:not([zen-window-buttons-reversed='false'])
):not([customizing]) & {
@media (-moz-bool-pref: 'zen.view.hide-window-controls') {
& {
transition: height 0.2s ease-out, opacity 0.2s ease-out;
transition-delay: 0.05s;
&:has(#PersonalToolbar[collapsed='false']) {
%include vertical-tabs-topbar.inc.css
}
&:not([zen-has-hover='true']):not([has-popup-menu]):not(:focus-within) {
transition-delay: 0.2s;
height: var(--zen-element-separation);
overflow: hidden;
opacity: 0;
& > * {
pointer-events: none;
}
}
}
& .titlebar-buttonbox-container {
margin-left: auto;
width: fit-content;
}
&[should-hide='true'] {
%include vertical-tabs-topbar.inc.css
}
:root[zen-window-buttons-reversed='true'] & {
@@ -355,7 +337,7 @@
padding-left: 2px;
}
#browser:has(#navigator-toolbox[zen-right-side='true']) & {
:root[zen-right-side='true'] & {
margin-left: 0;
margin-right: var(--zen-toolbox-padding);
@@ -516,7 +498,7 @@
}
/* Mark: Move sidebar to the right */
#browser:has(#navigator-toolbox[zen-right-side='true']) {
:root[zen-right-side='true'] {
& #navigator-toolbox {
order: 3 !important;
}
@@ -630,7 +612,7 @@
padding-inline-start: var(--toolbarbutton-outer-padding);
}
#browser:has(#navigator-toolbox[zen-right-side='true']) & {
:root[zen-right-side='true'] & {
padding-inline-start: 0;
padding-inline-end: var(--zen-toolbox-padding);
}