fix(ux): light-mode contrast, reduced-motion, ARIA state, mobile hit-target#44
Open
fix(ux): light-mode contrast, reduced-motion, ARIA state, mobile hit-target#44
Conversation
…target
Four UX blockers from a multi-persona review of the new light mode and
3D projects cube. Each fix is small, isolated, and ships ahead of the
overdoing post going live (which would land more eyes on this surface).
1. Bump `--text-faint` in light tokens from `#6b7280` → `#586273`.
The previous value computed to ~4.4:1 on cream `#f4efe4`, failing
WCAG AA 4.5:1 for body text. The new value clears AA. This was the
smallest text on the page (`.face-tool__desc`, `.face-edge`,
`.cube-hint`, `.cube-detail__panel p`) — and the whole "summer /
sunlight visibility" thesis hinged on it being legible.
2. cube.js: honor prefers-reduced-motion in openFace / closeFace.
Previously the global flag killed the auto-spin but the click-to-open
path still ran the 600ms rotate + 300ms zoom-out + 700ms detail-show
sequence. Users with vestibular disorders got the full motion anyway.
Now both functions short-circuit when reduceMotion is set: snap the
rotation, skip the scale animation, open the detail panel
synchronously.
3. theme-toggle.js: sync aria-pressed and aria-label to the rendered
theme. aria-pressed="true" when light is active (the non-default
state). aria-label describes the action a click would take, which
is what assistive tech announces. Runs once at load (after the
bootstrapper has set data-theme) and again on every click.
4. projects.html mobile media query: `.face-btn { min-height: 44px;
padding: 0.6rem 0.9rem; font-size: 0.875rem; }`. The previous
~28px-tall buttons were under iOS's 44×44 hit-target guideline.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
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
1 participant
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.
Summary
Four UX blockers from a multi-persona review of the new light mode and 3D projects cube. Each is small, isolated, and ships ahead of the overdoing post putting more eyes on these surfaces.
(5) "184+ issues" overclaim that one of the agents flagged was a misread by the agent — `#184` is the tracking issue's number (real, accurately cited), not a claim about issue count. The "twenty-five coordinated issues" is also accurate (29 cross-references on issue #184 today, "twenty-five" reads as a stable approximation). No content fix needed.
Four fixes
Test plan
Out of scope (per multi-persona review)
The bigger findings — ecosystem-claim hygiene, "Start here" / About page, proofs-manifest publication, AI-velocity case-study post — are separate work items the user is reviewing.
🤖 Generated with Claude Code