fix(radio): use correct styles for disabled radio buttons

fixes #258 This is a backport of 2fcbbf0.
vmware-clarity · Aug 18, 2022 · 79631a3 · 79631a3
1 parent 2e7bb09
commit 79631a3
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 5 deletions.
diff --git a/projects/angular/src/forms/styles/_properties.forms.scss b/projects/angular/src/forms/styles/_properties.forms.scss
@@ -72,10 +72,10 @@
 
       // Radio
       --clr-forms-radio-label-color: var(--clr-forms-checkbox-label-color);
-      --clr-forms-radio-disabled-background-color: var(--clr-form-disabled-background-color);
+      --clr-forms-radio-disabled-background-color: var(--clr-color-neutral-700);
       --clr-forms-radio-disabled-mark-color: var(--clr-forms-checkbox-disabled-mark-color);
       --clr-forms-radio-selected-shadow: var(--clr-forms-checkbox-checked-shadow);
-      --clr-forms-radio-disabled-shadow: var(--clr-forms-checkbox-checked-shadow);
+      --clr-forms-radio-disabled-shadow: #{$clr-forms-radio-disabled-shadow};
       --clr-forms-radio-focused-shadow: 0 0 #{$clr-outline-blur} #{$clr-outline-spread} #{$clr-outline-color};
 
       // Range

diff --git a/projects/angular/src/forms/styles/_radio.clarity.scss b/projects/angular/src/forms/styles/_radio.clarity.scss
@@ -67,7 +67,7 @@
       //background-color around the dot
       @include css-var(
         box-shadow,
-        $clr-forms-radio-disabled-shadow,
+        clr-forms-radio-disabled-shadow,
         $clr-forms-radio-disabled-shadow,
         $clr-use-custom-properties
       );
@@ -76,14 +76,14 @@
     input[type='radio']:checked:disabled + label::before {
       @include css-var(
         background-color,
-        $clr-forms-radio-disabled-background-color,
+        clr-forms-radio-disabled-background-color,
         $clr-forms-radio-disabled-background-color,
         $clr-use-custom-properties
       );
       //background-color around the dot
       @include css-var(
         box-shadow,
-        $clr-forms-radio-checked-disabled-shadow,
+        clr-forms-radio-checked-disabled-shadow,
         $clr-forms-radio-checked-disabled-shadow,
         $clr-use-custom-properties
       );