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

Add zen-compact-mode-ignore class to sidebar button for improved styling in compact mode

Browse Source
This commit is contained in:
mr. M
2024-11-10 18:25:09 +01:00
parent 1c7c6b2a0f
commit 33ac29f269
3 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -46,7 +46,7 @@ export var ZenCustomizableUI = new (class {
mode="icons">
<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" 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>
</toolbar>
`);

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

@@ -90,7 +90,7 @@
#navigator-toolbox[movingtab],
#mainPopupSet:has(> #appMenu-popup:hover) ~ toolbox,
#navigator-toolbox:has(.tabbrowser-tab:active),
#navigator-toolbox:has(*[open='true']:not(tab):not(#zen-sidepanel-button)) {
#navigator-toolbox:has(*[open='true']:not(tab):not(.zen-compact-mode-ignore)) {
opacity: 1;
transform: translateX(calc(100% - var(--zen-element-separation)));

6
src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css
View File

@@ -211,7 +211,7 @@
#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-sidepanel-button)),
#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'])
) {
--zen-toolbox-min-width: fit-content;
@@ -377,7 +377,7 @@
#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-sidepanel-button)),
#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'])
)
) {
@@ -607,7 +607,7 @@
#navigator-toolbox[flash-popup],
#navigator-toolbox[has-popup-menu],
#navigator-toolbox:has(.tabbrowser-tab:active),
#navigator-toolbox:has(*[open='true']:not(tab):not(#zen-sidepanel-button)) {
#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;