From 2578712f21f603b2e337b7f898ef122d97d4e12d Mon Sep 17 00:00:00 2001 From: Joy Serquina Date: Wed, 16 Apr 2025 23:30:36 +0000 Subject: [PATCH 1/3] 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 --- src/material/button/button.scss | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/src/material/button/button.scss b/src/material/button/button.scss index baa1a7562b8b..f1d8cb339fa5 100644 --- a/src/material/button/button.scss +++ b/src/material/button/button.scss @@ -7,6 +7,10 @@ .mat-mdc-button-base { text-decoration: none; + // Makes button icon not cut off/shrink vertically making the icon visible to fix b/250063405 + & .mat-icon { + min-height: min-content; + } } .mdc-button { From 87b6962841454cfde8200b9c9de7ad73079416ae Mon Sep 17 00:00:00 2001 From: Joy Serquina Date: Thu, 17 Apr 2025 00:03:42 +0000 Subject: [PATCH 2/3] 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 --- src/material/button/button.scss | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/material/button/button.scss b/src/material/button/button.scss index f1d8cb339fa5..f165bd02d20e 100644 --- a/src/material/button/button.scss +++ b/src/material/button/button.scss @@ -7,9 +7,10 @@ .mat-mdc-button-base { text-decoration: none; - // Makes button icon not cut off/shrink vertically making the icon visible to fix b/250063405 + // Makes button icon not cut off/shrink making the icon visible to fix b/411228600 & .mat-icon { - min-height: min-content; + min-height: fit-content; + flex-shrink: 0; } } From d22b5f114382f6e11d1d8cd8570f8c289d58ac27 Mon Sep 17 00:00:00 2001 From: Joy Serquina Date: Thu, 17 Apr 2025 18:25:17 +0000 Subject: [PATCH 3/3] refactor(material/button): fix lint error Adds comment to fix lint error. --- src/material/button/button.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/src/material/button/button.scss b/src/material/button/button.scss index f165bd02d20e..e533a2efd1cf 100644 --- a/src/material/button/button.scss +++ b/src/material/button/button.scss @@ -9,6 +9,7 @@ text-decoration: none; // Makes button icon not cut off/shrink making the icon visible to fix b/411228600 & .mat-icon { + // stylelint-disable material/no-prefixes min-height: fit-content; flex-shrink: 0; }