fix(material/button-toggle): ripples not clipping correctly in safari (…

…angular#12311) Fixes the ripples on button toggles not being clipped to the border radius in Safari. Relates to angular#12244.
forsti0506 · Apr 3, 2022 · fd0c7f6 · fd0c7f6
1 parent 56a0218
commit fd0c7f6
Showing 1 changed file with 3 additions and 0 deletions.
diff --git a/src/material/button-toggle/button-toggle.scss b/src/material/button-toggle/button-toggle.scss
@@ -19,6 +19,9 @@ $legacy-border-radius: 2px !default;
   border-radius: $legacy-border-radius;
   -webkit-tap-highlight-color: transparent;
 
+  // Fixes the ripples not being clipped to the border radius on Safari.
+  transform: translateZ(0);
+
   @include a11y.high-contrast(active, off) {
     outline: solid 1px;
   }