<div>
  <div class="mermaid">
    {{ .Content }}
  </div>

  <script src="/static/js/mermaid.min.js"></script>
  {{if eq .Theme "dark" }}
  <script>
    mermaid.initialize({startOnLoad:true, theme: 'dark'});
  </script>
  {{else if eq .Theme "light" }}
  <script>
    mermaid.initialize({startOnLoad:true, theme: 'default'});
  </script>
  {{else}}
  <script>
    if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
      mermaid.initialize({startOnLoad:true, theme: 'dark'});
    } else {
      mermaid.initialize({startOnLoad:true, theme: 'default'});
    }
  </script>
  {{end}}
</div>
