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

gh-12104: Fix notification tabs overlap (gh-12965)

Browse Source 
Co-authored-by: mr. m <mr.m@tuta.com>
This commit is contained in:
Rugved_018
2026-03-29 19:14:03 +05:30
committed by GitHub
parent ec2864902c
commit 8fec3702f4
3 changed files with 39 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/zen/common/modules/ZenStartup.mjs
View File

@@ -46,14 +46,13 @@ class ZenStartup {
}
newContainer.appendChild(node);
}
// Fix notification deck
const deckTemplate = document.getElementById(
"tab-notification-deck-template"
);
if (deckTemplate) {
document.getElementById("zen-appcontent-wrapper").prepend(deckTemplate);
}
const deckTemplate =
document.getElementById("tab-notification-deck-template") ||
document.getElementById("tab-notification-deck");
// overlap and interaction issues with vertical tabs
document.getElementById("browser").prepend(deckTemplate);
gZenWorkspaces.init();
setTimeout(() => {

26
src/zen/common/styles/zen-omnibox.css
View File

@@ -404,32 +404,6 @@
min-width: 26px;
}
/* Notification Stack */
.notificationbox-stack {
background: transparent;
&[notificationside="top"] {
position: fixed;
bottom: calc(var(--zen-element-separation) * 1.5);
right: calc(var(--zen-element-separation) * 1.5);
width: fit-content;
max-width: 30rem !important;
z-index: 9999;
& notification-message {
background: color-mix(in srgb, var(--zen-colors-tertiary) 70%, transparent 30%);
backdrop-filter: blur(10px);
border: 1px solid var(--arrowpanel-border-color);
border-radius: var(--zen-border-radius);
&::before {
display: none;
}
}
}
}
#nav-bar,
#zen-sidebar-top-buttons {
min-height: var(--zen-toolbar-height) !important;

33
src/zen/common/styles/zen-single-components.css
View File

@@ -650,3 +650,36 @@
gap: 4px;
}
}
/* Notification Stack */
.notificationbox-stack {
background: transparent;
&[notificationside="top"] {
position: fixed;
bottom: calc(var(--zen-element-separation) * 1.5);
right: calc(var(--zen-element-separation) * 1.5);
:root[zen-right-side="true"] & {
right: auto;
left: calc(var(--zen-element-separation) * 1.5);
}
width: fit-content;
max-width: 30rem !important;
z-index: 9999;
& notification-message {
background: color-mix(in srgb, var(--zen-colors-tertiary) 70%, transparent 30%);
backdrop-filter: blur(10px);
border: 1px solid var(--arrowpanel-border-color);
border-radius: var(--zen-border-radius);
&::before {
display: none;
}
}
}
}