Merge pull request #301 from chengzhongxue/main

内置代码块

settings.yaml

@@ -1724,6 +1724,251 @@ spec:
           label: 全局字体
           placeholder: '"PingFang SC", "Hiragino Sans GB", "Microsoft YaHei"'
 
+    - group: code
+      label: 代码块
+      formSchema:
+        - $formkit: radio
+          name: enable
+          id: enable
+          key: enable
+          label: 启用代码块
+          help: 如果安装代码块插件，可关闭此功能
+          value: true
+          options:
+            - label: 启用
+              value: true
+            - label: 禁用
+              value: false
+        - $formkit: radio
+          name: enable_title
+          if: $get(enable).value
+          label: 启用代码标题
+          help: 启用代码块的标题，默认显示语言类型，也可自定义标题
+          value: true
+          options:
+            - label: 启用
+              value: true
+            - label: 禁用
+              value: false
+        - $formkit: radio
+          name: enable_hr
+          if: $get(enable).value
+          label: 启用代码标题分割线
+          help: 启用代码标题和内容之间的分割线，不展示时会更加简洁
+          value: true
+          options:
+            - label: 启用
+              value: true
+            - label: 禁用
+              value: false
+        - $formkit: radio
+          name: enable_line
+          if: $get(enable).value
+          label: 启用代码行号
+          help: 启用代码块行号功能
+          value: true
+          options:
+            - label: 启用
+              value: true
+            - label: 禁用
+              value: false
+        - $formkit: radio
+          name: enable_copy
+          if: $get(enable).value
+          label: 启用代码复制
+          help: 启用代码块复制按钮
+          value: true
+          options:
+            - label: 启用
+              value: true
+            - label: 禁用
+              value: false
+        - $formkit: radio
+          name: enable_expander
+          if: $get(enable).value
+          label: 启用代码折叠
+          help: 启用代码折叠功能
+          value: true
+          options:
+            - label: 启用
+              value: true
+            - label: 禁用
+              value: false
+        - $formkit: radio
+          name: enable_height_limit
+          id: enable_height_limit
+          key: enable_height_limit
+          if: $get(enable).value
+          label: 启用代码高度限制
+          help: 启用代码高度限制功能
+          value: false
+          options:
+            - label: 启用
+              value: true
+            - label: 禁用
+              value: false
+        - $formkit: number
+          name: height_limit
+          if: $get(enable_height_limit).value
+          value: 300
+          label: 代码高度限制
+        - $formkit: select
+          name: theme_light
+          if: $get(enable).value
+          label: 代码块主题（浅色）随着系统主题变化
+          value: one-light
+          options:
+            - value: "one-dark"
+              label: "one-dark"
+            - value: "one-light"
+              label: "one-light"
+            - value: "a11y-dark"
+              label: "a11y-dark"
+            - value: "atom-dark"
+              label: "atom-dark"
+            - value: "base16-ateliersulphurpool.light"
+              label: "base16-ateliersulphurpool.light"
+            - value: "cb"
+              label: "cb"
+            - value: "coldark-cold"
+              label: "coldark-cold"
+            - value: "coldark-dark"
+              label: "coldark-dark"
+            - value: "coy-without-shadows"
+              label: "coy-without-shadows"
+            - value: "darcula"
+              label: "darcula"
+            - value: "dracula"
+              label: "dracula"
+            - value: "duotone-dark"
+              label: "duotone-dark"
+            - value: "duotone-earth"
+              label: "duotone-earth"
+            - value: "duotone-forest"
+              label: "duotone-forest"
+            - value: "duotone-light"
+              label: "duotone-light"
+            - value: "duotone-sea"
+              label: "duotone-sea"
+            - value: "duotone-space"
+              label: "duotone-space"
+            - value: "ghcolors"
+              label: "ghcolors"
+            - value: "gruvbox-dark"
+              label: "gruvbox-dark"
+            - value: "gruvbox-light"
+              label: "gruvbox-light"
+            - value: "holi-theme"
+              label: "holi-theme"
+            - value: "hopscotch"
+              label: "hopscotch"
+            - value: "lucario"
+              label: "lucario"
+            - value: "material-dark"
+              label: "material-dark"
+            - value: "material-light"
+              label: "material-light"
+            - value: "material-oceanic"
+              label: "material-oceanic"
+            - value: "night-owl"
+              label: "night-owl"
+            - value: "nord"
+              label: "nord"
+            - value: "pojoaque"
+              label: "pojoaque"
+            - value: "shades-of-purple"
+              label: "shades-of-purple"
+            - value: "solarized-dark-atom"
+              label: "solarized-dark-atom"
+            - value: "synthwave84"
+              label: "synthwave84"
+            - value: "vs"
+              label: "vs"
+            - value: "vsc-dark-plus"
+              label: "vsc-dark-plus"
+            - value: "xonokai"
+              label: "xonokai"
+            - value: "z-touch"
+              label: "z-touch"
+        - $formkit: select
+          name: theme_dark
+          if: $get(enable).value
+          label: 代码块主题（深色）随着系统主题变化
+          value: one-dark
+          options:
+            - value: "one-dark"
+              label: "one-dark"
+            - value: "one-light"
+              label: "one-light"
+            - value: "a11y-dark"
+              label: "a11y-dark"
+            - value: "atom-dark"
+              label: "atom-dark"
+            - value: "base16-ateliersulphurpool.light"
+              label: "base16-ateliersulphurpool.light"
+            - value: "cb"
+              label: "cb"
+            - value: "coldark-cold"
+              label: "coldark-cold"
+            - value: "coldark-dark"
+              label: "coldark-dark"
+            - value: "coy-without-shadows"
+              label: "coy-without-shadows"
+            - value: "darcula"
+              label: "darcula"
+            - value: "dracula"
+              label: "dracula"
+            - value: "duotone-dark"
+              label: "duotone-dark"
+            - value: "duotone-earth"
+              label: "duotone-earth"
+            - value: "duotone-forest"
+              label: "duotone-forest"
+            - value: "duotone-light"
+              label: "duotone-light"
+            - value: "duotone-sea"
+              label: "duotone-sea"
+            - value: "duotone-space"
+              label: "duotone-space"
+            - value: "ghcolors"
+              label: "ghcolors"
+            - value: "gruvbox-dark"
+              label: "gruvbox-dark"
+            - value: "gruvbox-light"
+              label: "gruvbox-light"
+            - value: "holi-theme"
+              label: "holi-theme"
+            - value: "hopscotch"
+              label: "hopscotch"
+            - value: "lucario"
+              label: "lucario"
+            - value: "material-dark"
+              label: "material-dark"
+            - value: "material-light"
+              label: "material-light"
+            - value: "material-oceanic"
+              label: "material-oceanic"
+            - value: "night-owl"
+              label: "night-owl"
+            - value: "nord"
+              label: "nord"
+            - value: "pojoaque"
+              label: "pojoaque"
+            - value: "shades-of-purple"
+              label: "shades-of-purple"
+            - value: "solarized-dark-atom"
+              label: "solarized-dark-atom"
+            - value: "synthwave84"
+              label: "synthwave84"
+            - value: "vs"
+              label: "vs"
+            - value: "vsc-dark-plus"
+              label: "vsc-dark-plus"
+            - value: "xonokai"
+              label: "xonokai"
+            - value: "z-touch"
+              label: "z-touch"
+
     - group: tool
       label: 小部件
       formSchema:

