fix(material-experimental/mdc-button): avoid shrinking FAB and icon b…

…utton (#23532)

Fixes that the width of the FAB and icon button can collapse. We have something similar in the existing buttons already.

(cherry picked from commit c608df8)

src/material-experimental/mdc-button/fab.scss

@@ -11,6 +11,9 @@
   @include button-base.mat-private-button-touch-target(true);
   @include private.private-animation-noop();
 
+  // Prevent the button from shrinking since it's always supposed to be a circle.
+  flex-shrink: 0;
+
   // MDC adds some styles to fab and mini-fab that conflict with some of our focus indicator
   // styles and don't actually do anything. This undoes those conflicting styles.
   &:not(.mdc-ripple-upgraded):focus::before {

src/material-experimental/mdc-button/icon-button.scss

@@ -15,6 +15,9 @@
   // Border radius is inherited by ripple to know its shape. Set to 50% so the ripple is round.
   border-radius: 50%;
 
+  // Prevent the button from shrinking since it's always supposed to be a circle.
+  flex-shrink: 0;
+
   @include button-base.mat-private-button-disabled();
   @include button-base.mat-private-button-touch-target(true);
   @include private.private-animation-noop();