Skip to content

Commit 8523397

Browse files
authored
fix(material/button): prevents mat-icon being cut off by text-spacing (#30891)
* fix(material/button): prevents mat-icon being cut off with text-spacing vertically Updates Angular Components Button component specifically for .mat-icon buttons to add a min-height of min-content to avoid the icon from being cut off on the bottom when text-spacing is applied. Fixes b/250063405 * fix(material/button): adds flex-shrink to prevent sides cutoff Updates previous changes to Angular Components buttons containing icons and adds flex-shrink: 0; to prevent the sides from being cut off when text-spacing is applied or on smaller screens. Fixes b/411228600 * refactor(material/button): fix lint error Adds comment to fix lint error.
1 parent 623030b commit 8523397

File tree

1 file changed

+6
-0
lines changed

1 file changed

+6
-0
lines changed

src/material/button/button.scss

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,12 @@ $fallbacks: m3-button.get-tokens();
99

1010
.mat-mdc-button-base {
1111
text-decoration: none;
12+
// Makes button icon not cut off/shrink making the icon visible to fix b/411228600
13+
& .mat-icon {
14+
// stylelint-disable material/no-prefixes
15+
min-height: fit-content;
16+
flex-shrink: 0;
17+
}
1218
}
1319

1420
.mdc-button {

0 commit comments

Comments
 (0)