fix(styles): combobox option active icon color (#1642)

dequelabs · Aug 21, 2024 · 8cea852 · 8cea852
1 parent e00fe08
commit 8cea852
Show file tree

Hide file tree

Showing 6 changed files with 4 additions and 4 deletions.
diff --git a/e2e/screenshots/combobox-error-.png b/e2e/screenshots/combobox-error-.png
diff --git a/e2e/screenshots/combobox.png b/e2e/screenshots/combobox.png
diff --git a/e2e/screenshots/dark--combobox-error-.png b/e2e/screenshots/dark--combobox-error-.png
diff --git a/e2e/screenshots/dark--combobox.png b/e2e/screenshots/dark--combobox.png
diff --git a/packages/react/src/components/Combobox/screenshots.e2e.tsx b/packages/react/src/components/Combobox/screenshots.e2e.tsx
@@ -20,7 +20,7 @@ test('should have screenshot for Combobox', async ({ mount, page }) => {
         <ComboboxOption>Banana</ComboboxOption>
         <ComboboxOption>Cucumber</ComboboxOption>
       </Combobox>
-      <Combobox label="Focus">
+      <Combobox label="Focus" value="Apple">
         <ComboboxOption>Apple</ComboboxOption>
         <ComboboxOption>Banana</ComboboxOption>
         <ComboboxOption>Cucumber</ComboboxOption>
@@ -53,7 +53,7 @@ test('should have screenshot for Combobox[error]', async ({ mount, page }) => {
         <ComboboxOption>Banana</ComboboxOption>
         <ComboboxOption>Cucumber</ComboboxOption>
       </Combobox>
-      <Combobox label="Focus" error="This field has an error.">
+      <Combobox label="Focus" error="This field has an error." value="Apple">
         <ComboboxOption>Apple</ComboboxOption>
         <ComboboxOption>Banana</ComboboxOption>
         <ComboboxOption>Cucumber</ComboboxOption>

diff --git a/packages/styles/combobox.css b/packages/styles/combobox.css
@@ -8,7 +8,7 @@
   --combobox-option-min-height: 2.625rem;
   --combobox-group-label-background-color: var(--gray-20);
   --combobox-group-label-font-size: var(--text-size-smaller);
-  --combobox-option-selected-icon-color: var(--accent-success-dark);
+  --combobox-option-selected-icon-color: var(--accent-primary);
 }
 
 .cauldron--theme-dark {
@@ -17,7 +17,7 @@
   --combobox-option-description-font-color: var(--accent-light);
   --combobox-listbox-background-color: var(--accent-medium);
   --combobox-group-label-background-color: var(--accent-dark);
-  --combobox-option-selected-icon-color: var(--accent-success-light);
+  --combobox-option-selected-icon-color: var(--accent-info);
 }
 
 .Combobox :where(.TextFieldWrapper) {