{% extends "radion/templates/_base.html" %}
{% block scripts %}
  {{ super() }}

  <!-- mermaid -->
  <!-- Based on the following blog -->
  <!-- https://www.hahwul.com/dev/zola/mermaid-in-zola/ -->
  <script src="/js/mermaid.min.js"></script>
  <script type="module">
    mermaid.initialize({ startOnLoad: false, theme: 'dark' });
    document.addEventListener('DOMContentLoaded', async () => {
      const mermaidElements = document.querySelectorAll('.mermaid');

      if (mermaidElements.length > 0) {
          await mermaid.run({
              nodes: mermaidElements
          });
      }
    });
  </script>

  <script src="/js/chart.min.js"></script>
{% endblock %}