From 5b1dacc0c278476bba6c7b023d43f15a6c680c3c Mon Sep 17 00:00:00 2001 From: Eshaan Dabasiya <76681468+im3dabasia@users.noreply.github.com> Date: Tue, 14 Jan 2025 13:17:34 +0530 Subject: [PATCH] Edit Post: Standardize reduced motion handling using media queries (#68426) Co-authored-by: im3dabasia Co-authored-by: t-hamano --- packages/edit-post/src/components/back-button/style.scss | 5 +++-- packages/edit-post/src/components/layout/style.scss | 5 +++-- 2 files changed, 6 insertions(+), 4 deletions(-) diff --git a/packages/edit-post/src/components/back-button/style.scss b/packages/edit-post/src/components/back-button/style.scss index aced752bfedfa..3082cb80a3e4e 100644 --- a/packages/edit-post/src/components/back-button/style.scss +++ b/packages/edit-post/src/components/back-button/style.scss @@ -23,8 +23,9 @@ } &::before { - transition: box-shadow 0.1s ease; - @include reduce-motion("transition"); + @media not (prefers-reduced-motion) { + transition: box-shadow 0.1s ease; + } content: ""; display: block; position: absolute; diff --git a/packages/edit-post/src/components/layout/style.scss b/packages/edit-post/src/components/layout/style.scss index 7a7f13382661a..c63f3eb252817 100644 --- a/packages/edit-post/src/components/layout/style.scss +++ b/packages/edit-post/src/components/layout/style.scss @@ -73,8 +73,9 @@ width: inherit; height: $grid-unit-05; border-radius: $radius-small; - transition: width 0.3s ease-out; - @include reduce-motion("transition"); + @media not (prefers-reduced-motion) { + transition: width 0.3s ease-out; + } } }