{{ define "main" }}
<main class="flex flex-col md:flex-row gap-4 md:gap-8 lg:gap-16 justify-around mt-8 max-w-screen-xl mx-auto">
  <ul class="flex flex-col md:gap-4 gap-16 w-full mb-16">
    {{ partial "interview-list.html" (dict "Pages" (where .Site.RegularPages "Section" "interviews")) }}
  </ul>

  <aside class="max-w-prose md:w-1/4 flex flex-col gap-8 mb-8">

    <section>
      <h2 class="text-2xl font-bold mb-2">About</h2>
      <div class="wompum-container wompum-container--no-gap">
        <div class="wompum-grid" data-text="About The Protocol Oral History Project" data-columns="4" data-rows="1"></div>
      </div>
      <p class="mt-4">{{ .Content }}</p>
    </section>

    <section>
      <h2 class="text-2xl font-bold mb-2">Topics</h2>
      <div class="wompum-container wompum-container--no-gap">
        <div class="wompum-grid" data-text="Topics" data-columns="4" data-rows="1"></div>
      </div>
      <div class="tag-cloud font-iosevka text-gray-600 my-4 flex flex-wrap gap-2">
        {{ partial "taxonomy-cloud" (dict "taxonomy" "topics" "Site" .Site) }}
      </div>
    </section>

  </aside>
</main>
{{ end }}