diff --git a/src/renderer/src/assets/styles/color.scss b/src/renderer/src/assets/styles/color.scss
index 829c58c146..2e90b5a1aa 100644
--- a/src/renderer/src/assets/styles/color.scss
+++ b/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-hover: rgba(255, 255, 255, 0.5);
+ --color-list-item: rgba(0, 0, 0, 0.05);
+ --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'] {
- --color-list-item: var(--color-background-mute);
- --color-list-item-hover: var(--color-background-soft);
+[transparent-window='true'] {
+ &[theme-mode='light'] {
+ --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);
+ }
}
diff --git a/src/renderer/src/hooks/useAppInit.ts b/src/renderer/src/hooks/useAppInit.ts
index d068197f91..3eea2e73c6 100644
--- a/src/renderer/src/hooks/useAppInit.ts
+++ b/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(() => {
diff --git a/src/renderer/src/pages/home/MainSidebar/MainSidebar.tsx b/src/renderer/src/pages/home/MainSidebar/MainSidebar.tsx
index 5e3f313580..93782fa5db 100644
--- a/src/renderer/src/pages/home/MainSidebar/MainSidebar.tsx
+++ b/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 {
diff --git a/src/renderer/src/pages/settings/DisplaySettings/DisplaySettings.tsx b/src/renderer/src/pages/settings/DisplaySettings/DisplaySettings.tsx
index 74863ec0e7..ae57225b77 100644
--- a/src/renderer/src/pages/settings/DisplaySettings/DisplaySettings.tsx
+++ b/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 = () => {
/>
- {isMac && (
- <>
-
-
- {t('settings.theme.window.style.transparent')}
-
-
- >
- )}
+
+
+ {t('settings.theme.window.style.transparent')}
+
+
{t('settings.display.zoom.title')}