diff --git a/src/material/button/_button-base.scss b/src/material/button/_button-base.scss index d4c21b6d58c4..7b1e2a733abb 100644 --- a/src/material/button/_button-base.scss +++ b/src/material/button/_button-base.scss @@ -74,11 +74,11 @@ background-color: token-utils.slot($ripple-color-token, $fallbacks); } - .mat-mdc-button-persistent-ripple::before { + & > .mat-mdc-button-persistent-ripple::before { background-color: token-utils.slot($state-layer-color-token, $fallbacks); } - &.mat-mdc-button-disabled .mat-mdc-button-persistent-ripple::before { + &.mat-mdc-button-disabled > .mat-mdc-button-persistent-ripple::before { background-color: token-utils.slot($disabled-state-layer-color-token, $fallbacks); } @@ -124,7 +124,7 @@ $touch-target-size-token, $touch-target-display-token, $fallbacks) { - .mat-mdc-button-touch-target { + & > .mat-mdc-button-touch-target { position: absolute; top: 50%; height: token-utils.slot($touch-target-size-token, $fallbacks); @@ -170,7 +170,7 @@ } } - .mdc-button__label + .mat-icon { + & > .mdc-button__label + .mat-icon { margin-right: $icon-offset; margin-left: $icon-spacing; diff --git a/src/material/button/button.scss b/src/material/button/button.scss index aca34d9ab351..37685a60c6db 100644 --- a/src/material/button/button.scss +++ b/src/material/button/button.scss @@ -78,7 +78,7 @@ $fallbacks: m3-button.get-tokens(); text-transform: token-utils.slot(button-text-label-text-transform, $fallbacks); font-weight: token-utils.slot(button-text-label-text-weight, $fallbacks); - &, .mdc-button__ripple { + &, & > .mdc-button__ripple { border-radius: token-utils.slot(button-text-container-shape, $fallbacks); }