Password strength needs to respect prefers-reduced-motion

Created on 30 January 2020, about 5 years ago
Updated 25 January 2024, about 1 year ago

Password strength indicator is animated

.password-strength__indicator{-webkit-transition:width 0.5s ease-out;transition:width 0.5s ease-out;background-color:#77b259;}

This animation would properly respect 🌱 [policy, no patch] Use "prefers-reduced-motion" media query to disable animations Active .

While I'd guess (and this is only a guess) this would not have a VIMS impact, it affects hypervigilance and attention issues.

πŸ› Bug report
Status

Closed: cannot reproduce

Version

9.5

Component
User systemΒ  β†’

Last updated 9 days ago

Created by

πŸ‡ΊπŸ‡ΈUnited States charles belov San Francisco, CA, US

Live updates comments and jobs are added and updated live.
  • Accessibility

    It affects the ability of people with disabilities or special needs (such as blindness or color-blindness) to use Drupal.

  • CSS

    It involves the content or handling of Cascading Style Sheets.

Sign in to follow issues

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

  • After testing the existing code, I confirm that it works as expected in both scenarios, with and without the prefers-reduce-motion feature as the code already accounts for the prefers-reduced-motion media feature, which removes the transition.
    It can be found in core/themes/claro/css/components/form--password-confirm.pcss.css

  • Status changed to Closed: cannot reproduce about 1 year ago
  • πŸ‡ΊπŸ‡ΈUnited States charles belov San Francisco, CA, US

    Confirmed working as requested in Drupal 10.2.2. Closing as unable to reproduce.

Production build 0.71.5 2024