diff --git a/src/main/utils/init.ts b/src/main/utils/init.ts index db599ef..13ec1ab 100644 --- a/src/main/utils/init.ts +++ b/src/main/utils/init.ts @@ -141,6 +141,7 @@ async function migration(): Promise { 'log', 'substore' ], + appTheme = 'system', useSubStore = true } = await getAppConfig() const { @@ -174,6 +175,10 @@ async function migration(): Promise { if (!lanDisallowedIps) { await patchControledMihomoConfig({ 'lan-disallowed-ips': [] }) } + // remove custom app theme + if (!['system', 'light', 'dark'].includes(appTheme)) { + await patchAppConfig({ appTheme: 'system' }) + } } function initDeeplink(): void { diff --git a/src/renderer/src/App.tsx b/src/renderer/src/App.tsx index 932e2a5..5d83827 100644 --- a/src/renderer/src/App.tsx +++ b/src/renderer/src/App.tsx @@ -82,18 +82,11 @@ const App: React.FC = () => { useEffect(() => { if (!injectCSS) return console.log('injectCSS', injectCSS) - // window.electron.webFrame.insertCSS(injectCSS) insertCSS(injectCSS) }, [injectCSS]) useEffect(() => { - if (appTheme.includes('light')) { - setNativeTheme('light') - } else if (appTheme === 'system') { - setNativeTheme('system') - } else { - setNativeTheme('dark') - } + setNativeTheme(appTheme) setTheme(appTheme) if (!useWindowFrame) { const options = { height: 48 } as TitleBarOverlayOptions diff --git a/src/renderer/src/components/settings/general-config.tsx b/src/renderer/src/components/settings/general-config.tsx index 605dfbe..05048a2 100644 --- a/src/renderer/src/components/settings/general-config.tsx +++ b/src/renderer/src/components/settings/general-config.tsx @@ -1,4 +1,4 @@ -import React, { Key, useState } from 'react' +import React, { useState } from 'react' import SettingCard from '../base/base-setting-card' import SettingItem from '../base/base-setting-item' import { Button, Input, Select, SelectItem, Switch, Tab, Tabs, Tooltip } from '@nextui-org/react' @@ -37,30 +37,6 @@ const GeneralConfig: React.FC = () => { appTheme = 'system' } = appConfig || {} - const onThemeChange = (key: Key, type: 'theme' | 'color'): void => { - const [theme, color] = appTheme.split('-') - - if (type === 'theme') { - let themeStr = key.toString() - if (key !== 'system') { - if (color) { - themeStr += `-${color}` - } - } - setTheme(themeStr) - patchAppConfig({ appTheme: themeStr as AppTheme }) - } else { - let themeStr = theme - if (theme !== 'system') { - if (key !== 'blue') { - themeStr += `-${key}` - } - setTheme(themeStr) - patchAppConfig({ appTheme: themeStr as AppTheme }) - } - } - } - return ( <> {openCSSEditor && ( @@ -223,37 +199,21 @@ const GeneralConfig: React.FC = () => { 编辑 CSS 样式 - + { - onThemeChange(key, 'theme') + setTheme(key.toString()) + patchAppConfig({ appTheme: key as AppTheme }) }} > - - {appTheme !== 'system' && ( - - { - onThemeChange(key, 'color') - }} - > - - - - - - )} ) diff --git a/src/renderer/src/components/sider/conn-card.tsx b/src/renderer/src/components/sider/conn-card.tsx index 11bb8b3..95a6643 100644 --- a/src/renderer/src/components/sider/conn-card.tsx +++ b/src/renderer/src/components/sider/conn-card.tsx @@ -38,7 +38,11 @@ const ConnCard: React.FC = () => { const [series, setSeries] = useState(Array(10).fill(0)) const chartColor = useMemo(() => { const islight = theme === 'system' ? systemTheme === 'light' : theme.includes('light') - return match ? 'rgba(255,255,255)' : islight ? 'rgba(0,0,0' : 'rgba(255,255,255)' + return match + ? 'rgba(255,255,255)' + : islight + ? window.getComputedStyle(document.documentElement).color + : 'rgb(255,255,255)' }, [theme, systemTheme, match]) const transform = tf ? { x: tf.x, y: tf.y, scaleX: 1, scaleY: 1 } : null diff --git a/src/renderer/src/main.tsx b/src/renderer/src/main.tsx index 68a3601..2be14e3 100644 --- a/src/renderer/src/main.tsx +++ b/src/renderer/src/main.tsx @@ -43,22 +43,7 @@ init().then(() => { ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render( - + diff --git a/src/shared/types.d.ts b/src/shared/types.d.ts index 1ac1893..198a70d 100644 --- a/src/shared/types.d.ts +++ b/src/shared/types.d.ts @@ -2,17 +2,7 @@ type OutboundMode = 'rule' | 'global' | 'direct' type LogLevel = 'info' | 'debug' | 'warning' | 'error' | 'silent' type SysProxyMode = 'auto' | 'manual' type CardStatus = 'col-span-2' | 'col-span-1' | 'hidden' -type AppTheme = - | 'system' - | 'light' - | 'dark' - | 'gray' - | 'light-pink' - | 'dark-pink' - | 'gray-pink' - | 'light-green' - | 'dark-green' - | 'gray-green' +type AppTheme = 'system' | 'light' | 'dark' type MihomoGroupType = 'Selector' | 'URLTest' | 'LoadBalance' | 'Relay' type MihomoProxyType = | 'Direct' diff --git a/tailwind.config.js b/tailwind.config.js index ad51762..ac1ec3b 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -10,96 +10,5 @@ module.exports = { extend: {} }, darkMode: 'class', - plugins: [ - nextui({ - themes: { - gray: { - extend: 'dark', - colors: { - background: '#18181b', - content1: '#27272a', - content2: '#3f3f46', - content3: '#52525b', - default: { - DEFAULT: '#52525b', - 50: '#27272a', - 100: '#3f3f46', - 200: '#52525b', - 300: '#71717a', - 400: '#a1a1aa' - } - } - }, - 'light-pink': { - extend: 'light', - colors: { - primary: '#ED9CC2', - secondary: '#71CCAA' - } - }, - 'dark-pink': { - extend: 'dark', - colors: { - primary: '#ED9CC2', - secondary: '#71CCAA' - } - }, - 'gray-pink': { - extend: 'dark', - colors: { - background: '#18181b', - content1: '#27272a', - content2: '#3f3f46', - content3: '#52525b', - default: { - DEFAULT: '#52525b', - 50: '#27272a', - 100: '#3f3f46', - 200: '#52525b', - 300: '#71717a', - 400: '#a1a1aa' - }, - primary: '#ED9CC2', - secondary: '#71CCAA' - } - }, - 'light-green': { - extend: 'light', - colors: { - primary: '#71CCAA', - secondary: '#ED9CC2', - danger: '#ED9CC2' - } - }, - 'dark-green': { - extend: 'dark', - colors: { - primary: '#71CCAA', - secondary: '#ED9CC2', - danger: '#ED9CC2' - } - }, - 'gray-green': { - extend: 'dark', - colors: { - background: '#18181b', - content1: '#27272a', - content2: '#3f3f46', - content3: '#52525b', - default: { - DEFAULT: '#52525b', - 50: '#27272a', - 100: '#3f3f46', - 200: '#52525b', - 300: '#71717a', - 400: '#a1a1aa' - }, - primary: '#71CCAA', - secondary: '#ED9CC2', - danger: '#ED9CC2' - } - } - } - }) - ] + plugins: [nextui()] }