From 8d56ba4b404c4604b2f27cfaf4839ae4b7796a01 Mon Sep 17 00:00:00 2001
From: trevor-signal <131492920+trevor-signal@users.noreply.github.com>
Date: Tue, 7 Nov 2023 18:46:15 -0500
Subject: [PATCH] Allow RTL-able images to display in Storybook

---
 stylesheets/_mixins.scss | 24 +++++++-----------------
 1 file changed, 7 insertions(+), 17 deletions(-)

diff --git a/stylesheets/_mixins.scss b/stylesheets/_mixins.scss
index 8af70dbcbe31..a2d68dc1a386 100644
--- a/stylesheets/_mixins.scss
+++ b/stylesheets/_mixins.scss
@@ -269,23 +269,7 @@ $rtl-icon-map: (
 }
 
 @mixin color-svg($svg, $color, $stretch: true, $mask-origin: null) {
-  $rtl-svg: get-rtl-svg($svg);
-  @if $rtl-svg {
-    :dir(ltr) & {
-      -webkit-mask: url($svg) no-repeat center;
-      @if $stretch {
-        -webkit-mask-size: 100%;
-      }
-    }
-    :dir(rtl) & {
-      -webkit-mask: url($rtl-svg) no-repeat center;
-      @if $stretch {
-        -webkit-mask-size: 100%;
-      }
-    }
-  } @else {
-    -webkit-mask: url($svg) no-repeat center;
-  }
+  -webkit-mask: url($svg) no-repeat center;
   @if $stretch {
     -webkit-mask-size: 100%;
   }
@@ -296,6 +280,12 @@ $rtl-icon-map: (
   @media (forced-colors: active) {
     background-color: WindowText;
   }
+  $rtl-svg: get-rtl-svg($svg);
+  @if $rtl-svg {
+    :dir(rtl) & {
+      -webkit-mask: url($rtl-svg) no-repeat center;
+    }
+  }
 }
 
 // Keyboard