mirrors/desktop
1
0
Fork 0
mirror of https://github.com/zen-browser/desktop.git synced 2026-04-19 22:10:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

Made compact mode float

Browse Source
This commit is contained in:
mauro-balades
2024-10-09 20:01:51 +02:00
parent cc4e676bb7
commit 9440716951
4 changed files with 19 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/browser/base/content/zen-components

Submodule src/browser/base/content/zen-components updated: 2b163c397c...43ed740d69

1
src/browser/base/content/zen-styles/zen-animations.css
View File

@@ -76,6 +76,7 @@
100% {
transform: translateX(0);
opacity: 1;
}
}

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

@@ -1,7 +1,7 @@
/* All overrides for compact mode go here */
@media (-moz-bool-pref: 'zen.view.compact') {
:root:not([customizing]) {
:root:not([customizing]):not([inDOMFullscreen='true']) {
@media (-moz-bool-pref: 'zen.view.compact.hide-tabbar') {
#zen-sidebar-web-panel-wrapper:has(#zen-sidebar-web-panel[pinned='true']) {
margin-left: calc(var(--zen-sidebar-web-panel-spacing) * 2) !important;
@@ -29,32 +29,22 @@
#navigator-toolbox {
--zen-toolbox-max-width: 54px !important;
position: absolute;
height: calc(98% - var(--zen-element-separation));
height: calc(100% - var(--zen-element-separation) * 2);
z-index: 9;
background: var(--zen-themed-toolbar-bg) !important;
box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.1);
border-top-right-radius: var(--zen-border-radius);
border-bottom-right-radius: var(--zen-border-radius);
border-radius: calc(var(--zen-border-radius) + 2px);
border: 1px solid var(--zen-colors-border);
border-left-width: 0;
padding: var(--zen-toolbox-padding) !important;
transition: all 0.2s ease-in-out;
right: calc(100% - var(--zen-element-separation) + 1px);
top: 1%;
transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
right: calc(100% - var(--zen-element-separation) - 2px);
top: var(--zen-element-separation);
opacity: 0;
#browser:has(#navigator-toolbox[zen-right-side='true']) & {
border-left-width: 1px;
border-right-width: 0;
left: calc(100% - var(--zen-element-separation) - 1px);
left: calc(100% - var(--zen-element-separation) + 2px);
right: unset;
border-top-left-radius: var(--zen-border-radius);
border-bottom-left-radius: var(--zen-border-radius);
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
}
@@ -70,9 +60,9 @@
#navigator-toolbox:has(*[open='true']:not(tab):not(#zen-sidepanel-button)) {
opacity: 1;
transform: translateX(calc(100% - var(--zen-element-separation)));
transform: translateX(100%);
#browser:has(#navigator-toolbox[zen-right-side='true']) & {
transform: translateX(calc(-100% + var(--zen-element-separation) + 1px));
transform: translateX(-100%);
}
}
}
@@ -87,10 +77,14 @@
}
#sidebar-box,
#zen-sidebar-web-panel-wrapper {
#zen-sidebar-web-panel-wrapper:has(#zen-sidebar-web-panel:not([pinned='true'])) {
margin-top: var(--zen-element-separation) !important;
}
#zen-sidebar-web-panel-wrapper:has(#zen-sidebar-web-panel[pinned='true']) {
margin-top: calc(var(--zen-element-separation) * 2) !important;
}
#zen-appcontent-navbar-container {
position: absolute;
top: 0;
@@ -103,7 +97,7 @@
border-bottom-right-radius: var(--zen-border-radius);
border: 1px solid var(--zen-colors-border);
border-top-width: 0px;
transition: all 0.2s ease-in-out;
transition: all 0.1s ease-in-out;
width: 100%;
opacity: 0;

4
src/browser/base/content/zen-styles/zen-sidebar-panels.css
View File

@@ -77,7 +77,7 @@
* + 1 for the margin we want to add at the bottom
* + 1 so that the panel can be correctly spaced from the border of the webview
*/
height: calc(100% - var(--zen-sidebar-web-panel-spacing) * 3);
height: calc(100% - var(--zen-sidebar-web-panel-spacing) * 4);
}
#zen-sidebar-web-panel {
@@ -150,7 +150,7 @@
}
#zen-sidebar-web-panel-wrapper {
margin: 0 var(--zen-element-separation) var(--zen-element-separation) 1px;
margin: 0 calc(var(--zen-element-separation) / 2) var(--zen-element-separation) var(--zen-element-separation);
}
#zen-sidebar-web-panel[pinned='true'] {