feat: add user-configurable motion preference#2905
Open
xseman wants to merge 3 commits into
Open
Conversation
![claude[bot]](https://avatars.githubusercontent.com/in/1236702?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Pull request overview
Note
Copilot was unable to run its full agentic suite in this review.
Adds a user-configurable “Motion” preference (auto / reduce / always animate) that influences global animation/transition behavior and view transitions.
Changes:
- Adds a Motion settings UI and a Stimulus controller to persist/apply the preference.
- Injects an early head script to set
data-motionand adjustprefers-reduced-motionbehavior. - Updates reset styles to apply reduced-motion rules based on
html[data-motion="reduce"].
Reviewed changes
Copilot reviewed 5 out of 5 changed files in this pull request and generated 6 comments.
Show a summary per file
| File | Description |
|---|---|
| app/views/users/_theme.html.erb | Adds Motion preference radio UI wired to a Stimulus controller. |
| app/views/layouts/shared/_head.html.erb | Renders the new motion preference head partial. |
| app/views/layouts/_motion_preference.html.erb | Adds inline head JS to set data-motion, remove view-transition meta, and override matchMedia. |
| app/javascript/controllers/motion_controller.js | Implements persistence + DOM updates for the Motion setting. |
| app/assets/stylesheets/reset.css | Switches reduced-motion styling from media query to data-motion selector. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Users who have prefers-reduced-motion set at the OS level but are browsing without JavaScript would receive no reduced-motion treatment after the @media block was removed. Restore it with a :not([data-motion="animate"]) guard so JS-driven "Always animate" mode still overrides it while keeping the no-JS safety net.
The comment "absent → patch falls through to OS" was misleading because the attribute is immediately re-set on the next line. Clarify that the deletion is intentionally transient: it temporarily removes the attribute so the matchMedia patch reads the real OS value before resolving to the binary reduce/animate state.
Author
|
Also, if this feature is out of scope for now, what if we just add a small note in the profile section? Something like: It's pretty much what Google does in their transition examples here https://view-transitions.chrome.dev/stack-navigator/mpa-prerender/ |
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
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.
Man, I spent way too long thinking Fizzy had an animation bug because I couldn't reproduce the transitions I saw on another computer. Turns out it was just my OS blocking them! But honestly, closing cards feels so slow without the animations. So, I'm fixing it by letting users override the OS setting. I'm adding an "Always Animate" option that saves to localStorage and patches matchMedia so Turbo doesn't break.
output.mp4