Remove inline Mermaid script from head_custom.html and add Mermaid version to _config.yml

Author: emmanuelknafo

_config.yml

@@ -6,6 +6,9 @@ url: "https://devopsabcs-engineering.github.io"
 search_enabled: true
 heading_anchors: true
 
+mermaid:
+  version: "11.4.1"
+
 defaults:
   - scope: { path: "" }
     values: { layout: "default" }

_includes/head_custom.html

@@ -2,23 +2,6 @@
 <link rel="icon" type="image/png" sizes="32x32" href="{{ '/assets/branding/favicon-32x32.png' | relative_url }}">
 <link rel="apple-touch-icon" sizes="180x180" href="{{ '/assets/branding/apple-touch-icon.png' | relative_url }}">
 
-<script type="module">
-  import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.esm.min.mjs';
-
-  // Convert just-the-docs fenced code blocks (`pre > code.language-mermaid`)
-  // into `<div class="mermaid">` blocks before initializing Mermaid so the
-  // diagrams render correctly inside the theme.
-  document.querySelectorAll('pre > code.language-mermaid').forEach((codeEl) => {
-    const pre = codeEl.parentElement;
-    const div = document.createElement('div');
-    div.classList.add('mermaid');
-    div.textContent = codeEl.textContent;
-    pre.replaceWith(div);
-  });
-
-  mermaid.initialize({ startOnLoad: true });
-</script>
-
 <style>
   .site-title { white-space: normal; }
 </style>