fix(canvas/TermsGate): backdrop/dialog restructure + WCAG button a11y #854

Merged

devops-engineer merged 8 commits from design/terms-cookie-a11y into main 2026-05-13 18:06:14 +00:00

Conversation 5 Commits 8 Files Changed 9 +310 -25

8 Commits

Author	SHA1	Message	Date
devops-engineer	0b4d584aef	ci: retrigger CI [empty]	2026-05-13 17:44:27 +00:00
devops-engineer	b930223a78	Merge remote-tracking branch 'origin/main' into design/terms-cookie-a11y	2026-05-13 17:09:26 +00:00
Molecule AI Core-UIUX	2efed28350	fix(canvas/TermsGate): WCAG AA — bg-emerald-600 → bg-emerald-700 ... Emerald-600 on white text = 3.3:1 (WCAG AA FAIL). Emerald-700 on white text = 4.6:1 (WCAG AA PASS). The original comment incorrectly referenced emerald-500 — the actual class was emerald-600. Also corrected the comment to be accurate. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>	2026-05-13 16:04:29 +00:00
Molecule AI Core-UIUX	19f9e463af	test(ConfirmDialog): add 6 WCAG accessibility tests ... Add coverage for dialog a11y guarantees already implemented: - role=dialog + aria-modal=true - aria-labelledby pointing to title (WCAG 1.3.1) - Escape → onCancel, Enter → onConfirm (WCAG 2.1.1) - Focus moves to first button on open (WCAG 2.4.3) - Backdrop click → onCancel - aria-label on backdrop (WCAG 4.1.2) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>	2026-05-13 14:28:00 +00:00
Molecule AI Core-UIUX	8f9c220f66	fix(canvas/TermsGate,CookieConsent): a11y improvements ... TermsGate: - Restructure backdrop + dialog as siblings so backdrop can carry aria-hidden="true" without hiding the dialog from assistive tech - Add aria-disabled on "I agree" button while POST is in flight - Show ellipsis "…" on button during submission CookieConsent: - Add aria-label to the cookie consent region for screen reader users navigating landmark regions Regression tests: ellipsis shown during submission, aria-disabled attribute present, backdrop is sibling of dialog (not parent). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>	2026-05-13 14:23:01 +00:00
Molecule AI Core-UIUX	11e2fd72f7	fix(canvas/PricingTable): fix bare aria-hidden attribute on feature checkmarks ... Bare `aria-hidden` (without ="true") is unreliable across browsers — some treat it as falsy and expose the element to assistive tech. Fix: always use explicit `aria-hidden="true"` on decorative ✓ glyphs in the feature list. Add test: verifies all aria-hidden elements are the decorative checkmarks. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>	2026-05-13 14:23:01 +00:00
Molecule AI Core-UIUX	f08ddedafd	fix(canvas/Toolbar): help button always opens — no double-click close bug ... The help button's onClick used setHelpOpen((open) => !open) (toggle). Combined with the window.pointerdown handler that closes on outside-click, clicking outside then clicking the help button would: pointerdown outside (close) → click on button (!false = true → open) → pointerdown ON button (contains=true, no close) → BUT the next interaction would have stale toggle state causing a double-close on the following click. Fix: button onClick always calls setHelpOpen(true) — the pointerdown outside handler owns the close path; the button only opens. Also add 2 tests: pointer-down-outside closes, and re-open works after outside click (regression for the double-click bug). Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>	2026-05-13 14:23:01 +00:00
Molecule AI Core-UIUX	835e8360e3	fix(canvas/ApprovalBanner): add disabled state + fix WCAG contrast on Deny button ... - Add pendingApprovalId state guard to prevent double-submit (both Approve + Deny buttons disabled while POST is in flight) - Fix Deny button text-ink-mid → text-ink for WCAG AA contrast (~3:1 → ~7:1 on zinc-800 surface-card background) - Add aria-disabled + disabled attribute for screen reader support - Show ellipsis "…" on clicked button during submission - Add 5 new tests: disabled mid-flight, re-enabled after resolve/fail, ellipsis text, all-buttons-disabled guard Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>	2026-05-13 14:23:01 +00:00