mirror of
https://github.com/zen-browser/desktop.git
synced 2025-10-05 01:16:35 +00:00
Fixed right sidebar compact mode margin and worked more on the rewrite
This commit is contained in:
@@ -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
|
||||
|
@@ -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)
|
||||
|
@@ -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);
|
||||
}
|
||||
|
@@ -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;
|
||||
}
|
||||
}
|
||||
|
@@ -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));
|
||||
}
|
||||
}
|
||||
|
@@ -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;
|
||||
}
|
||||
|
@@ -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);
|
||||
}
|
||||
}
|
||||
|
@@ -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;
|
||||
}
|
@@ -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);
|
||||
}
|
||||
|
Reference in New Issue
Block a user