mirrors/desktop
1
0
Fork 0
mirror of https://github.com/zen-browser/desktop.git synced 2025-09-30 06:58:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add zen-expand-sidebar-button and adjust window button positioning; update transition properties and margin styles for improved layout

Browse Source
This commit is contained in:
mr. M
2024-11-28 02:04:14 +01:00
parent 99b2babad4
commit fb2241339d
4 changed files with 12 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/browser/base/content/ZenCustomizableUI.sys.mjs
View File

@@ -45,6 +45,7 @@ export var ZenCustomizableUI = new (class {
customizationtarget="zen-sidebar-top-buttons-customization-target" customizationtarget="zen-sidebar-top-buttons-customization-target"
mode="icons"> mode="icons">
<hbox id="zen-sidebar-top-buttons-customization-target" class="customization-target" flex="1"> <hbox id="zen-sidebar-top-buttons-customization-target" class="customization-target" flex="1">
<toolbarbutton hidden="true" removable="true" class="chromeclass-toolbar-additional toolbarbutton-1 zen-sidebar-action-button" id="zen-expand-sidebar-button" data-l10n-id="sidebar-zen-expand" cui-areatype="toolbar" oncommand="gZenVerticalTabsManager.toggleExpand();"></toolbarbutton>
<toolbarbutton removable="true" class="toolbarbutton-1 zen-sidebar-action-button zen-compact-mode-ignore" id="zen-sidepanel-button" data-l10n-id="sidebar-zen-sidepanel" onclick="gZenBrowserManagerSidebar.toggle();"></toolbarbutton> <toolbarbutton removable="true" class="toolbarbutton-1 zen-sidebar-action-button zen-compact-mode-ignore" id="zen-sidepanel-button" data-l10n-id="sidebar-zen-sidepanel" onclick="gZenBrowserManagerSidebar.toggle();"></toolbarbutton>
</hbox> </hbox>
</toolbar> </toolbar>

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

@@ -305,7 +305,7 @@ var gZenVerticalTabsManager = {
} }
} else { } else {
if (isRightSide) { if (isRightSide) {
document.getElementById('zen-appcontent-navbar-container').prepend(windowButtons); document.getElementById('zen-appcontent-navbar-container').appendChild(windowButtons);
} else { } else {
topButtons.prepend(windowButtons); topButtons.prepend(windowButtons);
} }

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

@@ -24,7 +24,7 @@
--zen-compact-float: calc(var(--zen-element-separation) - 1px); --zen-compact-float: calc(var(--zen-element-separation) - 1px);
position: absolute; position: absolute;
z-index: 10; z-index: 10;
transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out; transition: top 0.2s ease-in-out, opacity 0.2s ease-in-out;
right: calc(100% - var(--zen-element-separation)); right: calc(100% - var(--zen-element-separation));
top: 0; top: 0;
bottom: var(--zen-element-separation); bottom: var(--zen-element-separation);

11
src/browser/base/content/zen-styles/zen-decks.css
View File

@@ -27,7 +27,8 @@
#tabbrowser-tabpanels[zen-split-view='true'] > [zen-split='true'], #zen-splitview-dropzone { #tabbrowser-tabpanels[zen-split-view='true'] > [zen-split='true'], #zen-splitview-dropzone {
flex: 1; flex: 1;
margin: calc(var(--zen-split-column-gap) / 2) calc(var(--zen-split-row-gap) / 2 + 1px); margin: calc(var(--zen-split-column-gap) / 2) calc(var(--zen-split-row-gap) / 2 + 1px) !important;
margin-bottom: 0 !important;
position: absolute !important; position: absolute !important;
overflow: hidden; overflow: hidden;
} }
@@ -48,9 +49,15 @@
outline-offset: -1px; outline-offset: -1px;
} }
#tabbrowser-tabbox { #tabbrowser-tabbox:has(#tabbrowser-tabpanels[zen-split-view='true']) {
--zen-split-row-gap: calc(var(--zen-element-separation) + 1px); --zen-split-row-gap: calc(var(--zen-element-separation) + 1px);
--zen-split-column-gap: calc(var(--zen-element-separation) + 1px); --zen-split-column-gap: calc(var(--zen-element-separation) + 1px);
margin-right: calc(-1 * var(--zen-split-column-gap));
:root[zen-right-side='true'] & {
margin-right: 0;
margin-left: calc(-1 * var(--zen-split-column-gap));
}
} }
#tabbrowser-tabpanels:has(> [zen-split='true']), #zen-splitview-overlay { #tabbrowser-tabpanels:has(> [zen-split='true']), #zen-splitview-overlay {