meshkee-app/dashboards
1
0
Fork 0
mirror of https://git.meshkee.com/Meshkee/dashboards.git synced 2026-08-11 22:30:58 +04:30
Code Issues Packages Projects Releases Wiki Activity

Fix modal backdrop blur by applying filter on the overlay itself.

Browse Source 
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Alireza Hassani
2026-08-08 18:21:43 +03:30
co-authored by Cursor
parent e6670ed06f
commit 656fc57494
14 changed files with 33 additions and 164 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/customer/src/components/VariationsModal.module.css
+3 -15
View File
@@ -1,8 +1,9 @@
.overlay {
position: fixed;
inset: 0;
isolation: isolate;
background: transparent;
background: var(--modal-overlay-bg);
backdrop-filter: blur(var(--modal-overlay-blur));
-webkit-backdrop-filter: blur(var(--modal-overlay-blur));
display: flex;
align-items: center;
justify-content: center;
@@ -10,19 +11,6 @@
padding: 20px;
}
/* Tint + blur on ::before so opacity animations on .overlay cannot disable backdrop-filter. */
.overlay::before {
content: '';
position: absolute;
inset: 0;
z-index: -1;
pointer-events: none;
background: var(--modal-overlay-bg);
backdrop-filter: blur(var(--modal-overlay-blur));
-webkit-backdrop-filter: blur(var(--modal-overlay-blur));
}
.overlayNested {
z-index: 210;
}