feat: add support for mermaid diagrams (#244)
This commit is contained in:
parent
f8d2495582
commit
523f4e67ae
@ -57,6 +57,9 @@ enableRecentNotes: false
|
|||||||
enableGitHubEdit: true
|
enableGitHubEdit: true
|
||||||
GitHubLink: https://github.com/jackyzha0/quartz/tree/hugo/content
|
GitHubLink: https://github.com/jackyzha0/quartz/tree/hugo/content
|
||||||
|
|
||||||
|
# whether to render mermaid diagrams
|
||||||
|
enableMermaid: true
|
||||||
|
|
||||||
# whether to use Operand to power semantic search
|
# whether to use Operand to power semantic search
|
||||||
# IMPORTANT: replace this API key with your own if you plan on using
|
# IMPORTANT: replace this API key with your own if you plan on using
|
||||||
# Operand search!
|
# Operand search!
|
||||||
|
@ -11,6 +11,7 @@ enableFooter: true
|
|||||||
enableContextualBacklinks: true
|
enableContextualBacklinks: true
|
||||||
enableRecentNotes: false
|
enableRecentNotes: false
|
||||||
enableGitHubEdit: true
|
enableGitHubEdit: true
|
||||||
|
enableMermaid: true
|
||||||
GitHubLink: https://github.com/jackyzha0/quartz/tree/hugo/content
|
GitHubLink: https://github.com/jackyzha0/quartz/tree/hugo/content
|
||||||
search:
|
search:
|
||||||
enableSemanticSearch: false
|
enableSemanticSearch: false
|
||||||
|
4
layouts/_default/_markup/render-codeblock-mermaid.html
Normal file
4
layouts/_default/_markup/render-codeblock-mermaid.html
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
<div class="mermaid">
|
||||||
|
{{- .Inner | safeHTML }}
|
||||||
|
</div>
|
||||||
|
{{ .Page.Store.Set "hasMermaid" true }}
|
@ -50,6 +50,8 @@
|
|||||||
<script src="{{$s.Permalink}}"></script>
|
<script src="{{$s.Permalink}}"></script>
|
||||||
{{end}}
|
{{end}}
|
||||||
{{partial "katex.html" .}}
|
{{partial "katex.html" .}}
|
||||||
|
|
||||||
|
{{partial "mermaid.html" .}}
|
||||||
|
|
||||||
<script src="https://unpkg.com/@floating-ui/core@0.7.3"></script>
|
<script src="https://unpkg.com/@floating-ui/core@0.7.3"></script>
|
||||||
<script src="https://unpkg.com/@floating-ui/dom@0.5.4"></script>
|
<script src="https://unpkg.com/@floating-ui/dom@0.5.4"></script>
|
||||||
@ -145,6 +147,19 @@
|
|||||||
|
|
||||||
}
|
}
|
||||||
{{end}}
|
{{end}}
|
||||||
|
|
||||||
|
{{if $data.enableMermaid | default $.Site.Data.config.enableMermaid}}
|
||||||
|
var els = document.getElementsByClassName("mermaid");
|
||||||
|
if (els.length > 0) {
|
||||||
|
import('https://unpkg.com/mermaid@9/dist/mermaid.esm.min.mjs').then(
|
||||||
|
(obj) => {
|
||||||
|
// init forces mermaid to render mermaid markdown without waiting
|
||||||
|
// for DOMContentLoaded event
|
||||||
|
obj.default.init();
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
{{end}}
|
||||||
}
|
}
|
||||||
|
|
||||||
const init = (doc = document) => {
|
const init = (doc = document) => {
|
||||||
|
8
layouts/partials/mermaid.html
Normal file
8
layouts/partials/mermaid.html
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
{{if $.Site.Data.config.enableMermaid}}
|
||||||
|
{{ if .Page.Store.Get "hasMermaid" }}
|
||||||
|
<script type="module">
|
||||||
|
import mermaid from 'https://unpkg.com/mermaid@9/dist/mermaid.esm.min.mjs';
|
||||||
|
mermaid.initialize({ startOnLoad: true });
|
||||||
|
</script>
|
||||||
|
{{ end }}
|
||||||
|
{{ end }}
|
Loading…
Reference in New Issue
Block a user