Support using highlight.js

_config.yml

@@ -346,9 +346,8 @@ custom_logo: #/uploads/custom-logo.jpg
 
 codeblock:
   # Code Highlight theme
-  # Available values: normal | night | night eighties | night blue | night bright | solarized | solarized dark | galactic
-  # See: https://github.com/chriskempson/tomorrow-theme
-  highlight_theme: normal
+  # See: https://github.com/highlightjs/highlight.js/tree/master/src/styles
+  highlight_theme: default
   # Add copy button on codeblock
   copy_button:
     enable: false

scripts/events/index.js

@@ -7,6 +7,8 @@ hexo.on('generateBefore', () => {
   require('./lib/config')(hexo);
   // Add filter type `theme_inject`
   require('./lib/injects')(hexo);
+  // Highlight
+  require('./lib/highlight')(hexo);
 });
 
 hexo.on('exit', () => {

scripts/events/lib/highlight.js

@@ -0,0 +1,28 @@
+const fs = require('fs');
+
+function parse(file) {
+  let css = fs.readFileSync(file).toString();
+  let rule = '';
+  let background = '';
+  let foreground = '';
+  css.replace(/\.hljs([^\S]+|,[^\{]+)\{(.*?)\}/sg, (match, $1, content) => {
+    rule += content;
+    return match;
+  });
+  rule.split('\n').forEach(line => {
+    if (line.includes('background:')) background = line.split('background:')[1];
+    else if (line.includes('background-color:')) background = line.split('background-color:')[1];
+    else if (line.includes('color:')) foreground = line.split('color:')[1];
+  });
+  return {
+    file,
+    background,
+    foreground
+  };
+}
+
+module.exports = hexo => {
+  hexo.config.highlight.hljs = false;
+  let file = `${hexo.plugin_dir}highlight.js/styles/${hexo.theme.config.codeblock.highlight_theme}.css`;
+  hexo.theme.config.highlight = parse(file);
+};

source/css/_common/scaffolding/highlight/copy-code.styl

@@ -35,7 +35,6 @@
 
 if (hexo-config('codeblock.copy_button.style') == 'mac') {
   .highlight {
-    background: #21252b;
     border-radius: 5px;
     box-shadow: 0 10px 30px 0 rgba(0, 0, 0, .4);
     padding-top: 30px;

source/css/_common/scaffolding/highlight/highlight.styl

@@ -1,8 +1,10 @@
-// https://github.com/chriskempson/tomorrow-theme
-$highlight-theme = hexo-config('codeblock.highlight_theme');
-
-@import 'theme';
-@import 'diff';
+@import hexo-config('highlight.file');
+$highlight-background = convert(hexo-config('highlight.background'));
+$highlight-foreground = convert(hexo-config('highlight.foreground'));
+$highlight-gutter     = {
+  color: mix($highlight-background, $highlight-foreground, 10%),
+  bg-color: mix($highlight-background, $highlight-foreground, 90%)
+};
 
 @import 'copy-code' if (hexo-config('codeblock.copy_button.enable'));
 
@@ -30,10 +32,6 @@ code {
   @extend $code-block;
   position: relative;
 
-  *::selection {
-    background: $highlight-selection;
-  }
-
   pre {
     border: 0;
     margin: 0;
@@ -108,45 +106,4 @@ pre {
     padding: 0;
     text-shadow: none;
   }
-  // For diff highlight
-  .deletion {
-    background: $highlight-deletion;
-  }
-
-  .addition {
-    background: $highlight-addition;
-  }
-
-  .meta {
-    color: $highlight-yellow;
-    disable-user-select();
-  }
-
-  .comment {
-    color: $highlight-comment;
-  }
-
-  .variable, .attribute, .tag, .name, .regexp, .ruby .constant, .xml .tag .title, .xml .pi, .xml .doctype, .html .doctype, .css .id, .css .class, .css .pseudo {
-    color: $highlight-red;
-  }
-
-  .number, .preprocessor, .built_in, .builtin-name, .literal, .params, .constant, .command {
-    color: $highlight-orange;
-  }
-
-  .ruby .class .title, .css .rules .attribute, .string, .symbol, .value, .inheritance, .header, .ruby .symbol, .xml .cdata, .special, .formula {
-    color: $highlight-green;
-  }
-
-  .title, .css .hexcolor {
-    color: $highlight-aqua;
-  }
-
-  .function, .python .decorator, .python .title, .ruby .function .title, .ruby .title .keyword, .perl .sub, .javascript .title, .coffeescript .title {
-    color: $highlight-blue;
-  }
-
-  .keyword, .javascript .function {
-    color: $highlight-purple;
-  }
 }

source/js/utils.js

@@ -64,6 +64,12 @@ NexT.utils = {
    */
   registerCopyCode: function() {
     document.querySelectorAll('figure.highlight').forEach(element => {
+      element.querySelectorAll('.code .line span').forEach(span => {
+        span.classList.forEach(name => {
+          span.classList.remove(name);
+          span.classList.add(`hljs-${name}`);
+        });
+      });
       element.insertAdjacentHTML('beforeend', '<div class="copy-btn"><i class="fa fa-clipboard fa-fw"></i></div>');
       const button = element.querySelector('.copy-btn');
       button.addEventListener('click', event => {