fix(circularprogress)!: make default width 4px

PiperOrigin-RevId: 562924358
material-components · Sep 5, 2023 · c864d3b · c864d3b
1 parent 58497f1
commit c864d3b
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 1 deletion.
diff --git a/progress/internal/_circular-progress.scss b/progress/internal/_circular-progress.scss
@@ -26,6 +26,8 @@
 @mixin styles() {
   $tokens: tokens.md-comp-circular-progress-values();
 
+  // If changing this value, make sure to change $size-without-padding in the
+  // circular-progress tokens.
   $container-padding: 4px;
 
   // note, these value come from the m2 version but match current gm3 values.

diff --git a/tokens/_md-comp-circular-progress.scss b/tokens/_md-comp-circular-progress.scss
@@ -52,10 +52,12 @@ $_default: (
     // must be set as a raw % for compatibility between rendering border or svg.
     $width: map.get($tokens, 'active-indicator-width');
     $size: map.get($tokens, 'size');
+    $container-padding: 4px;
+    $size-without-padding: $size - $container-padding - $container-padding;
     $tokens: map.set(
       $tokens,
       'active-indicator-width',
-      math.div($width, $size) * 100
+      math.div($width, $size-without-padding) * 100
     );
   }