Repository navigation
Contrast fixes found by axe on bubaly.com: every blog post, and white-on-danger text - #590
Merged
Merged
Conversation
… on danger An axe run (WCAG 2.2 AA; serious and critical findings only) over the public pages of www.bubaly.com found two defects. Every blog post, 1,049 pages: the dark article chrome used text-white/40, and text-white/30 for the photo credit, on #03090f. That is 3.73:1 and 2.57:1; small text needs 4.5:1. Affected: breadcrumb, "Written by", SHARE, prev/next dates, related-post meta. All now use text-white/60, about 7:1. The decorative chevron is aria-hidden and is left as it was. White text on a solid danger fill, in the dark theme: #fff on #f57171 is 2.80:1. This covered the Button danger variant (/auth/signout/complete is where axe met it), every unread-count badge, and the tel:911 link. A new --danger-fg token is white in light mode (4.84:1) and the dark ground colour in dark mode (7.1:1). All 13 text sites use it. The other solid bg-danger uses are bars and charts with no text. brand-contrast-contract now measures --danger-fg on --danger in both themes, and refuses text-white on a solid bg-danger. Both mutations (text-white put back on the button, dark --danger-fg set to white) fail it. scripts/audit-live-pages.mjs gains --axe, with the same WCAG tags as tests/e2e/accessibility.spec.ts. tsc clean; lint 15/15; contract and blog tests 35/35. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01TRY21ZKsFrfB3qtoP972A4
|
The latest updates on your projects. Learn more about Vercel for GitHub. |
NewWorldVenture
pushed a commit
that referenced
this pull request
Sep 27, 2026
A crawl of every route on www.bubaly.com (398 routes, phone and desktop, axe WCAG 2.1 AA, every internal link) found these on the public pages: - 67 pages hard-coded a brand suffix ("Send a gift · Bubaly", "Smart Kitchen | Bubaly") that the root template then added again, so the tab read "… · Bubaly · Bubaly". The suffixes are gone; "Switch to Bubaly" and "My Bubaly" opt out of the template. A guard scans every page. - The social-proof row, the pricing matrix and the display comparison scroll sideways on a phone but could not be reached by keyboard (axe scrollable-region-focusable). Each is now a named, focusable region. - /resources/benchmarks, unpublished, is a 404 by design but kept its "Household Benchmarks" title; the metadata now asks the same flag. - /gift/<dead token> drew the live page's header over the "no longer active" note; it now answers like /pay/[handle]. - The last-resort error page had no <title>. (The white-on-danger contrast failure the same crawl found is fixed on main by #590, from a parallel session, and is not repeated here.) All 433 internal links resolve. Each behaviour test is red with its fix reverted (benchmarks 2 of 4, gift 2 of 3). Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01KP9rt5rVQ9jDMpZp2xBy3K
This was referenced Sep 27, 2026
NewWorldVenture
pushed a commit
that referenced
this pull request
Sep 27, 2026
Lane A (public, auth and marketing pages) re-crawled on production at e14b12e, phone and desktop, with axe: all 44 rows move to CLEAN, and the lane is released. A signed-in 1280 px axe run found three things the phone sweep could not see, fixed here: - the family display's list tiles scroll inside a fixed-height cell with no keyboard stop: each scrolling tile is now a named, focusable region, and the lists inside a tile no longer scroll on their own (one scroller per tile, the reachable one); - /dashboard/calm and the wallet child view each had an empty-state link told from its sentence by colour alone: now underlined. Guard cases in tests/a-signed-in-control-has-a-name.test.ts fail with the fixes reverted. finalaudit.md gains Q74 (the #548 release and the #588-#590 live-page fixes) and the findings rows. The live-page auditor gains --paths and --cookies for targeted and signed-in runs. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01TRY21ZKsFrfB3qtoP972A4
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Part of the live page audit of www.bubaly.com (after #588 and #589). An axe pass, WCAG 2.2 AA, serious and critical findings only, turned up two defects.
Every blog post (1,049 pages)
The dark article header and footer used
text-white/40(andtext-white/30for the photo credit) on#03090f. That measures 3.73:1 and 2.57:1; small text needs 4.5:1. Affected elements: the breadcrumb, "Written by", SHARE, the previous/next post dates, and related-post details.All of it now uses
text-white/60, about 7:1.White text on a solid danger fill (dark theme)
White on
#f57171is 2.80:1. Affected: theButtondanger variant (axe hit it on/auth/signout/complete), every unread-count badge, and thetel:911link.A new
--danger-fgtoken fixes it:All 13 text sites now use it. The remaining solid
bg-dangeruses are bars and charts with no text.Guard
tests/brand-contrast-contract.test.tsnow measures--danger-fgon--dangerin both themes, and refusestext-whiteon a solidbg-danger. Both reverts fail it:text-whiteput back on the button, and the dark--danger-fgset to white.Auditor
scripts/audit-live-pages.mjs --axeruns the same WCAG tags astests/e2e/accessibility.spec.ts.Checks
tscclean; lint 15/15.🤖 Generated with Claude Code
https://claude.ai/code/session_01TRY21ZKsFrfB3qtoP972A4
Generated by Claude Code