Skip to content
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

[Coachmark][a11y]: subtle animation should support prefers-reduced-motion media query #1952

Open
majornista opened this issue Jun 19, 2023 · 5 comments
Labels
a11y Questions or topics for the accessibility team bug Results from a bug in the CSS implementation

Comments

@majornista
Copy link
Contributor

Description

Coachmark continues to animate subtly despite the prefers-reduced-motion user preference.

Steps to reproduce

  1. Using Chrome, go to https://opensource.adobe.com/spectrum-css/coachmark.html
  2. Open Developer Tools > Rendering
  3. Under Emulate CSS media feature prefers-reduced-motion, select "prefers-reduced-motion: reduce"
Screen shot of  Developer Tools > Rendering panel with Emulate CSS media feature prefers-reduced-motion picker

Expected behavior

Coachmark elements should not continue to vibrate.

Screenshots

Screen Recording showing continuous animation

Environment

  • Spectrum CSS version: @spectrum-css/coachmark@5.0.48
  • Browser(s) and OS(s): Chrome 114.0.5735.106 (Official Build) (arm64) on macOS

Additional context

@majornista majornista added bug Results from a bug in the CSS implementation a11y Questions or topics for the accessibility team labels Jun 19, 2023
@pfulton
Copy link
Collaborator

pfulton commented Jun 19, 2023

@majornista thank you! We're actively working to migrate this component to the new Spectrum Tokens system, and @jenndiaz is working on it in our current sprint. I added a note in her Jira ticket for the migration, so we'll be sure to get this update in with that work.

@majornista
Copy link
Contributor Author

Thanks!

@jenndiaz
Copy link
Contributor

@majornista Do you have a alternative behavior you'd recommend for the element?
Does just stopping the animation (screenshot) lose too much of the original design or do you think this is okay?

Screenshot 2023-06-21 at 2 57 17 PM

@pfulton
Copy link
Collaborator

pfulton commented Nov 15, 2023

@majornista any additional thoughts here with regard to @jenndiaz's comment above? We're getting close to merging and releasing this component and want to be sure that we've addressed everything.

@jenndiaz
Copy link
Contributor

Prefers reduced motion styling added to the coach indicator in the S1 migration for Coach Mark

https://github.com/adobe/spectrum-css/pull/2323/files#diff-8b0768275144772a003e7c7254ed48176d187ad85fd7dcd23c89039529ab54e7R95

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
a11y Questions or topics for the accessibility team bug Results from a bug in the CSS implementation
Projects
None yet
Development

No branches or pull requests

3 participants