From 3544c40d9a69eea0fe544545a6cd2fbd76b3f344 Mon Sep 17 00:00:00 2001
From: Teo <cheesen.xu@gmail.com>
Date: Sat, 14 Jun 2025 00:41:02 +0800
Subject: [PATCH] feat(TranslatePage, ant.scss): add ChevronDown icon to select
 components and update dropdown styles

- Introduced ChevronDown icon to various Select components in TranslatePage for improved visual consistency.
- Updated ant.scss to add a border style to the select dropdown for enhanced UI clarity.
---
 src/renderer/src/assets/styles/ant.scss            | 3 +++
 src/renderer/src/pages/translate/TranslatePage.tsx | 7 ++++++-
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/renderer/src/assets/styles/ant.scss b/src/renderer/src/assets/styles/ant.scss
index 32c2332098..fe31adc5ad 100644
--- a/src/renderer/src/assets/styles/ant.scss
+++ b/src/renderer/src/assets/styles/ant.scss
@@ -215,6 +215,9 @@
     border: none;
   }
 }
+.ant-select-dropdown {
+  border: 0.5px solid var(--color-border);
+}
 
 .ant-popover {
   .ant-popover-inner {
diff --git a/src/renderer/src/pages/translate/TranslatePage.tsx b/src/renderer/src/pages/translate/TranslatePage.tsx
index e7b1a7beba..973f0b5925 100644
--- a/src/renderer/src/pages/translate/TranslatePage.tsx
+++ b/src/renderer/src/pages/translate/TranslatePage.tsx
@@ -23,7 +23,7 @@ import TextArea, { TextAreaRef } from 'antd/es/input/TextArea'
 import dayjs from 'dayjs'
 import { useLiveQuery } from 'dexie-react-hooks'
 import { find, isEmpty, sortBy } from 'lodash'
-import { HelpCircle, Settings2, TriangleAlert } from 'lucide-react'
+import { ChevronDown, HelpCircle, Settings2, TriangleAlert } from 'lucide-react'
 import { FC, useEffect, useMemo, useRef, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import styled from 'styled-components'
@@ -120,6 +120,7 @@ const TranslateSettings: FC<{
               }}
               options={selectOptions}
               showSearch
+              suffixIcon={<ChevronDown strokeWidth={1.5} size={16} color="var(--color-text-3)" />}
             />
           </HStack>
           {!translateModel && (
@@ -174,6 +175,7 @@ const TranslateSettings: FC<{
                       </Space.Compact>
                     )
                   }))}
+                  suffixIcon={<ChevronDown strokeWidth={1.5} size={16} color="var(--color-text-3)" />}
                 />
                 <span>⇆</span>
                 <Select
@@ -191,6 +193,7 @@ const TranslateSettings: FC<{
                       </Space.Compact>
                     )
                   }))}
+                  suffixIcon={<ChevronDown strokeWidth={1.5} size={16} color="var(--color-text-3)" />}
                 />
               </Flex>
             )}
@@ -433,6 +436,7 @@ const TranslatePage: FC = () => {
             </Space.Compact>
           )
         }))}
+        suffixIcon={<ChevronDown strokeWidth={1.5} size={16} color="var(--color-text-3)" />}
       />
     )
   }
@@ -529,6 +533,7 @@ const TranslatePage: FC = () => {
                     )
                   }))
                 ]}
+                suffixIcon={<ChevronDown strokeWidth={1.5} size={16} color="var(--color-text-3)" />}
               />
               <Button
                 type="text"