layouts/partials/third-party/mermaid.html


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

<script src="https://cdn.jsdelivr.net/npm/mermaid@8.8.3/dist/mermaid.min.js"></script>
<script>
    let mermaidConfig = {
        startOnLoad: true,
        flowchart: {
            useMaxWidth: false,
            htmlLabels: true
        },
        theme: '{{ template "mermaid-theme" . }}'
    };
    mermaid.initialize(mermaidConfig);
</script>

{{- define "mermaid-theme" -}}
    {{- $theme := .Site.Params.mermaidTheme | default "default" -}}
    {{- if and .Site.Params.enableDarkMode (eq .Site.Params.defaultTheme "dark") -}}
        {{- $theme = .Site.Params.mermaidThemeDark | default "dark" -}}
    {{- end -}}
    {{- $theme -}}
{{- end -}}