templates/assets/js/halo.js

@@ -8,5 +8,254 @@ let halo = {
                 commentDOMclass.replace('dark','light')
         }
 
+    },
+
+    dataCodeTheme : ()=>{
+
+        var t = document.documentElement.getAttribute('data-theme')
+        var e = document.querySelector("link[data-code-theme=light]"),
+            o = document.querySelector("link[data-code-theme=dark]");
+        (o || e) && ("light" === t ? (o.disabled = !0, e.disabled = !1) : (e.disabled = !0, o.disabled = !1))
+
+    },
+
+    /**
+     * 代码
+     * 只适用于halo的代码渲染
+     */
+    addPrismTool : ()=>{
+        if (typeof Prism === 'undefined' || typeof document === 'undefined') {
+            return;
+        }
+
+        if (!Prism.plugins.toolbar) {
+            console.warn('Copy to Clipboard plugin loaded before Toolbar plugin.');
+
+            return;
+        }
+
+
+
+
+        const enable = GLOBAL_CONFIG.prism.enable;
+        if (!enable) return;
+        const isEnableTitle = GLOBAL_CONFIG.prism.enable_title;
+        const isEnableHr = GLOBAL_CONFIG.prism.enable_hr;
+        const isEnableLine = GLOBAL_CONFIG.prism.enable_line;
+        const isEnableCopy = GLOBAL_CONFIG.prism.enable_copy;
+        const isEnableExpander = GLOBAL_CONFIG.prism.enable_expander;
+        const prismLimit = GLOBAL_CONFIG.prism.prism_limit;
+        const isEnableHeightLimit = GLOBAL_CONFIG.prism.enable_height_limit;
+
+        // https://stackoverflow.com/a/30810322/7595472
+
+        /** @param {CopyInfo} copyInfo */
+        function fallbackCopyTextToClipboard(copyInfo) {
+            var textArea = document.createElement('textarea');
+            textArea.value = copyInfo.getText();
+
+            // Avoid scrolling to bottom
+            textArea.style.top = '0';
+            textArea.style.left = '0';
+            textArea.style.position = 'fixed';
+
+            document.body.appendChild(textArea);
+            textArea.focus();
+            textArea.select();
+
+            try {
+                var successful = document.execCommand('copy');
+                setTimeout(function () {
+                    if (successful) {
+                        copyInfo.success();
+                    } else {
+                        copyInfo.error();
+                    }
+                }, 1);
+            } catch (err) {
+                setTimeout(function () {
+                    copyInfo.error(err);
+                }, 1);
+            }
+
+            document.body.removeChild(textArea);
+        }
+
+        /** @param {CopyInfo} copyInfo */
+        function copyTextToClipboard(copyInfo) {
+            if (navigator.clipboard) {
+                navigator.clipboard.writeText(copyInfo.getText()).then(copyInfo.success, function () {
+                    // try the fallback in case `writeText` didn't work
+                    fallbackCopyTextToClipboard(copyInfo);
+                });
+            } else {
+                fallbackCopyTextToClipboard(copyInfo);
+            }
+        }
+
+        /**
+         * Selects the text content of the given element.
+         *
+         * @param {Element} element
+         */
+        function selectElementText(element) {
+            // https://stackoverflow.com/a/20079910/7595472
+            window.getSelection().selectAllChildren(element);
+        }
+
+        /**
+         * Traverses up the DOM tree to find data attributes that override the default plugin settings.
+         *
+         * @param {Element} startElement An element to start from.
+         * @returns {Settings} The plugin settings.
+         * @typedef {Record<"copy" | "copy-error" | "copy-success" | "copy-timeout", string | number>} Settings
+         */
+        function getSettings(startElement) {
+            /** @type {Settings} */
+            var settings = {
+                'copy': 'Copy',
+                'copy-error': 'Press Ctrl+C to copy',
+                'copy-success': 'Copied!',
+                'copy-timeout': 5000
+            };
+
+            var prefix = 'data-prismjs-';
+            for (var key in settings) {
+                var attr = prefix + key;
+                var element = startElement;
+                while (element && !element.hasAttribute(attr)) {
+                    element = element.parentElement;
+                }
+                if (element) {
+                    settings[key] = element.getAttribute(attr);
+                }
+            }
+            return settings;
+        }
+
+
+
+
+        var r = Prism.plugins.toolbar.hook = function (a) {
+
+
+            var r = a.element.parentNode;
+            var toolbar = r.nextElementSibling;
+
+            //标题
+            isEnableTitle && toolbar.classList.add("c-title")
+            //标题分割线
+            isEnableHr && toolbar.classList.add("c-hr")
+            var customItem = document.createElement("div");
+            customItem.className = 'custom-item absolute top-0'
+
+            //复制
+            if(isEnableCopy){
+                var copy = document.createElement("i");
+
+                copy.className = 'haofont hao-icon-paste copy-button code-copy cursor-pointer'
+                customItem.appendChild(copy)
+
+                copy.addEventListener('click', function () {
+                    copyTextToClipboard({
+                        getText: function () {
+                            return a.element.textContent;
+                        },
+                        success: function () {
+                            btf.snackbarShow('复制成功')
+                            setState('copy-success');
+                            resetText();
+                        },
+                        error: function () {
+                            setState('copy-error');
+
+                            setTimeout(function () {
+                                selectElementText(a.element);
+                            }, 1);
+
+                            resetText();
+                        }
+                    });
+
+                });
+
+            }
+
+
+
+            const prismToolsFn = function (e) {
+                const $target = e.target.classList;
+                if ($target.contains("code-expander")) prismShrinkFn(this);
+            };
+
+            //折叠
+            if(isEnableExpander){
+                var expander = document.createElement("i");
+                expander.className = 'fa-sharp fa-solid fa-caret-down code-expander cursor-pointer'
+                customItem.appendChild(expander)
+
+                expander.addEventListener('click', prismToolsFn)
+
+
+
+            }
+
+
+            const expandCode = function () {
+                this.classList.toggle("expand-done");
+                this.style.display = "none";
+                r.classList.toggle("expand-done");
+            };
+
+            if (isEnableHeightLimit && r.offsetHeight > prismLimit) {
+
+                r.classList.add("close")
+                const ele = document.createElement("div");
+                ele.className = "code-expand-btn";
+                ele.innerHTML = '<i class="haofont hao-icon-angle-double-down"></i>';
+                ele.addEventListener("click", expandCode);
+                r.offsetParent.appendChild(ele);
+            }
+
+
+
+
+            const prismShrinkFn = ele => {
+                const $nextEle = r.offsetParent.lastElementChild.classList
+                toolbar.classList.toggle('c-expander')
+                r.classList.toggle("expand-done-expander");
+                if (toolbar.classList.contains('c-expander')) {
+                    r.firstElementChild.style.display = "none";
+                    if($nextEle.contains('code-expand-btn')){
+                        r.offsetParent.lastElementChild.style.display = "none";
+                    }
+                } else {
+                    r.firstElementChild.style.display = "block";
+                    if($nextEle.contains('code-expand-btn') &&  !r.classList.contains('expand-done')){
+                        r.offsetParent.lastElementChild.style.display = "block";
+                    }
+                }
+
+            };
+
+
+            toolbar.appendChild(customItem)
+
+            var settings = getSettings(a.element);
+
+
+            function resetText() {
+                setTimeout(function () {
+                    setState('copy');
+                }, settings['copy-timeout']);
+            }
+
+            /** @param {"copy" | "copy-error" | "copy-success"} state */
+            function setState(state) {
+                copy.setAttribute('data-copy-state', state);
+            }
+
+        };
+        Prism.hooks.add("complete", r)
     }
 }

