enable mermaid

layouts/partials/footer.html

@@ -75,10 +75,19 @@
         if (document.body.className.includes("dark")) {
             document.body.classList.remove('dark');
             localStorage.setItem("pref-theme", 'light');
+            theme = ''
         } else {
             document.body.classList.add('dark');
             localStorage.setItem("pref-theme", 'dark');
+            theme = 'dark'
         }
+        mermaidTextContents.forEach((element, index) => {
+            document.getElementsByClassName("language-mermaid")[index].removeAttribute('data-processed')
+            document.getElementsByClassName("language-mermaid")[index].innerHTML = element
+        })
+
+        mermaid.initialize({ theme: theme, startOnLoad: true });
+        mermaid.init(undefined, '.language-mermaid');
     })
 
 </script>
@@ -133,3 +142,16 @@
     });
 </script>
 {{- end }}
+
+{{- if (and (eq .Kind "page") (ne .Layout "archives") (ne .Layout "search")) }}
+<script>
+    if (localStorage.getItem("pref-theme") == 'dark') {
+        theme = 'dark'
+    } else {
+        theme = ''
+    }
+    mermaidTextContents = Array.from(document.getElementsByClassName("language-mermaid")).map(value => value.innerHTML)
+    mermaid.initialize({ theme: theme, startOnLoad: true });
+    mermaid.init(undefined, '.language-mermaid');
+</script>
+{{- end}}

layouts/partials/head.html

@@ -95,6 +95,19 @@
 {{- end }}
 {{- end }}
 
+{{- /* Mermaid.js */}}
+{{- if (and (eq .Kind "page") (ne .Layout "archives") (ne .Layout "search"))  }}
+
+{{- if not .Site.Params.assets.disableFingerprinting }}
+{{- $mermaid := slice (resources.Get "js/mermaid.min.js") | resources.Concat "assets/js/mermaid.js" | minify | fingerprint }}
+<script crossorigin="anonymous" src="{{ $mermaid.RelPermalink }}"></script>
+{{- else }}
+{{- $mermaid := slice (resources.Get "js/mermaid.min.js") | resources.Concat "assets/js/mermaid.js" | minify }}
+<script crossorigin="anonymous" src="{{ $mermaid.RelPermalink }}"></script>
+{{- end }}
+{{- end }}
+
+
 {{- /* Favicons */}}
 <link rel="icon" href="{{ .Site.Params.assets.favicon | default "favicon.ico" | absURL }}">
 <link rel="icon" type="image/png" sizes="16x16" href="{{ .Site.Params.assets.favicon16x16 | default "favicon-16x16.png" | absURL }}">