From 82258776fcf91ef061c760ce51240883ca321404 Mon Sep 17 00:00:00 2001 From: TJ Egan Date: Tue, 10 Mar 2020 10:05:06 -0700 Subject: [PATCH 1/2] fix(progress-indicator): use circle--filled icon --- .../progress-indicator/_progress-indicator.scss | 11 +---------- .../components/ProgressIndicator/ProgressIndicator.js | 6 +++--- 2 files changed, 4 insertions(+), 13 deletions(-) diff --git a/packages/components/src/components/progress-indicator/_progress-indicator.scss b/packages/components/src/components/progress-indicator/_progress-indicator.scss index 58f152d6847e..6fad5a9475d3 100644 --- a/packages/components/src/components/progress-indicator/_progress-indicator.scss +++ b/packages/components/src/components/progress-indicator/_progress-indicator.scss @@ -48,7 +48,7 @@ width: $carbon--spacing-05; height: $carbon--spacing-05; border-radius: 50%; - margin: 9px $carbon--spacing-03 0 0; + margin: rem(10px) $carbon--spacing-03 0 0; fill: $interactive-04; } @@ -143,15 +143,6 @@ } } - .#{$prefix}--progress-step--current svg { - stroke: $interactive-04; - fill: $interactive-04; - - path:last-of-type { - stroke-width: 40%; - } - } - //INCOMPLETE STYLING .#{$prefix}--progress-step--incomplete { svg { diff --git a/packages/react/src/components/ProgressIndicator/ProgressIndicator.js b/packages/react/src/components/ProgressIndicator/ProgressIndicator.js index f974a8d50c6d..d67076ae9e32 100644 --- a/packages/react/src/components/ProgressIndicator/ProgressIndicator.js +++ b/packages/react/src/components/ProgressIndicator/ProgressIndicator.js @@ -12,8 +12,8 @@ import { settings } from 'carbon-components'; import { CheckmarkOutline16, Warning16, - RadioButtonChecked16, RadioButton16, + CircleFilled16, } from '@carbon/icons-react'; import { keys, matches } from '../../internal/keyboard'; @@ -66,9 +66,9 @@ export function ProgressStep({ } if (current) { return ( - + {description} - + ); } if (complete) { From 98a451cf3a3095841b2b063350604e1acc0abf0b Mon Sep 17 00:00:00 2001 From: TJ Egan Date: Tue, 10 Mar 2020 12:09:51 -0700 Subject: [PATCH 2/2] fix(progress-indicator): change token, adjust svg margin --- .../components/progress-indicator/_progress-indicator.scss | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/components/src/components/progress-indicator/_progress-indicator.scss b/packages/components/src/components/progress-indicator/_progress-indicator.scss index 6fad5a9475d3..699107fc4a8f 100644 --- a/packages/components/src/components/progress-indicator/_progress-indicator.scss +++ b/packages/components/src/components/progress-indicator/_progress-indicator.scss @@ -139,7 +139,7 @@ //CURRENT STYLING .#{$prefix}--progress-step--current { .#{$prefix}--progress-line { - background-color: $interactive-01; + background-color: $interactive-04; } } @@ -157,7 +157,7 @@ //COMPLETED STYLING .#{$prefix}--progress-step--complete { .#{$prefix}--progress-line { - background-color: $interactive-01; + background-color: $interactive-04; } } @@ -235,7 +235,7 @@ .#{$prefix}--progress--vertical .#{$prefix}--progress-step svg, .#{$prefix}--progress--vertical .#{$prefix}--progress-step-button svg { display: inline-block; - margin: 0.1rem 0.5rem; + margin: rem(3px) 0.5rem 0; } .#{$prefix}--progress--vertical .#{$prefix}--progress-step-button svg {