From 04977374f0cc6c3fb51d19c70b6360dc16ee7141 Mon Sep 17 00:00:00 2001
From: Mivinci <1366723936@qq.com>
Date: Thu, 10 Nov 2022 16:00:20 +0800
Subject: [PATCH] code highlighting colors vary with theme

---
 assets/css/syntax.scss | 28 ++++++++++++++--------------
 assets/css/theme.scss  | 26 ++++++++++++++++++++++++--
 2 files changed, 38 insertions(+), 16 deletions(-)

diff --git a/assets/css/syntax.scss b/assets/css/syntax.scss
index dc1cc99..97de9df 100644
--- a/assets/css/syntax.scss
+++ b/assets/css/syntax.scss
@@ -1,11 +1,11 @@
 .chroma {
   margin: .5em 0;
-  background-color: #222222;
+  background-color: var(--code-back);
   border-radius: 2px;
 }
 
 .chroma code {
-  color: #d4d4d4;
+  color: var(--code-text);
 }
 
 /* LineTableTD */
@@ -32,7 +32,7 @@
 
 /* LineNumbersTable */
 .chroma .lnt {
-  color: #999;
+  color: var(--code-line-number);
   padding-left: .9em;
   padding-right: 1em;
   text-align: right;
@@ -51,11 +51,11 @@
 // .chroma .kt,
 .chroma .k,
 .chroma .si {
-  color: #569cd6;
+  color: var(--code-keyword);
 }
 
 .chroma .na {
-  color: #9cdcfe;
+  color: var(--code-attribute);
 }
 
 // .chroma .n,
@@ -70,7 +70,7 @@
 .chroma .fm,
 .chroma .nl,
 .chroma .nn {
-  color: #569cd6;
+  color: var(--code-keyword);
 }
 
 /* NameProperty */
@@ -81,7 +81,7 @@
 .chroma .vg,
 .chroma .vi,
 .chroma .vm {
-  color: #569cd6;
+  color: var(--code-keyword);
 }
 
 /* LiteralString */
@@ -99,7 +99,7 @@
 .chroma .s1,
 .chroma .ss,
 .chroma .cpf {
-  color: #ce9178;
+  color: var(--code-literal-string);
 }
 
 /* LiteralNumber */
@@ -110,7 +110,7 @@
 .chroma .mi,
 .chroma .il,
 .chroma .mo {
-  color: #b5cea8;
+  color: var(--code-literal-number);
 }
 
 /* Comment */
@@ -119,25 +119,25 @@
 .chroma .cm,
 .chroma .c1,
 .chroma .cs {
-  color: #517043;
+  color: var(--code-comment);
 }
 
 .chroma .nb,
 .chroma .kt {
-  color: #4ec9b0;
+  color: var(--code-builtin-type);
 }
 
 .chroma .fm,
 .chroma .nf {
-  color: #dcdcaa;
+  color: var(--code-function);
 }
 
 
 .chroma .cp {
-  color: #c586c0;
+  color: var(--code-meta);
 }
 
 .chroma .hl {
   display: block;
-  background-color: #585858;
+  background-color: var(--code-highlighted-line);
 }
\ No newline at end of file
diff --git a/assets/css/theme.scss b/assets/css/theme.scss
index 8d92649..aaa09e5 100644
--- a/assets/css/theme.scss
+++ b/assets/css/theme.scss
@@ -3,9 +3,20 @@
   --grid: #e1e1e1;
   --back: #fff;
   --text: #222;
-  --code-back: #fff;
 
   // code highlighting
+  --code-back: #f6f8fa;
+  --code-text: #24292f;
+  --code-line-number: #999;
+  --code-keyword: #cf222e;
+  --code-attribute: #0550ae;
+  --code-literal-string: #0a3069;
+  --code-literal-number: #b5cea8;
+  --code-comment: #6e7781;
+  --code-builtin-type: #cf222e;
+  --code-function: #0550ae;
+  --code-meta: #cf222e;
+  --code-highlighted-line: #e9e9e9;
 }
 
 .dark {
@@ -13,7 +24,18 @@
   --back: #181818;
   --text: silver;
   --grid: #555;
-  --code-back: #222;
 
   // code highlighting
+  --code-back: #1d1d1d;
+  --code-text: #d4d4d4cc;
+  --code-line-number: #999999ca;
+  --code-keyword: #569cd6cb;
+  --code-attribute: #9cdcfecb;
+  --code-literal-string: #ce9178;
+  --code-literal-number: #b5cea8;
+  --code-comment: #517043d5;
+  --code-builtin-type: #4ec9b0cb;
+  --code-function: #dcdcaaca;
+  --code-meta: #c586c0cb;
+  --code-highlighted-line: #9494951b;
 }
\ No newline at end of file