Skip to content

Commit 904abe1

Browse files
authored
fix(material/menu): prevent divider styles from bleeding out (#29111)
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.
1 parent cc00a74 commit 904abe1

File tree

1 file changed

+10
-10
lines changed

1 file changed

+10
-10
lines changed

src/material/menu/menu.scss

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -63,17 +63,17 @@ mat-menu {
6363
@include cdk.high-contrast(active, off) {
6464
outline: solid 1px;
6565
}
66-
}
6766

68-
.mat-divider {
69-
// Use margin instead of padding since divider uses border-top for line
70-
@include token-utils.use-tokens(
71-
tokens-mat-menu.$prefix,
72-
tokens-mat-menu.get-token-slots()
73-
) {
74-
color: var(#{token-utils.get-token-variable(divider-color)});
75-
margin-bottom: var(#{token-utils.get-token-variable(divider-bottom-spacing)});
76-
margin-top: var(#{token-utils.get-token-variable(divider-top-spacing)});
67+
.mat-divider {
68+
// Use margin instead of padding since divider uses border-top to render out the line.
69+
@include token-utils.use-tokens(
70+
tokens-mat-menu.$prefix,
71+
tokens-mat-menu.get-token-slots()
72+
) {
73+
color: var(#{token-utils.get-token-variable(divider-color)});
74+
margin-bottom: var(#{token-utils.get-token-variable(divider-bottom-spacing)});
75+
margin-top: var(#{token-utils.get-token-variable(divider-top-spacing)});
76+
}
7777
}
7878
}
7979

0 commit comments

Comments
 (0)