fix: remove icon flex reverse

Kajabi · Oct 23, 2024 · 93fcaaf · 93fcaaf
1 parent 0074e0a
commit 93fcaaf
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 8 deletions.
diff --git a/packages/sage-assets/lib/stylesheets/components/_icon.scss b/packages/sage-assets/lib/stylesheets/components/_icon.scss
@@ -209,3 +209,8 @@ $-icon-beside-type: (
     --background-color: #{sage-color-combo($-color, default, background)};
   }
 }
+
+// flip icons with directional names for RTL - MUST LIVE IN PINE
+[dir="rtl"] pds-icon[name*="left"], [dir="rtl"] pds-icon[name*="right"] {
+  transform: scale(-1);
+}
diff --git a/packages/sage-assets/lib/stylesheets/core/mixins/_sage.scss b/packages/sage-assets/lib/stylesheets/core/mixins/_sage.scss
@@ -78,10 +78,6 @@
     .sage-link--icon-right-#{$icon-name} {
       flex-direction: row-reverse;
 
-      [dir="rtl"] & {
-        flex-direction: row;
-      }
-
       &::before {
         @include sage-icon-base($icon-name, md, pine);
 
@@ -101,10 +97,6 @@
     .sage-link--icon-left-#{$icon-name} {
       flex-direction: row;
 
-      [dir="rtl"] & {
-        flex-direction: row-reverse;
-      }
-
       &::before {
         @include sage-icon-base($icon-name, md, pine);