fix: Solved the problem that modifying the theme of code block not work

liuyib · Jan 14, 2020 · fc39088 · fc39088
1 parent 5f904fc
commit fc39088
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 23 deletions.
diff --git a/source/css/_common/components/highlight/diff.styl b/source/css/_common/components/highlight/diff.styl
@@ -1,12 +1,18 @@
 highlight_theme = hexo-config('highlight_theme');
 
 if (highlight_theme == 'light') {
-  $highlight-addition = #deffe7;
-  $highlight-deletion = #ffe8eb;
+  $highlight-addition-color    = #25a225;
+  $highlight-addition-bg-color = #f0fff4;
+  $highlight-deletion-color    = #dc4545;
+  $highlight-deletion-bg-color = #ffeef0;
 } else if (highlight_theme == 'dark') {
-  $highlight-addition = alpha(#00ff00, .2);
-  $highlight-deletion = alpha(#ff0000, .2);
+  $highlight-addition-color    = #25a225;
+  $highlight-addition-bg-color = transparent;
+  $highlight-deletion-color    = #dc4545;
+  $highlight-deletion-bg-color = transparent;
 } else if (highlight_theme == 'ocean') {
-  $highlight-addition = alpha(#9bb955, .4);
-  $highlight-deletion = alpha(#ff0000, .2);
+  $highlight-addition-color    = #25a225;
+  $highlight-addition-bg-color = transparent;
+  $highlight-deletion-color    = #dc4545;
+  $highlight-deletion-bg-color = transparent;
 }
diff --git a/source/css/_common/components/highlight/highlight.styl b/source/css/_common/components/highlight/highlight.styl
@@ -206,10 +206,30 @@ for lang in languages {
   color: $highlight-purple;
 }
 
-.diff .addition {
-  background-color: $highlight-addition;
+.diff {
+  .addition {
+    color: $highlight-addition-color;
+    background-color: $highlight-addition-bg-color;
+  }
+
+  .deletion {
+    color: $highlight-deletion-color;
+    background-color: $highlight-deletion-bg-color;
+  }
 }
 
-.diff .deletion {
-  background-color: $highlight-deletion;
+if (hexo-config('night_mode.enable')) {
+  .nightmode {
+    if (hexo-config('highlight_theme') == 'light') {
+      .diff {
+        .addition {
+          background-color: transparent;
+        }
+
+        .deletion {
+          background-color: transparent;
+        }
+      }
+    }
+  }
 }
diff --git a/source/css/_common/components/highlight/theme.styl b/source/css/_common/components/highlight/theme.styl
@@ -18,6 +18,18 @@ if (highlight_theme == 'light') {
   $highlight-aqua              = #39ADB5;
   $highlight-blue              = #6182B8;
   $highlight-purple            = #a626a4;
+
+  if (hexo-config('night_mode.enable')) {
+    $highlight-color             = var(--color-gray-800);
+    $highlight-background        = var(--color-gray-200);
+    $highlight-side-color        = var(--color-gray-600);
+    $highlight-side-bg-color     = var(--color-gray-250);
+    $highlight-header-color      = var(--color-gray-600);
+    $highlight-header-bg-color   = $highlight-side-bg-color;
+    $highlight-code-lang-color   = var(--color-gray-600);
+    $highlight-code-note-color   = $highlight-header-color;
+    $copy-button-color           = var(--color-gray-600);
+  }
 }
 
 if (highlight_theme == 'dark') {
@@ -53,21 +65,9 @@ if (highlight_theme == 'ocean') {
   $highlight-comment         = #65737e;
   $highlight-red             = #ec5f67;
   $highlight-orange          = #f99157;
-  $highlight-yellow          = gold;
+  $highlight-yellow          = #ffd700;
   $highlight-green           = #5fb3b3;
   $highlight-aqua            = #99c794;
   $highlight-blue            = #6699cc;
   $highlight-purple          = #c594c5;
 }
-
-if (hexo-config('night_mode.enable')) {
-  $highlight-color             = var(--color-gray-600);
-  $highlight-background        = var(--color-gray-150);
-  $highlight-side-color        = var(--color-gray-500);
-  $highlight-side-bg-color     = var(--color-gray-200);
-  $highlight-header-color      = var(--color-gray-400);
-  $highlight-header-bg-color   = $highlight-side-bg-color;
-  $highlight-code-lang-color   = var(--color-gray-600);
-  $highlight-code-note-color   = $highlight-header-color;
-  $copy-button-color           = var(--color-gray-600);
-}