From 6515478ea88f96322445a6761023f543b9e3d0ee Mon Sep 17 00:00:00 2001
From: cweijan <cweijan@163.com>
Date: Tue, 5 Mar 2024 03:07:52 +0800
Subject: [PATCH] Add dark theme.

---
 resource/vditor/css/base.css              | 19 -------------------
 resource/vditor/css/theme/Dracula.css     | 11 +++++++++++
 resource/vditor/css/theme/Github Dark.css | 11 +++++++++++
 src/provider/markdownEditorProvider.ts    |  7 +++++--
 4 files changed, 27 insertions(+), 21 deletions(-)
 create mode 100644 resource/vditor/css/theme/Dracula.css
 create mode 100644 resource/vditor/css/theme/Github Dark.css

diff --git a/resource/vditor/css/base.css b/resource/vditor/css/base.css
index 203bc79..9b9b69b 100644
--- a/resource/vditor/css/base.css
+++ b/resource/vditor/css/base.css
@@ -38,10 +38,6 @@
     color: var(--front-color) !important;
 }
 
-body[data-vscode-theme-name='One Dark Modern Classic'] .vditor-content code:not(.hljs) {
-    color: #abb2bf !important;
-}
-
 /* 编辑模式 */
 body[data-vscode-theme-kind="vscode-dark"] .vditor-content .vditor-wysiwyg__pre>code {
     background-color: #313131 !important;
@@ -62,21 +58,6 @@ body[data-vscode-theme-kind="vscode-dark"] .vditor-content .vditor-wysiwyg__prev
     background-color: #2E2E2E !important;
 }
 
-body[data-vscode-theme-name='One Dark Modern Classic'] .vditor-toolbar {
-    background-color: var(--second-bg-color) !important;
-}
-
-body[data-vscode-theme-name='One Dark Modern Classic'] .vditor {
-    background-color: var(--second-bg-color) !important;
-}
-
-body[data-vscode-theme-name='One Dark Modern Classic'] .vditor-content,
-body[data-vscode-theme-name='One Dark Modern Classic'] .vditor-content *:not(.hljs, .hljs *, .katex, .katex *, a, hr, .vditor-reset--error,code) {
-    background-color: var(--second-bg-color) !important;
-    color: #abb2bf !important;
-}
-
-
 .vditor,
 .vditor-content,
 .vditor-content *:not(.hljs, .hljs *, .katex, .katex *, a, hr, .vditor-reset--error,code) {
diff --git a/resource/vditor/css/theme/Dracula.css b/resource/vditor/css/theme/Dracula.css
new file mode 100644
index 0000000..07b2f95
--- /dev/null
+++ b/resource/vditor/css/theme/Dracula.css
@@ -0,0 +1,11 @@
+:root {
+    --hr-bg: #bd93f9;
+    --ext-border-color: rgba(255, 255, 255, 0.1);
+    --bg-color:  #282a36;
+    --front-color: #f8f8f2;
+    --second-bg-color:#21222c;
+    --code-bg-color:  #222222;
+    --list-hover-color:#bd93f9;
+    --dropdown-hover-background: #44475a;
+    --error-color: #ff5555;
+}
\ No newline at end of file
diff --git a/resource/vditor/css/theme/Github Dark.css b/resource/vditor/css/theme/Github Dark.css
new file mode 100644
index 0000000..1f73373
--- /dev/null
+++ b/resource/vditor/css/theme/Github Dark.css	
@@ -0,0 +1,11 @@
+:root {
+    --hr-bg: #444c56;
+    --ext-border-color: rgba(255, 255, 255, 0.1);
+    --bg-color: #22272e;
+    --front-color: #adbac7;
+    --second-bg-color: #2d333b;
+    --code-bg-color: #1c2128;
+    --list-hover-color: #539bf5;
+    --dropdown-hover-background: rgba(99, 110, 123, 0.4);
+    --error-color: #f14c4c;
+}
\ No newline at end of file
diff --git a/src/provider/markdownEditorProvider.ts b/src/provider/markdownEditorProvider.ts
index a4b5345..1a88c6a 100644
--- a/src/provider/markdownEditorProvider.ts
+++ b/src/provider/markdownEditorProvider.ts
@@ -116,9 +116,12 @@ export class MarkdownEditorProvider implements vscode.CustomTextEditorProvider {
             new MarkdownService(this.context).exportMarkdown(uri, option)
         }).on("theme", async (theme) => {
             if (!theme) {
-                const themes = ["Auto", "Light", "Solarized"]
+                const themes = ["Auto", "|", "Light", "Solarized", "|", "Dracula", "Github Dark"]
                 const editorTheme = Global.getConfig('editorTheme');
-                const themeItems: vscode.QuickPickItem[] = themes.map(theme => ({ label: theme, description: theme == editorTheme ? 'Current' : undefined }))
+                const themeItems: vscode.QuickPickItem[] = themes.map(theme => {
+                    if (theme == '|') return { label: '|', kind: vscode.QuickPickItemKind.Separator }
+                    return { label: theme, description: theme == editorTheme ? 'Current' : undefined }
+                })
                 theme = await vscode.window.showQuickPick(themeItems, { placeHolder: "Select Editor Theme" });
                 if (!theme) return
             }