templates/assets/js/heo.js

@@ -473,6 +473,7 @@ var heo = {
             ? saveToLocal.set('aside-status', 'show', 2)
             : saveToLocal.set('aside-status', 'hide', 2)
         $htmlDom.toggle('hide-aside')
+        $htmlDom.contains("hide-aside") ? document.querySelector("#consoleHideAside").classList.add("on") : document.querySelector("#consoleHideAside").classList.remove("on")
     },
 
     changeSayHelloText: function() {

templates/assets/libs/prism/code.css

@@ -0,0 +1,293 @@
+/*代码块*/
+[data-theme=light] {
+    --rl-code-bar-shadow: 0 5px 10px 0 rgba(144, 164, 174, 0.4);
+}
+
+[data-theme=dark] {
+    --rl-code-bar-shadow: 0 0 6px 2px #272727;
+}
+
+
+#article-container .code-toolbar {
+    margin: 18px 0;
+    overflow: hidden;
+    -webkit-box-shadow: var(--rl-code-bar-shadow);
+    box-shadow: var(--rl-code-bar-shadow);
+    border-radius: 7px
+}
+
+#article-container .code-toolbar:before {
+    content: "";
+    position: absolute;
+    top: 11px;
+    left: 12px;
+    z-index: 1;
+    width: 12px;
+    height: 12px;
+    border-radius: 50%;
+    background-color: #fc625d;
+    -webkit-box-shadow: 20px 0 #fdbc40,40px 0 #35cd4b;
+    box-shadow: 20px 0 #fdbc40,40px 0 #35cd4b
+}
+
+#article-container .code-toolbar .toolbar {
+    position: absolute;
+    pointer-events: none;
+    opacity: 1;
+    left: 0;
+    right: 0;
+    top: 0;
+    z-index: unset;
+    height: 35px;
+    line-height: 32px;
+    text-align: center
+}
+
+#article-container .code-toolbar .toolbar-item:first-child {
+    display: none
+}
+
+#article-container .code-toolbar .toolbar-item:first-child span {
+    background-color: transparent;
+    -webkit-box-shadow: none;
+    box-shadow: none;
+    font-weight: 700;
+    font-size: 0.9em;
+
+}
+
+#article-container .code-toolbar .toolbar .custom-item {
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    font-size: 1rem;
+    right: 12px;
+    color: #999;
+    pointer-events: all
+}
+
+#article-container .code-toolbar .toolbar .custom-item>i {
+    cursor: pointer;
+    margin-left: 10px;
+    -webkit-transition: -webkit-transform .2s;
+    transition: transform .2s;
+    transition: transform .2s,-webkit-transform .2s
+}
+
+#article-container .code-toolbar .toolbar .custom-item>i:hover {
+    -webkit-filter: brightness(1.2);
+    filter: brightness(1.2)
+}
+
+#article-container .toolbar .copy-button:hover,
+#article-container .toolbar .code-expander:hover{
+    color: var(--heo-main);
+}
+
+
+#article-container .code-toolbar .toolbar.c-expander i.code-expander {
+    -webkit-transform: rotate(90deg);
+    transform: rotate(90deg)
+}
+
+
+#article-container .code-toolbar .toolbar.c-title .toolbar-item:first-child {
+    display: block
+}
+
+#article-container .code-toolbar .toolbar.c-hr {
+    border-bottom: 1px solid #b2a8a84d
+}
+
+#article-container .code-toolbar pre[class*=language-] {
+    position: relative;
+    margin: 0;
+    padding: 35px 0 0;
+    overflow: hidden;
+    white-space: pre;
+    text-shadow: none;
+    border-radius: 5px
+}
+
+#article-container .code-toolbar pre[class*=language-] .line-numbers-rows {
+    border-right: none;
+    left: 0;
+    top: 0;
+    bottom: 0;
+    padding-top: 12px;
+    width: 2.7em;
+}
+
+#article-container .code-toolbar pre[class*=language-] code[class*=language-] {
+    display: block;
+    margin-bottom: 0;
+    overflow-x: auto;
+    padding: 5px 18px 10px;
+    border-radius: 0 0 8px 8px;
+    text-shadow: none
+}
+
+#article-container .code-toolbar pre[class*=language-] code[class*=language-]::-webkit-scrollbar {
+    width: 5px;
+    height: 5px
+}
+
+#article-container .code-toolbar pre[class*=language-] code[class*=language-] .style .token.string,#article-container .code-toolbar pre[class*=language-] code[class*=language-] .token.entity,#article-container .code-toolbar pre[class*=language-] code[class*=language-] .token.operator,#article-container .code-toolbar pre[class*=language-] code[class*=language-] .token.string,#article-container .code-toolbar pre[class*=language-] code[class*=language-] .token.url {
+    background-color: transparent
+}
+
+#article-container .code-toolbar pre[class*=language-].line-numbers code[class*=language-] {
+    padding: 10px 20px 10px 48px;
+}
+
+.absolute {
+    position: absolute;
+}
+.top-0 {
+    top: 0;
+}
+
+#article-container .code-toolbar pre[class*=language-] code[class*=language-].c-toggle{
+    display: none;
+}
+
+/* 代码展开图标 */
+#article-container .code-expand-btn {
+    transition: 0.3s;
+    backdrop-filter: saturate(180%) blur(500px);
+    -webkit-backdrop-filter: blur(20px);
+    transform: translateZ(0);
+    position: absolute;
+    bottom: 0px;
+    z-index: 10;
+    width: 100%;
+    text-align: center;
+    font-size: var(--global-font-size);
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 32px;
+}
+
+#article-container .code-expand-btn:hover i {
+    color: var(--heo-white);
+}
+
+#article-container .code-expand-btn i {
+    color: var(--hlnumber-color);
+    font-size: 14px;
+    line-height: 1;
+}
+
+
+#article-container .code-expand-btn.expand-done {
+    -webkit-transform: rotate(180deg);
+    -moz-transform: rotate(180deg);
+    -o-transform: rotate(180deg);
+    -ms-transform: rotate(180deg);
+    transform: rotate(180deg);
+}
+
+#article-container pre{
+    border:0px;
+}
+
+#article-container .code-expand-btn:hover {
+    background: var(--heo-main);
+}
+
+#article-container .code-expand-btn:hover i {
+    color: var(--heo-white);
+}
+
+#article-container .code-toolbar pre.close.expand-done{
+    height: 100%;
+}
+#article-container .code-toolbar pre.close.expand-done-expander{
+    height: 100%;
+}
+
+
+@-moz-keyframes code-expand-key {
+    0% {
+        opacity: .6;
+        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
+        filter: alpha(opacity=60)
+    }
+
+    50% {
+        opacity: .1;
+        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
+        filter: alpha(opacity=10)
+    }
+
+    100% {
+        opacity: .6;
+        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
+        filter: alpha(opacity=60)
+    }
+}
+
+@-webkit-keyframes code-expand-key {
+    0% {
+        opacity: .6;
+        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
+        filter: alpha(opacity=60)
+    }
+
+    50% {
+        opacity: .1;
+        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
+        filter: alpha(opacity=10)
+    }
+
+    100% {
+        opacity: .6;
+        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
+        filter: alpha(opacity=60)
+    }
+}
+
+@-o-keyframes code-expand-key {
+    0% {
+        opacity: .6;
+        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
+        filter: alpha(opacity=60)
+    }
+
+    50% {
+        opacity: .1;
+        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
+        filter: alpha(opacity=10)
+    }
+
+    100% {
+        opacity: .6;
+        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
+        filter: alpha(opacity=60)
+    }
+}
+
+@keyframes code-expand-key {
+    0% {
+        opacity: .6;
+        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
+        filter: alpha(opacity=60)
+    }
+
+    50% {
+        opacity: .1;
+        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
+        filter: alpha(opacity=10)
+    }
+
+    100% {
+        opacity: .6;
+        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
+        filter: alpha(opacity=60)
+    }
+}
+
+/*代码块*/

