Respects prefers-reduced-motion for content animations. #26286
Conversation
|
Thanks for the fix, glad we're supporting this a11y option! Just as a note this also won't yet affect story specific amp components with default animations (specifically |
|
Yep, we'll have to send a second PR to disable animations on all these components (quiz, sidebar, ...). |
| @@ -40,6 +40,15 @@ amp-consent { | |||
| z-index: initial !important; | |||
| } | |||
|
|
|||
| @media (prefers-reduced-motion: reduce) { | |||
| *, | |||
There was a problem hiding this comment.
Isn't this going to be a super expensive selector?
There was a problem hiding this comment.
I'm not entirely sure, I'm never really worried about CSS selectors usually, only about their properties.
I got most of the information here: https://developers.google.com/web/updates/2019/03/prefers-reduced-motion#bonus_forcing_reduced_motion_on_all_websites
There was a problem hiding this comment.
(There's no obvious difference in the metrics the devtools give, but I didn't check the evaluation time)
There was a problem hiding this comment.
Sounds good, but worth keeping in mind in case we notice a difference between regular and reduced motion. I was primarily worried because stories often have long and deep DOM trees
Respects
prefers-reduced-motionfor AMP story content animations.This does not affect system components for now, but only animations provided by
animate-inattributes, or custom publisher animations.#24821