fix(select-input): change selected item colors

atls · Jun 13, 2024 · c5ae6fe · c5ae6fe
1 parent c21581d
commit c5ae6fe
Show file tree

Hide file tree

Showing 4 changed files with 5 additions and 4 deletions.
diff --git a/ui/input/src/select-input/selected-item/selected-item.component.tsx b/ui/input/src/select-input/selected-item/selected-item.component.tsx
@@ -36,7 +36,7 @@ export const SelectedItem: FC<SelectedItemProps> = (selectedItemData) => {
 
   return (
     <SelectedItemBox onClick={(e) => handleDeleteSelectedItem(e, selectedItemData)}>
-      <RemoveIcon cursor='pointer' width={theme.spaces.micro} />
+      <RemoveIcon cursor='pointer' width={theme.spaces.micro} color={theme.colors.text.primary} />
       <Text fontSize='small.semiLarge' wordBreak='keep-all'>
         {primaryInfo}
       </Text>

diff --git a/ui/input/src/select-input/selected-item/selected-item.styles.ts b/ui/input/src/select-input/selected-item/selected-item.styles.ts
@@ -14,5 +14,5 @@ export const shapeSelectedItemBoxStyles: styleFn = ({ theme }) => ({
 })
 
 export const appearanceSelectedItemBoxStyles: styleFn = ({ theme }) => ({
-  backgroundColor: theme.colors.GRAY_300,
+  backgroundColor: theme.colors.selectInput.selectedItem,
 })
diff --git a/ui/theme/src/theme/colors_dark.ts b/ui/theme/src/theme/colors_dark.ts
@@ -149,6 +149,7 @@ const colors = {
     fontColor: WHITE,
   },
   selectInput: {
+    selectedItem: GRAY_1500,
     suggestedItemsContainer: GRAY_1000,
     suggestedItem: GRAY_1400,
   },
@@ -267,9 +268,8 @@ const colors = {
     },
     whiteBackgroundButton: {
       default: {
-        background: GRAY_1400,
+        background: GRAY_1600,
         font: 'rgb(0,0,0,1)',
-        color: WHITE,
         border: 'transparent',
       },
       hover: {

diff --git a/ui/theme/src/theme/colors_light.ts b/ui/theme/src/theme/colors_light.ts
@@ -150,6 +150,7 @@ const colors = {
     fontColor: GRAY_1600,
   },
   selectInput: {
+    selectedItem: GRAY_300,
     suggestedItemsContainer: BLUE_0,
     suggestedItem: WHITE,
   },