templates/assets/zhheo/custom.css

@@ -52,3 +52,6 @@ ul li {
     padding: 0.3rem 0.5rem;
 }
 
+
+
+

templates/assets/zhheo/rightmenu.js

@@ -205,6 +205,12 @@ rm.switchDarkMode = function () {
     navFn.switchDarkMode();
     rm.hideRightMenu();
     heo.darkModeStatus();
+    //代码块
+    if(GLOBAL_CONFIG.prism.enable){
+        halo.dataCodeTheme();
+    }
+
+
     //halo.darkComment();
 }
 

templates/assets/zhheo/zhheoblog.css

@@ -1195,7 +1195,7 @@ blockquote footer cite::before {
 
 /* 代码块增加边框 */
 #article-container pre {
-    border: var(--style-border-always);
+    /*border: var(--style-border-always);*/
 }
 
 
@@ -12075,26 +12075,26 @@ blockquote p {
 /*}*/
 
 /* 代码展开图标 */
-#article-container .code-expand-btn i {
+/*#article-container .code-expand-btn i {*/
-    color: var(--heo-fontcolor);
+/*    color: var(--heo-fontcolor);*/
-    font-size: 1rem;
+/*    font-size: 1rem;*/
-}
+/*}*/
 
-#article-container .code-expand-btn {
+/*#article-container .code-expand-btn {*/
-    background-color: var(--heo-mask);
+/*    background-color: var(--heo-mask);*/
-    background: var(--heo-secondbg);
+/*    background: var(--heo-secondbg);*/
-    transition: 0.3s;
+/*    transition: 0.3s;*/
-    backdrop-filter: saturate(180%) blur(20px);
+/*    backdrop-filter: saturate(180%) blur(20px);*/
-    -webkit-backdrop-filter: blur(20px);
+/*    -webkit-backdrop-filter: blur(20px);*/
-}
+/*}*/
 
