diff --git a/CHANGELOG.md b/CHANGELOG.md index 11ccf0829f2..a510a2aea7b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,6 +3,9 @@ ## [Unreleased] +### Fixed +- **Invisible notification toast no longer permanently intercepts clicks in the top right.** The notification toast container (`.toast`) sat at `opacity: 0` when hidden, but retained `pointer-events: auto`. Its permanent padding created an invisible click-capturing box in the top right corner that blocked interaction with UI elements underneath it on mobile devices (like the profile action buttons). The base class is now `pointer-events: none` and the `.toast.show` class restores `pointer-events: auto`. + ## [v0.51.293] — 2026-06-06 — Release JI (stage-s5 — thinking card no longer renders twice) ### Fixed diff --git a/static/style.css b/static/style.css index 6d47aa1829d..6b18b068d4d 100644 --- a/static/style.css +++ b/static/style.css @@ -1288,8 +1288,8 @@ .app-dialog-btn.confirm.danger{border-color:var(--error);background:rgba(239,83,80,.12);color:var(--error);} .app-dialog-btn.confirm.danger:hover{background:rgba(239,83,80,.2);border-color:var(--error);} .app-dialog-btn:focus-visible,.app-dialog-close:focus-visible{outline:2px solid var(--accent);outline-offset:2px;} - .toast{pointer-events:auto;position:fixed;top:24px;right:24px;left:auto;bottom:auto;transform:translateY(-6px);display:flex;align-items:center;gap:10px;background:color-mix(in srgb,var(--accent) 14%,var(--surface));border:1px solid color-mix(in srgb,var(--accent) 45%,var(--surface));color:var(--accent-text);font-size:13px;font-weight:500;padding:10px 12px 10px 16px;border-radius:10px;opacity:0;transition:opacity .2s,transform .2s;z-index:100;box-shadow:0 6px 24px rgba(0,0,0,.12);letter-spacing:.01em;max-width:min(520px,calc(100vw - 48px));} - .toast.show{opacity:1;transform:translateY(0);} + .toast{pointer-events:none;position:fixed;top:24px;right:24px;left:auto;bottom:auto;transform:translateY(-6px);display:flex;align-items:center;gap:10px;background:color-mix(in srgb,var(--accent) 14%,var(--surface));border:1px solid color-mix(in srgb,var(--accent) 45%,var(--surface));color:var(--accent-text);font-size:13px;font-weight:500;padding:10px 12px 10px 16px;border-radius:10px;opacity:0;transition:opacity .2s,transform .2s;z-index:100;box-shadow:0 6px 24px rgba(0,0,0,.12);letter-spacing:.01em;max-width:min(520px,calc(100vw - 48px));} + .toast.show{opacity:1;transform:translateY(0);pointer-events:auto;} .toast.success{background:color-mix(in srgb,var(--success) 14%,var(--surface));border-color:color-mix(in srgb,var(--success) 45%,var(--surface));color:var(--success);} .toast.error{background:color-mix(in srgb,var(--error) 14%,var(--surface));border-color:color-mix(in srgb,var(--error) 45%,var(--surface));color:var(--error);} .toast-message{min-width:0;overflow-wrap:anywhere;white-space:pre-wrap;}