{{ define "main" }}
    
    <article class="single-article">

      <header class="mb-4">{{ partial "article-wompum.html" . }}</header>

      <div class="flex gap-4">
        <aside class="lg:sticky lg:top-0 lg:h-screen lg:overflow-y-auto lg:w-1/3 p-4 font-iosevka">
          <p><strong>Date:</strong> <time datetime="{{ .Date.Format " 2006-01-02" }}">{{ .Date.Format "January 2, 2006" }}</time></p>
          <p><strong>Narrator:</strong> <a href="{{ "/narrator/" | relLangURL }}{{ .Params.narrator | urlize }}">{{ .Params.narrator }}</a></p>
          <p><strong>Facilitator:</strong> <a href="{{ "/facilitator/" | relLangURL }}{{ .Params.facilitator | urlize }}">{{ .Params.facilitator }}</a></p>
          <p><strong>Subject:</strong> {{ .Params.subject }}</p>
          <p><strong>Topics:</strong> {{ partial "tags.html" . }}</p>
          {{ if .Params.links }}
            <div class="mt-4">
              <p><strong>Narrator Links:</strong></p>
              <ul class="list-disc pl-4 ml-4 mt-2">
                {{ range .Params.links }}
                  <li class="mb-2">
                    <a href="{{ .url }}" target="_blank" rel="noopener noreferrer">{{ .text }} <sup>↗</sup></a>
                  </li>
                {{ end }}
              </ul>
            </div>
          {{ end }}
        </aside>
        <div class="prose lg:prose-xl lg:w-2/3 p-4">
          <p class="font-bold text-4xl">{{ partial "article-title" . }}</p>
          {{ .Content }}
        </div>
      </div>
    </article>
    <aside class="max-w-screen-xl mx-auto px-4 lg:px-0">
      {{ partial "related-articles" (dict "page" . "tags" .Params.tags "limit" 3) }}
    </aside>
    <div class="text-center my-12"><a href="/">Go Home</a></div>
{{ end }}