-#article-container .code-expand-btn:hover {
+/*#article-container .code-expand-btn:hover {*/
-    background: var(--heo-main);
+/*    background: var(--heo-main);*/
-}
+/*}*/
 
-#article-container .code-expand-btn:hover i {
+/*#article-container .code-expand-btn:hover i {*/
-    color: var(--heo-white);
+/*    color: var(--heo-white);*/
-}
+/*}*/
 
 /* 结尾寄语 */
 #readmore-talk {

templates/macro/prism-code.html

@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="en" xmlns:th="http://www.thymeleaf.org">
+<th:block th:fragment="prism-code">
+    <th:block th:if="${theme.config.code.enable}">
+        <link rel="preload" as="style" onload="this.rel='stylesheet'"
+              th:href="${assets_link+'/libs/prism/prism.min.css'}">
+        <link rel="preload" as="style" onload="this.rel='stylesheet'"
+              th:href="${assets_link+'/libs/prism/code.css'}">
+        <link rel="preload" as="style" onload="this.rel='stylesheet'" data-code-theme="light"
+              th:href="${assets_link+ '/libs/prism/themes/prism-'+theme.config.code.theme_light+'.css'}">
+        <link rel="preload" as="style" onload="this.rel='stylesheet'" data-code-theme="dark"
+              th:href="${assets_link+'/libs/prism/themes/prism-'+theme.config.code.theme_dark+'.css'}">
+        <script data-pjax type="text/javascript" th:src="${assets_link+'/libs/prism/prism.min.js'}"></script>
+
+        <style>
+
+            #article-container .code-toolbar pre.close{
+                overflow: hidden;
+                height: [[${theme.config.code.height_limit}]]px;
+            }
+        </style>
+
+    </th:block>
+</th:block>
+</html>

