1
0
Fork 1
mirror of https://github.com/zen-browser/desktop.git synced 2025-07-10 09:05:30 +02:00

Refactor Zen UI components for improved toolbar button management and layout adjustments

This commit is contained in:
mr. M 2025-01-17 21:29:08 +01:00
parent 9fb04e4f7c
commit ee86bff81c
No known key found for this signature in database
GPG key ID: CBD57A2AEDBDA1FB
5 changed files with 7 additions and 13 deletions

View file

@ -11,7 +11,7 @@ export var ZenCustomizableUI = new (class {
'zen-sidebar-top-buttons', 'zen-sidebar-top-buttons',
{ {
type: this.TYPE_TOOLBAR, type: this.TYPE_TOOLBAR,
defaultPlacements: [], defaultPlacements: [''],
defaultCollapsed: null, defaultCollapsed: null,
}, },
true true
@ -47,8 +47,6 @@ 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 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>
</hbox> </hbox>
</toolbar> </toolbar>
`); `);

View file

@ -86,7 +86,7 @@
} }
// remove all styles except for the width, since we are xulstoring the complet style list // remove all styles except for the width, since we are xulstoring the complet style list
const width = toolbox.style.width || '270px'; const width = toolbox.style.width || '180px';
toolbox.removeAttribute('style'); toolbox.removeAttribute('style');
toolbox.style.width = width; toolbox.style.width = width;

View file

@ -7,6 +7,9 @@
skipintoolbarset="true" skipintoolbarset="true"
context="toolbar-context-menu" context="toolbar-context-menu"
mode="icons"> mode="icons">
<toolbarbutton 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" id="zen-workspaces-button"></toolbarbutton>
<toolbarbutton id="zen-profile-button" <toolbarbutton id="zen-profile-button"
class="zen-sidebar-action-button toolbarbutton-1 chromeclass-toolbar-additional" class="zen-sidebar-action-button toolbarbutton-1 chromeclass-toolbar-additional"
delegatesanchor="true" delegatesanchor="true"
@ -22,4 +25,4 @@
<image id="zen-profile-button-icon" /> <image id="zen-profile-button-icon" />
</vbox> </vbox>
</toolbarbutton> </toolbarbutton>
</toolbar> </toolbar>

View file

@ -125,7 +125,7 @@
} }
:root[zen-single-toolbar='true'] { :root[zen-single-toolbar='true'] {
.urlbar-page-action:not(#star-button-box):not([open]), .urlbar-page-action:not([open]),
#tracking-protection-icon-container { #tracking-protection-icon-container {
margin-inline-end: calc(-16px - 2 * var(--urlbar-icon-padding)) !important; margin-inline-end: calc(-16px - 2 * var(--urlbar-icon-padding)) !important;
opacity: 0; opacity: 0;

View file

@ -1056,13 +1056,6 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
} }
let button = browser.document.getElementById('zen-workspaces-button'); let button = browser.document.getElementById('zen-workspaces-button');
if (!button) {
button = browser.document.createXULElement('toolbarbutton');
button.id = 'zen-workspaces-button';
let navbar = browser.document.getElementById('nav-bar');
navbar.appendChild(button);
}
while (button.firstChild) { while (button.firstChild) {
button.firstChild.remove(); button.firstChild.remove();
} }