From f1ab7b69749c42c24084945de0dd2738fc2a0808 Mon Sep 17 00:00:00 2001 From: Kevin Date: Thu, 22 Oct 2020 02:30:38 +0300 Subject: [PATCH] Reduce motion of ::before and ::after pseudo-elements The change adds the `*::before` and *::after` in the reduce motion media query. Effectively these additions should prevent any animations which were happening in these pseudo-elements when the user has opted to reduce the motion. Why? I've come across an edge case where I'm animating an `::after` (not sure if that's the ideal way to do it), but animations should be disabled for these pseudo-elements as well. --- src/reset.css | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/reset.css b/src/reset.css index 4f72824..7c70b58 100644 --- a/src/reset.css +++ b/src/reset.css @@ -77,7 +77,9 @@ img:not([alt]) { /* Remove all animations and transitions for people that prefer not to see them */ @media (prefers-reduced-motion: reduce) { - * { + *, + *::before, + *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important;