feat(theme): 添加暗色主题支持

- 新增暗色主题选项和系统主题自动适配功能
- 调整了部分样式以适应暗色主题

src/main/ControlWindow.ts

@@ -1,4 +1,4 @@
-import { shell, BrowserWindow, ipcMain } from 'electron'
+import { shell, BrowserWindow, ipcMain, nativeTheme } from 'electron'
 import path from 'path'
 import { is } from '@electron-toolkit/utils'
 import icon from '../../resources/icon.png?asset'
@@ -50,17 +50,37 @@ class ControlWindow {
   }
 
   public handleMessage() {
+    nativeTheme.on('updated', () => {
+      if(allConfig.uiTheme === 'system'){
+        if(nativeTheme.shouldUseDarkColors && this.window){
+          this.window.webContents.send('control.nativeTheme.change', 'dark')
+        }
+        else if(!nativeTheme.shouldUseDarkColors && this.window){
+          this.window.webContents.send('control.nativeTheme.change', 'light')
+        }
+      }
+    })
+
     ipcMain.handle('both.window.mounted', () => {
       return allConfig.getFullConfig()
     })
 
+    ipcMain.handle('control.nativeTheme.get', () => {
+      if(nativeTheme.shouldUseDarkColors) return 'dark'
+      return 'light'
+    })
+
     ipcMain.on('control.uiLanguage.change', (_, args) => {
       allConfig.uiLanguage = args
       if(captionWindow.window){
-        captionWindow.window.webContents.send('caption.uiLanguage.set', args)
+        captionWindow.window.webContents.send('control.uiLanguage.set', args)
       }
     })
 
+    ipcMain.on('control.uiTheme.change', (_, args) => {
+      allConfig.uiTheme = args
+    })
+
     ipcMain.on('control.leftBarWidth.change', (_, args) => {
       allConfig.leftBarWidth = args
     })

src/main/types/index.ts

@@ -1,5 +1,7 @@
 export type UILanguage =  "zh" | "en" | "ja"
 
+export type UITheme = "light" | "dark" | "system"
+
 export interface Controls {
   engineEnabled: boolean,
   sourceLang: string,
@@ -35,6 +37,7 @@ export interface CaptionItem {
 
 export interface FullConfig {
   uiLanguage: UILanguage,
+  uiTheme: UITheme,
   leftBarWidth: number,
   styles: Styles,
   controls: Controls,

src/main/utils/AllConfig.ts

@@ -1,6 +1,6 @@
 import {
-  UILanguage, Styles, CaptionItem, Controls,
-  FullConfig
+  UILanguage, UITheme, Styles, Controls,
+  CaptionItem, FullConfig
 } from '../types'
 import { app, BrowserWindow } from 'electron'
 import * as path from 'path'
@@ -35,6 +35,7 @@ const defaultControls: Controls = {
 class AllConfig {
   uiLanguage: UILanguage = 'zh';
   leftBarWidth: number = 8;
+  uiTheme: UITheme = 'system';
   styles: Styles = {...defaultStyles};
   controls: Controls = {...defaultControls};
   captionLog: CaptionItem[] = [];
@@ -46,6 +47,7 @@ class AllConfig {
     if(fs.existsSync(configPath)){
       const config = JSON.parse(fs.readFileSync(configPath, 'utf-8'))
       if(config.uiLanguage) this.uiLanguage = config.uiLanguage
+      if(config.uiTheme) this.uiTheme = config.uiTheme
       if(config.leftBarWidth) this.leftBarWidth = config.leftBarWidth
       if(config.styles) this.setStyles(config.styles)
       if(config.controls) this.setControls(config.controls)
@@ -56,6 +58,7 @@ class AllConfig {
   public writeConfig() {
     const config = {
       uiLanguage: this.uiLanguage,
+      uiTheme: this.uiTheme,
       leftBarWidth: this.leftBarWidth,
       controls: this.controls,
       styles: this.styles
@@ -68,6 +71,7 @@ class AllConfig {
   public getFullConfig(): FullConfig {
     return {
       uiLanguage: this.uiLanguage,
+      uiTheme: this.uiTheme,
       leftBarWidth: this.leftBarWidth,
       styles: this.styles,
       controls: this.controls,