add disable animation, mermaid support

Signed-off-by: GitHub Action <action@github.com>

assets/scss/_colors.scss

@@ -6,6 +6,7 @@ $dark-grey: #3b3e48 !default;
 $highlight-grey: #7d828a !default;
 $midnightblue: #2c3e50 !default;
 $typewriter: hsl(172, 100%, 36%) !default;
+$codebackground: #272822 !default;
 
 // Scroll to Top Default colors
 $stt-stroke: #ccc !default;

assets/scss/style.scss

@@ -1,9 +1,7 @@
 @import "predefined.scss";
 @import "normalize.scss";
 @import "syntax.scss";
-{{ if ne false .Site.Params.usesAnimation }}
 @import "animate.scss";
-{{ end }}
 @import "scroll.scss";
 @import "socialshare.scss";
 {{ if (fileExists "assets/scss/userstyles.scss") }}
@@ -66,7 +64,9 @@ pre {
   background: $midnightblue;
   overflow-x: auto;
   -webkit-overflow-scrolling: touch;
-
+  &.mermaid {
+    background: $codebackground;
+  }
   code {
     padding: 0;
     margin: 0;

hugo.toml.example

@@ -119,8 +119,7 @@ expiryDate = ["expiryDate"]
   # allowRobots = "index, follow"
   # siteNoIndex = false
   # noIndexPages = ["404 Page not found"]
-  # usesAnimation = true # Defaults to true
+  # usesAnimation = true
-
   
   [[params.socialLinks]]
     name = "mastodon"

layouts/_default/_markup/render-codeblock-mermaid.html

@@ -0,0 +1,5 @@
+{{ .Page.Store.Set "hasMermaid" true -}}
+
+<pre class="mermaid">
+  {{- .Inner | safeHTML }}
+</pre>

layouts/_default/baseof.html

@@ -46,12 +46,7 @@
 <script defer src="{{ $c_js.Permalink }}" {{ printf "integrity=%q" $c_js.Data.Integrity | safeHTMLAttr }} crossorigin="anonymous"></script>
 {{- end }}
 {{- partial "mathjax.html" . -}}
-{{ if .Page.Store.Get "hasMermaid" }}
+{{- partial "mermaid.html" . -}}
-    <script defer type="module">
-      import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.esm.min.mjs';
-      mermaid.initialize({ startOnLoad: true,theme: 'dark' });
-    </script>
-{{ end }}
 {{- if templates.Exists "partials/extra-foot.html" -}}{{- partial "extra-foot.html" . -}}{{- end }}
 </body>
 

layouts/partials/mermaid.html

@@ -0,0 +1,6 @@
+{{- if .Page.Store.Get "hasMermaid" -}}
+    <script defer async type="module">
+      import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.esm.min.mjs';
+      mermaid.initialize({ startOnLoad: true,theme: 'dark' });
+    </script>
+{{- end -}}