fix(web): keep feedback under prefers-reduced-motion - #24
Merged
Conversation
|
PunGrumpy
force-pushed
the
motion/05-reduced-motion
branch
from
August 7, 2026 16:31
e43626d to
f2cd11f
Compare
PunGrumpy
force-pushed
the
motion/05-reduced-motion
branch
from
August 7, 2026 16:34
f2cd11f to
ce90a2b
Compare
The global reduced-motion block zeroed every animation and transition, killing the color/opacity fades that aid comprehension and freezing the processing spinners (iteration-count: 1 on an infinite rotation), so reduced-motion users lost the only "working on it" indicator. The block now forces transition-property to a movement-free safe list (colors, opacity, shadows) so transform/position transitions snap while feedback fades keep their durations, reduces tw-animate-css entrance keyframes to instant, and scopes scroll-behavior to html where it is set. Implements plans/005-reduced-motion-keep-feedback.md. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
PunGrumpy
force-pushed
the
motion/05-reduced-motion
branch
from
August 7, 2026 16:50
ce90a2b to
1c713bd
Compare
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.
Problem
With
prefers-reduced-motion: reduceset, the app dropped all feedback: hover fades, the status-dot crossfade, and checkbox fills stopped animating, and the processing spinners froze — reduced-motion users lost the only "working on it" indicator.Root Cause
The global block zeroed
animation-duration/transition-durationand forcedanimation-iteration-count: 1on*, which turns an infinite spinner rotation into a single invisible 0.01ms run. Reduced motion is meant to remove movement (translation/scaling — the vestibular triggers), not color and opacity feedback.Solution
The block now forces
transition-propertyto a movement-free safe list (color, background-color, border-color, fill, stroke, opacity, box-shadow), so transform/position transitions snap while feedback fades keep their authored durations.tw-animate-cssentrance/exit keyframes (animate-in/animate-out) are reduced to instant since they move elements;animate-spin(in-place state indication) andanimate-pulse(opacity-only) keep running.scroll-behavior: autois scoped tohtml, wheresmoothis set.Result
Under reduced motion nothing translates or scales over time, but spinners spin and color/opacity feedback remains — gentler, not zero. Pairs with #20, which skips the JS-driven slider sweep under the same preference. Implements
plans/005-reduced-motion-keep-feedback.md.🤖 Generated with Claude Code