1.9 代码高亮好了

This commit is contained in:
跨越晨昏 2024-10-14 19:22:02 +08:00
parent a018c9edd8
commit 922db49b9f
4 changed files with 49 additions and 29 deletions

View File

@ -1,4 +1,6 @@
from markdown.extensions import Extension, extra, admonition, meta, sane_lists, toc, wikilinks from markdown.extensions import Extension, extra, admonition, meta, sane_lists, toc, wikilinks, codehilite
from pygments.formatters import HtmlFormatter
from markdown.treeprocessors import Treeprocessor from markdown.treeprocessors import Treeprocessor
from markdown.inlinepatterns import Pattern as Pattern_ from markdown.inlinepatterns import Pattern as Pattern_
@ -11,15 +13,6 @@ import re
import xml import xml
import emoji import emoji
Extensions = {
"Extra": extra.ExtraExtension(fenced_code={'lang_prefix': ''}), # 基本扩展
"Admonition": admonition.AdmonitionExtension(), # 警告扩展
"Meta-Data": meta.MetaExtension(), # 元数据
"Sane Lists": sane_lists.SaneListExtension(), # 只能列表
"Table of Contents": toc.TocExtension(), # 目录
"WikiLinks": wikilinks.WikiLinkExtension(), # 内部链接
}
try: # 检测当前平台是否支持扩展语法 try: # 检测当前平台是否支持扩展语法
from .Extra import * from .Extra import *
@ -28,6 +21,30 @@ except ModuleNotFoundError: # 不支持扩展语法
EXTRA_ABLE = False EXTRA_ABLE = False
class HighlightHtmlFormatter(HtmlFormatter):
def __init__(self, lang_str='', **options):
super().__init__(**options)
# lang_str has the value {lang_prefix}{lang}
# specified by the CodeHilite's options
self.lang_str = lang_str.split('-')[-1]
def _wrap_code(self, source):
yield 0, f'<code class="{self.lang_str}">'
yield from source
yield 0, '</code>'
Extensions = {
'基本扩展': extra.ExtraExtension(fenced_code={'lang_prefix': ''}),
'警告扩展': admonition.AdmonitionExtension(),
'元数据': meta.MetaExtension(),
'能列表': sane_lists.SaneListExtension(),
'目录': toc.TocExtension(),
'内部链接': wikilinks.WikiLinkExtension(),
'代码高亮': codehilite.CodeHiliteExtension(guess_lang=False, pygments_formatter=HighlightHtmlFormatter),
}
class Simple(InlineProcessor): class Simple(InlineProcessor):
""" """
可通过简单的正则表达式和HTML标签实现的样式 可通过简单的正则表达式和HTML标签实现的样式

View File

@ -28,9 +28,11 @@ HEAD = (
'</script>', '</script>',
# Highlight.js # Highlight.js
'<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.3.1/styles/default.min.css">', # '<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.3.1/styles/default.min.css">',
'<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.3.1/highlight.min.js"></script>', # '<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.3.1/highlight.min.js"></script>',
'<script>hljs.highlightAll();</script>', # '<script>hljs.highlightAll();</script>',
'<link rel="stylesheet" href="../Static/styles.css">',
'<style>', '<style>',
' .block {', ' .block {',

View File

@ -12,9 +12,7 @@
<script> <script>
mermaid.initialize({startOnLoad:true}); mermaid.initialize({startOnLoad:true});
</script> </script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.3.1/styles/default.min.css"> <link rel="stylesheet" href="../Static/styles.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.3.1/highlight.min.js"></script>
<script>hljs.highlightAll();</script>
<style> <style>
.block { .block {
background-color: grey; /* 灰色背景 */ background-color: grey; /* 灰色背景 */
@ -187,25 +185,28 @@
<p><span class="block">强调值</span></p> <p><span class="block">强调值</span></p>
<h2 id="4.2">4.2 多行</h2> <h2 id="4.2">4.2 多行</h2>
<h3 id="4.2.1">4.2.1 YAML</h3> <h3 id="4.2.1">4.2.1 YAML</h3>
<pre><code class="yaml">A: <div class="codehilite"><pre><span></span><code class="yaml"><span class="nt">A</span><span class="p">:</span>
1. a <span class="w"> </span><span class="l l-Scalar l-Scalar-Plain">1. a</span>
2. b <span class="w"> </span><span class="l l-Scalar l-Scalar-Plain">2. b</span>
3. c <span class="w"> </span><span class="l l-Scalar l-Scalar-Plain">3. c</span>
B: <span class="nt">B</span><span class="p">:</span>
- a <span class="w"> </span><span class="p p-Indicator">-</span><span class="w"> </span><span class="l l-Scalar l-Scalar-Plain">a</span>
- b <span class="w"> </span><span class="p p-Indicator">-</span><span class="w"> </span><span class="l l-Scalar l-Scalar-Plain">b</span>
- c <span class="w"> </span><span class="p p-Indicator">-</span><span class="w"> </span><span class="l l-Scalar l-Scalar-Plain">c</span>
</code></pre> </code></pre></div>
<h3 id="4.2.2">4.2.2 Python</h3> <h3 id="4.2.2">4.2.2 Python</h3>
<pre><code class="python">print('CrossDown') <div class="codehilite"><pre><span></span><code class="python"><span class="nb">print</span><span class="p">(</span><span class="s1">&#39;CrossDown&#39;</span><span class="p">)</span>
</code></pre> </code></pre></div>
<h3 id="4.2.3">4.2.3 Mermaid</h3> <h3 id="4.2.3">4.2.3 Mermaid</h3>
<pre><code class="mermaid">graph TD <div class="codehilite"><pre><span></span><code class="mermaid">graph TD
A[开始]--&gt;B[流程] A[开始]--&gt;B[流程]
B--&gt;C{判断} B--&gt;C{判断}
C--&gt;|结果1|D[结束1] C--&gt;|结果1|D[结束1]
C--&gt;|结果2|E[结束2] C--&gt;|结果2|E[结束2]
</code></pre> </code></pre></div>
<h1 id="5">5 转义</h1> <h1 id="5">5 转义</h1>
<p>\ </p> <p>\ </p>
<p>\a </p> <p>\a </p>