Skip to content

Commit

Permalink
fix(material/menu): prevent divider styles from bleeding out (#29111)
Browse files Browse the repository at this point in the history
Fixes that the styles for the menu divider were at the top level which means that they'll also affect dividers outside of the menu.

Fixes #29106.

(cherry picked from commit 904abe1)
  • Loading branch information
crisbeto committed May 28, 2024
1 parent 2110f2c commit 24de3d4
Showing 1 changed file with 10 additions and 10 deletions.
20 changes: 10 additions & 10 deletions src/material/menu/menu.scss
Original file line number Diff line number Diff line change
Expand Up @@ -63,17 +63,17 @@ mat-menu {
@include cdk.high-contrast(active, off) {
outline: solid 1px;
}
}

.mat-divider {
// Use margin instead of padding since divider uses border-top for line
@include token-utils.use-tokens(
tokens-mat-menu.$prefix,
tokens-mat-menu.get-token-slots()
) {
color: var(#{token-utils.get-token-variable(divider-color)});
margin-bottom: var(#{token-utils.get-token-variable(divider-bottom-spacing)});
margin-top: var(#{token-utils.get-token-variable(divider-top-spacing)});
.mat-divider {
// Use margin instead of padding since divider uses border-top to render out the line.
@include token-utils.use-tokens(
tokens-mat-menu.$prefix,
tokens-mat-menu.get-token-slots()
) {
color: var(#{token-utils.get-token-variable(divider-color)});
margin-bottom: var(#{token-utils.get-token-variable(divider-bottom-spacing)});
margin-top: var(#{token-utils.get-token-variable(divider-top-spacing)});
}
}
}

Expand Down

0 comments on commit 24de3d4

Please sign in to comment.