fix: #1193 correct clear button color in sd-icon and sd-select (#1217)

solid-design-system · Jul 30, 2024 · 0fa1fd2 · 0fa1fd2
1 parent c49729c
commit 0fa1fd2
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 5 deletions.
diff --git a/packages/components/src/components/input/input.ts b/packages/components/src/components/input/input.ts
@@ -454,10 +454,10 @@ export default class SdInput extends SolidElement implements SolidFormControl {
       disabled: 'text-neutral-500',
       readonly: 'text-black',
       activeInvalid: 'text-error',
-      activeValid: 'text-success',
+      activeValid: 'text-black',
       active: 'text-black',
       invalid: 'text-error',
-      valid: 'text-success',
+      valid: 'text-black',
       default: 'text-black'
     }[inputState];
 
@@ -554,7 +554,6 @@ export default class SdInput extends SolidElement implements SolidFormControl {
               @focus=${this.handleFocus}
               @blur=${this.handleBlur}
             />
-            <!-- TODO: substitute text-neutral-400 for text-neutral-500 when available! -->
             ${hasClearIcon
               ? html`
                   <button
@@ -567,7 +566,7 @@ export default class SdInput extends SolidElement implements SolidFormControl {
                   >
                     <slot name="clear-icon">
                       <sd-icon
-                        class=${cx('text-neutral-500', iconSize)}
+                        class=${cx('icon-fill-neutral-800', iconSize)}
                         library="system"
                         name="closing-round"
                       ></sd-icon>

diff --git a/packages/components/src/components/select/select.ts b/packages/components/src/components/select/select.ts
@@ -967,7 +967,7 @@ export default class SdSelect extends SolidElement implements SolidFormControl {
                     >
                       <slot name="clear-icon">
                         <sd-icon
-                          class=${cx('text-neutral-500', iconSize)}
+                          class=${cx('text-icon-fill-neutral-800', iconSize)}
                           library="system"
                           name="closing-round"
                         ></sd-icon>