fix: update layout recalculation and improve CSS styles for Zen UI components

This commit is contained in:
mr. M
2025-04-01 23:38:08 +02:00
parent 40813820da
commit b6d1ad3418
7 changed files with 30 additions and 28 deletions

View File

@@ -58,7 +58,6 @@
closeWatermark() {
document.documentElement.removeAttribute('zen-before-loaded');
window.dispatchEvent(new window.Event('resize')); // To recalculate the layout
if (Services.prefs.getBoolPref('zen.watermark.enabled', false)) {
gZenUIManager.motion
.animate(
@@ -77,6 +76,9 @@
}
});
}
window.requestAnimationFrame(() => {
window.dispatchEvent(new window.Event('resize')); // To recalculate the layout
});
},
_changeSidebarLocation() {

View File

@@ -15,14 +15,11 @@
#zen-tabbox-wrapper {
/* Remove extra 1px of margine we have to add to the tabbox */
margin-left: 0 !important;
margin-right: 0 !important;
margin-left: var(--zen-element-separation) !important;
margin-right: var(--zen-element-separation) !important;
}
#zen-appcontent-wrapper {
margin-left: var(--zen-element-separation) !important;
margin-right: var(--zen-element-separation) !important;
& #tabbrowser-tabbox {
margin-left: 0 !important;
}
@@ -104,7 +101,8 @@
padding: var(--zen-toolbox-padding) !important;
position: relative;
background: var(--zen-dialog-background);
border: 1px solid var(--zen-colors-border-contrast);
outline: 1px solid var(--zen-colors-border-contrast);
outline-offset: -1px;
/* times 4 because we have the inner padding and the outter padding to consider */
:root[zen-sidebar-expanded='true'] & {
&[has-animated-padding='true'] {

View File

@@ -7,7 +7,7 @@ panel[type='arrow'][animate='open'] {
@media (-moz-platform: macos) {
animation: zen-jello-animation-macos 0.4s ease-out;
}
@media not(-moz-platform: macos) {
@media not (-moz-platform: macos) {
&::part(content) {
animation: zen-jello-animation 0.35s ease;
}

View File

@@ -32,21 +32,7 @@
--uc-permission-item-margin-block: 4px;
--uc-permission-item-padding-inline: 16px;
--uc-contextmenu-border-radius: 8px;
--uc-contextmenu-padding: calc(4px - var(--uc-contextmenu-menuitem-border-width)) 0;
--uc-contextmenu-menuitem-border-radius: calc(4px + var(--uc-contextmenu-menuitem-border-width));
--uc-contextmenu-menuitem-padding-block: 6px;
--uc-contextmenu-menuitem-padding-inline: 10px;
--uc-contextmenu-menuitem-border-width: 2px;
--uc-contextmenu-menuicon-margin-inline: 12px;
--uc-contextmenu-menuitem-margin-inline: calc(4px - var(--uc-contextmenu-menuitem-border-width));
--uc-contextmenu-menuitem-margin-block: 0px;
--uc-contextmenu-menuitem-margin: var(--uc-contextmenu-menuitem-margin-block) var(--uc-contextmenu-menuitem-margin-inline);
--uc-contextmenu-separator-vertical: calc(4px - var(--uc-contextmenu-menuitem-border-width));
--uc-contextmenu-separator-horizontal: 0;
--panel-separator-color: var(--zen-colors-border);
--zen-panel-separator-width: 1px;
}