Toolhub interface is animated even when the OS/browser settings are set to reduce animation
Open, Needs TriagePublicBUG REPORT
Actions

Assigned To

None

Authored By

	Nikki
	Nov 8 2022, 1:05 PM

Description

Steps to replicate the issue (include links if applicable):

What happens?:

The click triggers a background animation.

What should have happened instead?:

There should be no unnecessary animation.

Software version (skip for WMF-hosted wikis like Wikipedia):

Other information (browser name/version, screenshots, etc.):

If other people really want to keep the animations, prefers-reduced-motion should be used to disable them when requested.
MDN page: https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptNov 8 2022, 1:05 PM

The language selector also slides in/out of view.

There's an animation when focusing/unfocusing the search field in the language selector.

I had hoped for a built-in solution for this in the Vuetify component library that we are using, but so far I have not been able to find any.

We may be able to disable the majority of animations with some css like:

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important }
}