From 881e0b4713059933e12f92a7d62bb27a0a2edac0 Mon Sep 17 00:00:00 2001
From: Teo <cheesen.xu@gmail.com>
Date: Wed, 11 Jun 2025 14:23:17 +0800
Subject: [PATCH] refactor(Selector): update LabelIcon styles for improved
 hover effects and background consistency

---
 src/renderer/src/components/Selector.tsx | 19 +++++++++++++------
 1 file changed, 13 insertions(+), 6 deletions(-)

diff --git a/src/renderer/src/components/Selector.tsx b/src/renderer/src/components/Selector.tsx
index 860750b94a..c48d600dc5 100644
--- a/src/renderer/src/components/Selector.tsx
+++ b/src/renderer/src/components/Selector.tsx
@@ -61,6 +61,13 @@ const Selector = <V extends string | number>({
   )
 }
 
+const LabelIcon = styled(ChevronsUpDown)`
+  border-radius: 4px;
+  padding: 2px 0;
+  background-color: var(--color-background-soft);
+  transition: background-color 0.2s;
+`
+
 const Label = styled.div<{ $size: number; $open: boolean }>`
   display: flex;
   align-items: center;
@@ -72,20 +79,20 @@ const Label = styled.div<{ $size: number; $open: boolean }>`
   transition: background-color 0.2s;
   &:hover {
     background-color: var(--color-background-mute);
+    ${LabelIcon} {
+      background-color: var(--color-background-mute);
+    }
   }
   ${({ $open }) =>
     $open &&
     css`
       background-color: var(--color-background-mute);
+      ${LabelIcon} {
+        background-color: var(--color-background-mute);
+      }
     `}
 `
 
-const LabelIcon = styled(ChevronsUpDown)`
-  border-radius: 4px;
-  padding: 2px 0;
-  background-color: var(--color-background-mute);
-`
-
 const CheckIcon = styled.div`
   width: 20px;
   display: flex;