From 1515788458ee65c8aab8ecfea929f2ae7051177a Mon Sep 17 00:00:00 2001
From: pompurin404 <pompurin404@mihomo.party>
Date: Tue, 3 Sep 2024 19:34:10 +0800
Subject: [PATCH] fix editor theme

---
 src/renderer/src/components/base/base-editor.tsx          | 6 +++---
 src/renderer/src/components/override/edit-file-modal.tsx  | 7 ++++---
 src/renderer/src/components/profiles/edit-file-modal.tsx  | 7 ++++---
 src/renderer/src/components/sider/config-viewer.tsx       | 6 +++---
 src/renderer/src/components/sysproxy/pac-editor-modal.tsx | 8 ++++----
 5 files changed, 18 insertions(+), 16 deletions(-)

diff --git a/src/renderer/src/components/base/base-editor.tsx b/src/renderer/src/components/base/base-editor.tsx
index 6339108..81ff8e5 100644
--- a/src/renderer/src/components/base/base-editor.tsx
+++ b/src/renderer/src/components/base/base-editor.tsx
@@ -39,8 +39,8 @@ const monacoInitialization = (): void => {
 }
 
 export const BaseEditor: React.FC<Props> = (props) => {
-  const { theme } = useTheme()
-
+  const { theme, systemTheme } = useTheme()
+  const trueTheme = theme === 'system' ? systemTheme : theme
   const { value, readOnly = false, language, onChange } = props
 
   const editorRef = useRef<monaco.editor.IStandaloneCodeEditor>()
@@ -73,7 +73,7 @@ export const BaseEditor: React.FC<Props> = (props) => {
       language={language}
       value={value}
       height="100%"
-      theme={theme?.includes('light') ? 'vs' : 'vs-dark'}
+      theme={trueTheme?.includes('light') ? 'vs' : 'vs-dark'}
       options={{
         tabSize: ['yaml', 'javascript', 'json'].includes(language) ? 2 : 4, // 根据语言类型设置缩进大小
         minimap: {
diff --git a/src/renderer/src/components/override/edit-file-modal.tsx b/src/renderer/src/components/override/edit-file-modal.tsx
index 558baa8..2599b7e 100644
--- a/src/renderer/src/components/override/edit-file-modal.tsx
+++ b/src/renderer/src/components/override/edit-file-modal.tsx
@@ -30,7 +30,7 @@ const EditFileModal: React.FC<Props> = (props) => {
       scrollBehavior="inside"
     >
       <ModalContent className="h-full w-[calc(100%-100px)]">
-        <ModalHeader className="flex">
+        <ModalHeader className="flex pb-0">
           编辑覆写{language === 'javascript' ? '脚本' : '配置'}
         </ModalHeader>
         <ModalBody className="h-full">
@@ -40,11 +40,12 @@ const EditFileModal: React.FC<Props> = (props) => {
             onChange={(value) => setCurrData(value)}
           />
         </ModalBody>
-        <ModalFooter>
-          <Button variant="light" onPress={onClose}>
+        <ModalFooter className="pt-0">
+          <Button size="sm" variant="light" onPress={onClose}>
             取消
           </Button>
           <Button
+            size="sm"
             color="primary"
             onPress={async () => {
               try {
diff --git a/src/renderer/src/components/profiles/edit-file-modal.tsx b/src/renderer/src/components/profiles/edit-file-modal.tsx
index 4e81f32..e580ce2 100644
--- a/src/renderer/src/components/profiles/edit-file-modal.tsx
+++ b/src/renderer/src/components/profiles/edit-file-modal.tsx
@@ -31,7 +31,7 @@ const EditFileModal: React.FC<Props> = (props) => {
       scrollBehavior="inside"
     >
       <ModalContent className="h-full w-[calc(100%-100px)]">
-        <ModalHeader className="flex">
+        <ModalHeader className="flex pb-0">
           <div className="flex justify-start">
             <div className="flex items-center">编辑订阅</div>
             <small className="ml-2 text-default-500">
@@ -53,11 +53,12 @@ const EditFileModal: React.FC<Props> = (props) => {
         <ModalBody className="h-full">
           <BaseEditor language="yaml" value={currData} onChange={(value) => setCurrData(value)} />
         </ModalBody>
-        <ModalFooter>
-          <Button variant="light" onPress={onClose}>
+        <ModalFooter className="pt-0">
+          <Button size="sm" variant="light" onPress={onClose}>
             取消
           </Button>
           <Button
+            size="sm"
             color="primary"
             onPress={async () => {
               await setProfileStr(id, currData)
diff --git a/src/renderer/src/components/sider/config-viewer.tsx b/src/renderer/src/components/sider/config-viewer.tsx
index 1572654..15d2ec8 100644
--- a/src/renderer/src/components/sider/config-viewer.tsx
+++ b/src/renderer/src/components/sider/config-viewer.tsx
@@ -28,12 +28,12 @@ const ConfigViewer: React.FC<Props> = (props) => {
       scrollBehavior="inside"
     >
       <ModalContent className="h-full w-[calc(100%-100px)]">
-        <ModalHeader className="flex">当前运行时配置</ModalHeader>
+        <ModalHeader className="flex pb-0">当前运行时配置</ModalHeader>
         <ModalBody className="h-full">
           <BaseEditor language="yaml" value={currData} readOnly={true} />
         </ModalBody>
-        <ModalFooter>
-          <Button variant="light" onPress={onClose}>
+        <ModalFooter className="pt-0">
+          <Button size="sm" variant="light" onPress={onClose}>
             关闭
           </Button>
         </ModalFooter>
diff --git a/src/renderer/src/components/sysproxy/pac-editor-modal.tsx b/src/renderer/src/components/sysproxy/pac-editor-modal.tsx
index a7eced2..153355a 100644
--- a/src/renderer/src/components/sysproxy/pac-editor-modal.tsx
+++ b/src/renderer/src/components/sysproxy/pac-editor-modal.tsx
@@ -21,7 +21,7 @@ const PacEditorViewer: React.FC<Props> = (props) => {
       scrollBehavior="inside"
     >
       <ModalContent className="h-full w-[calc(100%-100px)]">
-        <ModalHeader className="flex">编辑PAC脚本</ModalHeader>
+        <ModalHeader className="flex pb-0">编辑PAC脚本</ModalHeader>
         <ModalBody className="h-full">
           <BaseEditor
             language="javascript"
@@ -29,11 +29,11 @@ const PacEditorViewer: React.FC<Props> = (props) => {
             onChange={(value) => setCurrData(value || '')}
           />
         </ModalBody>
-        <ModalFooter>
-          <Button variant="light" onPress={onCancel}>
+        <ModalFooter className="pt-0">
+          <Button size="sm" variant="light" onPress={onCancel}>
             取消
           </Button>
-          <Button color="primary" onPress={() => onConfirm(currData)}>
+          <Button size="sm" color="primary" onPress={() => onConfirm(currData)}>
             确认
           </Button>
         </ModalFooter>