Skip to content
This repository was archived by the owner on Sep 26, 2023. It is now read-only.

Commit f1ab7b6

Browse files
author
Kevin
authored
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.
1 parent f5531ac commit f1ab7b6

File tree

1 file changed

+3
-1
lines changed

1 file changed

+3
-1
lines changed

src/reset.css

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,9 @@ img:not([alt]) {
7777

7878
/* Remove all animations and transitions for people that prefer not to see them */
7979
@media (prefers-reduced-motion: reduce) {
80-
* {
80+
*,
81+
*::before,
82+
*::after {
8183
animation-duration: 0.01ms !important;
8284
animation-iteration-count: 1 !important;
8385
transition-duration: 0.01ms !important;

0 commit comments

Comments
 (0)