sepehr/Keep
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: more aggressive CSS to prevent toasts from blocking UI

Browse Source 
Enhanced toast styling to ensure ALL elements in the toaster container
don't block page interaction, while keeping toast buttons clickable.

Added:
- pointer-events: none on all toaster children
- pointer-events: none on ::before and ::after pseudo-elements
- Only actual toast elements have pointer-events: auto

This should fix the issue where users had to refresh (F5) after any
toast notification to click buttons again.

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
sepehr 2026-01-12 23:34:46 +01:00
parent 3dd48e248c
commit 772dc77719
1 changed files with 11 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
keep-notes/app/globals.css
View File

@ -213,7 +213,18 @@
pointer-events: none !important; pointer-events: none !important;
} }
/* Ensure all children of toaster don't block except the toast itself */
[data-sonner-toaster] > * {
pointer-events: none !important;
}
/* But allow interaction with the toast itself (buttons, close, etc) */ /* But allow interaction with the toast itself (buttons, close, etc) */
[data-sonner-toast] { [data-sonner-toast] {
pointer-events: auto !important; pointer-events: auto !important;
} }
/* Also ensure any overlay or background doesn't block */
[data-sonner-toaster]::before,
[data-sonner-toaster]::after {
pointer-events: none !important;
}