Skip to content

Commit

Permalink
fix(material/menu): invert arrow in RTL
Browse files Browse the repository at this point in the history
Fixes a regression from #28470 where the nested menu icon isn't being inverted in RTL anymore.

Fixes #28813.
  • Loading branch information
crisbeto committed Apr 5, 2024
1 parent 2b49d8c commit 8033469
Showing 1 changed file with 7 additions and 1 deletion.
8 changes: 7 additions & 1 deletion src/material/core/style/_menu-common.scss
Original file line number Diff line number Diff line change
Expand Up @@ -63,12 +63,18 @@ $icon-margin: 16px !default;
width: $icon-size;
height: 10px;
fill: currentColor;

// We use `padding` here, because the margin can collapse depending on the other content.
padding-left: $item-spacing;

[dir='rtl'] & {
right: auto;
padding-right: $item-spacing;
padding-left: 0;

// Invert the arrow direction.
polygon {
transform: scaleX(-1);
}
}

// Fix for Chromium-based browsers blending in the `currentColor` with the background.
Expand Down

0 comments on commit 8033469

Please sign in to comment.