fix(material/button-toggle): use smaller border radius (#31084)

crisbeto · crisbeto · commit 08f5fda901c1 · 2025-05-12T17:45:37.000+02:00
Currently the button toggle uses the `corner-full` value for its broder radius which starts too look weird for a vertical group with text inside the toggles. These changes switch to using the `corner-extra-large` value instead. Fixes #31010. (cherry picked from commit 90413f9)
diff --git a/src/material/core/tokens/m3/mat/_standard-button-toggle.scss b/src/material/core/tokens/m3/mat/_standard-button-toggle.scss
@@ -14,7 +14,7 @@ $prefix: (mat, standard-button-toggle);
   $tokens: sass-utils.merge-all(
     token-definition.generate-typography-tokens($systems, label-text, label-large),
   (
-    shape: map.get($systems, md-sys-shape, corner-full),
+    shape: map.get($systems, md-sys-shape, corner-extra-large),
     hover-state-layer-opacity: map.get($systems, md-sys-state, hover-state-layer-opacity),
     focus-state-layer-opacity: map.get($systems, md-sys-state, focus-state-layer-opacity),
     text-color: map.get($systems, md-sys-color, on-surface),

Original file line number	Diff line number	Diff line change
`@@ -14,7 +14,7 @@ $prefix: (mat, standard-button-toggle);`
`14`	`14`	`$tokens: sass-utils.merge-all(`
`15`	`15`	`token-definition.generate-typography-tokens($systems, label-text, label-large),`
`16`	`16`	`(`
`17`		`- shape: map.get($systems, md-sys-shape, corner-full),`
	`17`	`+ shape: map.get($systems, md-sys-shape, corner-extra-large),`
`18`	`18`	`hover-state-layer-opacity: map.get($systems, md-sys-state, hover-state-layer-opacity),`
`19`	`19`	`focus-state-layer-opacity: map.get($systems, md-sys-state, focus-state-layer-opacity),`
`20`	`20`	`text-color: map.get($systems, md-sys-color, on-surface),`