{{ define "main" }}
    {{/*  {{ if .Menus }}
        <nav class="post-navigation">
        {{ range .Menus }}
            <a href="{{ .ConfiguredURL | absLangURL }}" title="{{ .Title }}">{{ .Name | markdownify }}</a>
        {{ end }}
        </nav>
    {{ end }}  */}}

    <article class="post h-entry">
        <div class="post-header">
            <header>
                <h1 class="p-name post-title{{ if .Params.favorite }} favorite{{end}}{{ if .Params.draft }} draft{{end}}">{{ trim .Title  " " | markdownify }}</h1>
                {{ partial "post-language-switcher.html" . }}
            </header>
            {{ partial "post-info.html" . }}
        </div>
        {{ partial "toc.html" .}}
        <div class="content e-content">
            {{ .Content }}
        </div>

    </article>

    {{ if gt .Site.Params.readNextPosts 0 }}
        {{ $related := .Site.RegularPages.Related . | first .Site.Params.readNextPosts }}
        {{ with $related }}
            <h3 class="read-next-title noselect">{{ i18n "readNext" }}</h3>
            <ul class="read-next-posts noselect">
                {{ range . }}
                <li><a href="{{ .RelPermalink }}">{{ .Title }}</a></li>
                {{ end }}
            </ul>
        {{ end }}
    {{ end }}

    {{ if and (.Site.Params.paginationSinglePost) (ne .Type "page") }}
        {{ partial "post-pagination.html" . }}
    {{ end }}

    {{ if not .Params.disableComments }}
        {{ partial "comments.html" . }}
    {{ end }}

    {{/*  When you use ```mermaid``, render-codeblock-mermaid.html is called and
        `.Store.Set "hasMermaid"` is executed.
        `.Store.Get "hasMermaid"` will return true and mermaid.js will be loaded.
    */}}

    {{ if .Store.Get "hasMermaid" }}
        {{ partial "resource.html" (dict "context" . "type" "js" "filename" "js/load-mermaid.js") }}

        {{ $colorTheme := "light" }}
        {{ if and (isset site.Params "colortheme") (ne site.Params.colortheme "") }}
            {{ $colorTheme = site.Params.colortheme | lower }}
        {{ end }}

        <script type="module">
            function detectCurrentScheme3() {
                    const defaultTheme = "{{ $colorTheme }}";
                    if (localStorage !== null && localStorage.getItem("user-color-scheme")) {
                            return localStorage.getItem("user-color-scheme");
                    }
                    if (defaultTheme === "dark" || defaultTheme === "light") {
                            return defaultTheme;
                    }
                    return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
            }

            import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.esm.min.mjs';
            window.mermaid = mermaid;
            window.initMermaid()
            document.body.dispatchEvent(new CustomEvent(detectCurrentScheme3() + "-theme-set"));
        </script>
    {{ end }}
{{ end }}