🎨 移除代码高亮的冗余代码

Scarfwwz · Feb 10, 2022 · 919a3e3 · 919a3e3
1 parent e2128dc
commit 919a3e3
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 42 deletions.
diff --git a/layout/_partials/plugins/code-widget.ejs b/layout/_partials/plugins/code-widget.ejs
@@ -38,7 +38,7 @@ import_script(`<script>
         } else if ($pre.parent().hasClass('markdown-body') && $pre[0].classList.length === 0) {
           $pre.wrap('<div class="code-wrapper"></div>');
         }
-        lang = lang.toUpperCase().replace(/(LIVECODESERVER|NONE)/, CONFIG.code_language.default);
+        lang = lang.toUpperCase().replace('NONE', CONFIG.code_language.default);
       }
       $pre.append(copyTmpl.replace('LANG', lang).replace('code-widget">',
         getBgClass($pre[0]) + (enableCopy ? ' code-widget copy-btn" data-clipboard-snippet><i class="iconfont icon-copy"></i>' : ' code-widget">')));

diff --git a/scripts/events/lib/highlight.js b/scripts/events/lib/highlight.js
@@ -85,26 +85,27 @@ module.exports = (hexo) => {
     });
 
     hexo.extend.filter.register('after_post_render', (page) => {
-      page.content = page.content.replace(/(?<!<td class="code.*?">|<div class="code-wrapper">)(<pre.+?<\/pre>)/gims, (str, p1) => {
-        if (/<code[^>]+?mermaid[^>]+?>/ims.test(p1)) {
-          return str.replace(/(class=".*?)hljs(.*?")/gims, '$1$2');
-        }
-        return `<div class="code-wrapper">${p1}</div>`;
-      });
-
-      page.content = page.content.replace(/<pre><code>/gims, (str) => {
-        return '<pre><code class="hljs">';
-      });
-
       if (hexo.config.highlight.line_number) {
         page.content = page.content.replace(/<figure[^>]+?highlight.+?<td[^>]+?code[^>]+?>.*?(<pre.+?<\/pre>).+?<\/figure>/gims, (str, p1) => {
           if (/<code[^>]+?mermaid[^>]+?>/ims.test(p1)) {
             return p1.replace(/(class="[^>]*?)hljs([^>]*?")/gims, '$1$2').replace(/<br>/gims, '\n');
           }
           return str;
         });
+      } else {
+        page.content = page.content.replace(/(?<!<div class="code-wrapper">)<pre.+?<\/pre>/gims, (str) => {
+          if (/<code[^>]+?mermaid[^>]+?>/ims.test(str)) {
+            return str.replace(/(class=".*?)hljs(.*?")/gims, '$1$2');
+          }
+          return `<div class="code-wrapper">${str}</div>`;
+        });
       }
 
+      // 适配缩进型代码块
+      page.content = page.content.replace(/<pre><code>/gims, (str) => {
+        return '<pre><code class="hljs">';
+      });
+
       return page;
     });
   } else if (config.code.highlight.lib === 'prismjs') {
@@ -123,8 +124,8 @@ module.exports = (hexo) => {
     });
 
     hexo.extend.filter.register('after_post_render', (page) => {
-      page.content = page.content.replace(/(?<!<div class="code-wrapper">)(<pre.+?<\/pre>)/gims, (str, p1) => {
-        if (/<code[^>]+?mermaid[^>]+?>/ims.test(p1)) {
+      page.content = page.content.replace(/(?<!<div class="code-wrapper">)<pre.+?<\/pre>/gims, (str) => {
+        if (/<code[^>]+?mermaid[^>]+?>/ims.test(str)) {
           if (hexo.config.highlight.line_number) {
             str = str.replace(/<span[^>]+?line-numbers-rows[^>]+?>.+?<\/span><\/code>/, '</code>');
           }
@@ -133,9 +134,10 @@ module.exports = (hexo) => {
             .replace(/<span[^>]+?>(.+?)<\/span>/gims, '$1');
           return str;
         }
-        return `<div class="code-wrapper">${p1}</div>`;
+        return `<div class="code-wrapper">${str}</div>`;
       });
 
+      // 适配缩进型代码块
       page.content = page.content.replace(/<pre><code>/gims, (str) => {
         return '<pre class="language-none"><code class="language-none">';
       });

diff --git a/source/css/_pages/_base/rewrite.styl b/source/css/_pages/_base/rewrite.styl
@@ -183,6 +183,7 @@ label
     font-weight bold
 
   code
+    tab-size 4
     background-color var(--inlinecode-bg-color)
     transition background-color .2s ease-in-out
 
@@ -200,12 +201,6 @@ label
   pre
     font-size $code-font-size !important
 
-    code
-      overflow-x auto
-      line-height 1.5
-      border-radius 3px
-      tab-size 4
-
     .mermaid
       text-align center
 
@@ -217,7 +212,7 @@ label
     margin 1.5rem auto
     display block
     box-shadow $img-shadow
-    border-radius 3px
+    border-radius 4px
     background-color transparent
 
   blockquote
@@ -237,13 +232,6 @@ hr, .markdown-body hr
 // Rewrite highlight
 .markdown-body
 
-  pre
-    border-radius 3px
-
-  .hljs
-    overflow-x initial
-    padding 0
-
   hr
     height 0
     margin 2rem 0
@@ -260,9 +248,14 @@ hr, .markdown-body hr
     padding-bottom 1.45rem
     padding-right 1rem
 
-*:not(td) > .code-wrapper
-  position relative
-  border-radius 3px
+  .code-wrapper
+    position relative
+    border-radius 4px
+
+.markdown-body
+  .hljs, .highlight pre, .code-wrapper pre, figure.highlight td.gutter
+    transition color .2s ease-in-out, background-color .2s ease-in-out
+    background-color var(--highlight-bg-color)
 
 pre[class*=language-].line-numbers
   position initial
@@ -277,7 +270,7 @@ figure.highlight
     border 0
     margin 0
     width auto
-    border-radius 3px
+    border-radius 4px
 
   td
     border 0
@@ -297,11 +290,7 @@ figure.highlight
 
     pre
       text-align right
-      font-size 1px
-      overflow-x none
-      overflow-y none
       padding 0 .75rem
-      line-height 1.5
       border-radius initial
       border-right 1px solid #999
 
@@ -312,11 +301,6 @@ figure.highlight
     border-top-left-radius 0
     border-bottom-left-radius 0
 
-.markdown-body
-  .hljs, .highlight pre, pre, figure.highlight td.gutter
-    transition color .2s ease-in-out, background-color .2s ease-in-out
-    background-color var(--highlight-bg-color)
-
 // Rewrite mdb.css
 .list-group-item
   display flex