feat: add dismiss (×) button to all toast notifications (#1355) (#1755)

* feat: add dismiss (×) button to all toast notifications (#1355)

* Refresh README presentation

* fix: reset pointer-events on toast dismiss button click

Action toasts set pointer-events:auto on #toast for their clickable
button, but the × close-button handler only cleared the auto-hide timer
without resetting pointer-events. This left an invisible fixed overlay
blocking clicks in the top-right area after manual dismissal.

- Add pointerEvents reset in both showToast and showError close handlers
- Add DOM behavior tests for pointer-events across all toast types

---------

Co-authored-by: pewdiepie-archdaemon <pewdiepie-archdaemon@users.noreply.github.com>
This commit is contained in:
Rishi Sharma
2026-06-26 18:32:35 +05:30
committed by GitHub
parent a5b60a34ee
commit 6ee51b6b10
4 changed files with 230 additions and 32 deletions
+25
View File
@@ -4062,6 +4062,31 @@ body.bg-pattern-sparkles {
@keyframes toastCheckDraw {
to { stroke-dashoffset: 0; }
}
.toast-close-btn {
margin-left: 8px;
padding: 0;
width: 22px;
height: 22px;
line-height: 1;
border: none;
background: none;
color: var(--fg);
opacity: 0.5;
cursor: pointer;
font-size: 16px;
border-radius: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
pointer-events: auto;
flex-shrink: 0;
transition: transform 0.22s ease, opacity 0.15s ease, background 0.15s ease;
}
.toast-close-btn:hover {
opacity: 1;
transform: rotate(90deg);
background: color-mix(in srgb, var(--fg) 8%, transparent);
}
.toast.exiting {
opacity: 0;
transform: translateX(-120%);