fix(material/menu): invert arrow in RTL

Fixes a regression from #28470 where the nested menu icon isn't being inverted in RTL anymore. Fixes #28813.
angular · Apr 5, 2024 · 8f37c14 · 8f37c14
1 parent 2b49d8c
commit 8f37c14
Showing 1 changed file with 4 additions and 4 deletions.
diff --git a/src/material/core/style/_menu-common.scss b/src/material/core/style/_menu-common.scss
@@ -63,12 +63,12 @@ $icon-margin: 16px !default;
   width: $icon-size;
   height: 10px;
   fill: currentColor;
-  padding-left: $item-spacing;
+  margin-left: $item-spacing;
 
   [dir='rtl'] & {
-    right: auto;
-    padding-right: $item-spacing;
-    padding-left: 0;
+    margin-right: $item-spacing;
+    margin-left: 0;
+    transform: scaleX(-1);
   }
 
   // Fix for Chromium-based browsers blending in the `currentColor` with the background.