templates/modules/head.html

@@ -42,6 +42,8 @@
     <link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/6.2.0/css/all.min.css" media="all" onload="this.media='all'">
 
 
+   <!--  代码块-->
+    <th:block th:replace="~{macro/prism-code :: prism-code}"/>
 
     <script th:if="${theme.config.footer.footerContent.footerStyle == 'one'}" async="async">(function () {
         var grt = new Date("[[${#strings.arraySplit(theme.config.basics.siteStartTime, '-')[1]}]]/[[${#strings.arraySplit(theme.config.basics.siteStartTime, '-')[2]}]]/[[${#strings.arraySplit(theme.config.basics.siteStartTime, '-')[0]}]] 00:00:00"); //设置网站上线时间
@@ -283,6 +285,16 @@
                 bgDark: "#121212",
                 position: "top-center",
             },
+            prism: {
+                enable: [[${ theme.config.code.enable }]],
+                enable_title: [[${ theme.config.code.enable_title }]],
+                enable_hr: [[${ theme.config.code.enable_hr }]],
+                enable_line: [[${ theme.config.code.enable_line }]],
+                enable_copy: [[${ theme.config.code.enable_copy }]],
+                enable_expander: [[${ theme.config.code.enable_expander }]],
+                prism_limit: Number([[${#strings.isEmpty(theme.config.code.height_limit) ? 300 : theme.config.code.height_limit}]])+30,
+                enable_height_limit: [[${theme.config.code.enable_height_limit}]]
+            },
 
         };
 

templates/modules/layouts/layout.html

@@ -360,6 +360,14 @@
         heo.changeMusicBg(false);
     }
 
+    //代码块
+    if(GLOBAL_CONFIG.prism.enable){
+        halo.addPrismTool()
+        halo.dataCodeTheme()
+    }
+
+
+
 
 </script>
 </body>

templates/modules/widgets/about-widgets/statistics-map.html

@@ -11,7 +11,7 @@
             <div class="post-tips">统计信息来自 <a href="https://invite.51.la/1NzKqTeb?target=V6" rel="noopener nofollow"
                                                    target="_blank">51la网站统计</a></div>
             <div class="banner-button-group"><a class="banner-button" onclick="pjax.loadUrl('/archives')"
-                                                data-pjax-state=""><i class="haofont hao-icon-arrow-circle-right"></i><span
+                                                data-pjax-state=""><i class="haofont hao-icon-circle-arrow-up-right-1"></i><span
                     class="banner-button-text">文章隧道</span></a></div>
         </div>
     </div>

templates/post.html

@@ -119,7 +119,7 @@
                 </div>
 
                 <!-- 文章内容 -->
-                <article class="post-content line-numbers" id="article-container" th:utext="${post.content.content}">
+                <article th:class="'post-content  '+${ theme.config.code.enable_line ? 'line-numbers' : ''}" id="article-container" th:utext="${post.content.content}">
                 </article>