-
Notifications
You must be signed in to change notification settings - Fork 11.6k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
EmptyState: Don't apply animation when prefers-reduced-motion
is set
#87638
Conversation
grotArm?.setAttribute('style', `transform: rotate(${rotation}deg) translateX(${translation}%)`); | ||
grotMagnifier?.setAttribute('style', `transform: rotate(${rotation}deg) translateX(${translation}%)`); | ||
}); | ||
if (window.matchMedia('(prefers-reduced-motion: no-preference)').matches) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Why doesn't this bail immediately, rather than at the very end?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
good point 👍
const grotArm = svgRef.current?.querySelector('#grot-not-found-arm'); | ||
const grotMagnifier = svgRef.current?.querySelector('#grot-not-found-magnifier'); | ||
// only apply animation if no reduced motion preference is set | ||
if (window.matchMedia('(prefers-reduced-motion: no-preference)').matches) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
if (window.matchMedia('(prefers-reduced-motion: no-preference)').matches) { | |
if (!window.matchMedia('(prefers-reduced-motion: no-preference)').matches) { | |
return; |
What about doing an early return instead? ;)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
sure 👍
What is this feature?
Why do we need this feature?
Who is this feature for?
Which issue(s) does this PR fix?:
Fixes #
Special notes for your reviewer:
Please check that: