feat(styles, useAppInit, DisplaySettings): 更新导航栏背景色和列表项样式，优化透明窗口设置

- 在 color.scss 中添加 Windows 版本的导航栏背景色。
- 修改 useAppInit 钩子以支持 Windows 和 Mac 的背景色设置。
- 更新 MainSidebar 的悬停样式以使用新的背景色。
- 在 DisplaySettings 中简化透明窗口设置的显示逻辑。

src/renderer/src/assets/styles/color.scss

@@ -54,6 +54,7 @@
   --color-background-highlight-accent: rgba(255, 150, 50, 0.9);
 
   --navbar-background-mac: rgba(20, 20, 20, 0.55);
+  --navbar-background-win: rgba(20, 20, 20, 0.75);
   --navbar-background: #1f1f1f;
 
   --navbar-height: 42px;
@@ -121,8 +122,8 @@
   --color-reference-text: #000000;
   --color-reference-background: #f1f7ff;
 
-  --color-list-item: rgba(255, 255, 255, 0.9);
+  --color-list-item: rgba(0, 0, 0, 0.05);
-  --color-list-item-hover: rgba(255, 255, 255, 0.5);
+  --color-list-item-hover: rgba(0, 0, 0, 0.03);
 
   --modal-background: var(--color-white);
 
@@ -131,6 +132,7 @@
   --color-background-highlight-accent: rgba(255, 150, 50, 0.5);
 
   --navbar-background-mac: rgba(255, 255, 255, 0.55);
+  --navbar-background-win: rgba(255, 255, 255, 0.75);
   --navbar-background: rgba(244, 244, 244);
 
   --chat-background: transparent;
@@ -141,7 +143,13 @@
   --border-width: 0.5px;
 }
 
-[transparent-window='false'] {
+[transparent-window='true'] {
-  --color-list-item: var(--color-background-mute);
+  &[theme-mode='light'] {
-  --color-list-item-hover: var(--color-background-soft);
+    --color-list-item: rgba(255, 255, 255, 0.8);
+    --color-list-item-hover: rgba(255, 255, 255, 0.4);
+  }
+  &[theme-mode='dark'] {
+    --color-list-item: rgba(255, 255, 255, 0.1);
+    --color-list-item-hover: rgba(255, 255, 255, 0.05);
+  }
 }

src/renderer/src/hooks/useAppInit.ts

@@ -1,3 +1,4 @@
+import { isMac } from '@renderer/config/constant'
 import { isLocalAi } from '@renderer/config/env'
 import { useTheme } from '@renderer/context/ThemeProvider'
 import db from '@renderer/databases'
@@ -67,7 +68,11 @@ export function useAppInit() {
       return
     }
 
-    window.root.style.background = !minappShow ? 'var(--navbar-background-mac)' : 'var(--navbar-background)'
+    window.root.style.background = !minappShow
+      ? isMac
+        ? 'var(--navbar-background-mac)'
+        : 'var(--navbar-background-win)'
+      : 'var(--color-background)'
   }, [minappShow, theme])
 
   useEffect(() => {

src/renderer/src/pages/home/MainSidebar/MainSidebar.tsx

@@ -355,7 +355,7 @@ const Icon = styled.div<{ theme: string }>`
     height: 34px;
   }
   &:hover {
-    background-color: ${({ theme }) => (theme === 'dark' ? 'var(--color-black)' : 'var(--color-white)')};
+    background-color: var(--color-background-mute);
     opacity: 0.8;
     cursor: pointer;
     .icon {

src/renderer/src/pages/settings/DisplaySettings/DisplaySettings.tsx

@@ -1,7 +1,7 @@
 import { SyncOutlined } from '@ant-design/icons'
 import CodeEditor from '@renderer/components/CodeEditor'
 import { HStack } from '@renderer/components/Layout'
-import { isMac, THEME_COLOR_PRESETS } from '@renderer/config/constant'
+import { THEME_COLOR_PRESETS } from '@renderer/config/constant'
 import { useTheme } from '@renderer/context/ThemeProvider'
 import { useSettings } from '@renderer/hooks/useSettings'
 import useUserTheme from '@renderer/hooks/useUserTheme'
@@ -199,15 +199,11 @@ const DisplaySettings: FC = () => {
             />
           </HStack>
         </SettingRow>
-        {isMac && (
+        <SettingDivider />
-          <>
+        <SettingRow>
-            <SettingDivider />
+          <SettingRowTitle>{t('settings.theme.window.style.transparent')}</SettingRowTitle>
-            <SettingRow>
+          <Switch checked={transparentWindow} onChange={setTransparentWindow} />
-              <SettingRowTitle>{t('settings.theme.window.style.transparent')}</SettingRowTitle>
+        </SettingRow>
-              <Switch checked={transparentWindow} onChange={setTransparentWindow} />
-            </SettingRow>
-          </>
-        )}
       </SettingGroup>
       <SettingGroup theme={theme}>
         <SettingTitle>{t('settings.display.zoom.title')}</SettingTitle>