Follow-up to #2983568: Audit and improve focus styles across the Umami theme for logged out users. This was deferred so that it wouldn't hold up all the other awesome wins in the main issue.

The hover and focus styles in Umami use animation. It would be good to make these respect the prefers-reduced-motion CSS media query, and check they don't rely on animation to convey state.

Comments

andrewmacpherson created an issue. See original summary.

andrewmacpherson’s picture

andrewmacpherson commented
Title: Make Umami focus + hover styles respect prefers-reduced-motion » [PP-1] Make Umami focus + hover styles respect prefers-reduced-motion
Issue summary: View changes
Status: Active » Postponed

It's probably best to leave this issue until after we have committed #2983568: Audit and improve focus styles across the Umami theme for logged out users. I've marked this postponed, and I'll set it back to active when at the right time.

andrewmacpherson’s picture

andrewmacpherson commented
Status: Postponed » Active

This issue can be active again, since #2983568: Audit and improve focus styles across the Umami theme for logged out users is fixed.

andrewmacpherson’s picture

andrewmacpherson commented
Title: [PP-1] Make Umami focus + hover styles respect prefers-reduced-motion » Make Umami focus + hover styles respect prefers-reduced-motion

Version: 8.7.x-dev » 8.8.x-dev

Drupal 8.7.0-alpha1 will be released the week of March 11, 2019, which means new developments and disruptive changes should now be targeted against the 8.8.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

Version: 8.8.x-dev » 8.9.x-dev

Drupal 8.8.0-alpha1 will be released the week of October 14th, 2019, which means new developments and disruptive changes should now be targeted against the 8.9.x-dev branch. (Any changes to 8.9.x will also be committed to 9.0.x in preparation for Drupal 9’s release, but some changes like significant feature additions will be deferred to 9.1.x.). For more information see the Drupal 8 and 9 minor version schedule and the Allowed changes during the Drupal 8 and 9 release cycles.

Version: 8.9.x-dev » 9.1.x-dev

Drupal 8.9.0-beta1 was released on March 20, 2020. 8.9.x is the final, long-term support (LTS) minor release of Drupal 8, which means new developments and disruptive changes should now be targeted against the 9.1.x-dev branch. For more information see the Drupal 8 and 9 minor version schedule and the Allowed changes during the Drupal 8 and 9 release cycles.

Version: 9.1.x-dev » 9.2.x-dev

Drupal 9.1.0-alpha1 will be released the week of October 19, 2020, which means new developments and disruptive changes should now be targeted for the 9.2.x-dev branch. For more information see the Drupal 9 minor version schedule and the Allowed changes during the Drupal 9 release cycle.

Version: 9.2.x-dev » 9.3.x-dev

Drupal 9.2.0-alpha1 will be released the week of May 3, 2021, which means new developments and disruptive changes should now be targeted for the 9.3.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

Version: 9.3.x-dev » 9.4.x-dev

Drupal 9.3.0-rc1 was released on November 26, 2021, which means new developments and disruptive changes should now be targeted for the 9.4.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

Version: 9.4.x-dev » 9.5.x-dev

Drupal 9.4.0-alpha1 was released on May 6, 2022, which means new developments and disruptive changes should now be targeted for the 9.5.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

Version: 9.5.x-dev » 10.1.x-dev

Drupal 9.5.0-beta2 and Drupal 10.0.0-beta2 were released on September 29, 2022, which means new developments and disruptive changes should now be targeted for the 10.1.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

Version: 10.1.x-dev » 11.x-dev

Drupal core is moving towards using a “main” branch. As an interim step, a new 11.x branch has been opened, as Drupal.org infrastructure cannot currently fully support a branch named main. New developments and disruptive changes should now be targeted for the 11.x branch, which currently accepts only minor-version allowed changes. For more information, see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

mgifford’s picture

mgifford
he/him
Primary language English
commented
Issue tags: +VIMS, +wcag233

https://www.w3.org/WAI/WCAG21/Understanding/animation-from-interactions....

markconroy’s picture

markconroy commented

Hi @andrewmacpherson and @mgifford

Just want to check that this is an issue we need to fix. The "motion" we have for hover and focus states is a very subtle motion to change colour and/or show an underline/border. This is a far cry from things zooming in and out of the page. If someone "prefers _reduced_ motion" I can understand on a site with things zooming in and out that they would want this "reduced".

I'm not sure if our motion is so severe that we can reduce it at all without actually removing it. Is that what we want to do in this issue - set "no motion/transition time" for items if "prefers reduced motion" preference is set? I'm perfectly happy if this is the desired state we want, just want to be sure before we work on it.

markconroy’s picture

markconroy commented
Status: Active » Postponed (maintainer needs more info)
quietone’s picture

quietone commented
Status: Postponed (maintainer needs more info) » Closed (outdated)

There hasn't been a response to the query in the last comment. Since there is no clear indication that this is needed, I am closing this issue.

If there is work to do here, then either re-open the issue or open a new issue and reference this one. If the choice is to use this issue then add a comment change make sure to change the issue status to 'Active'.