{{ define "main" }}
<header class="my-8">
  <p class="text-center font-iosevka capitalize">{{ .Data.Singular }}</p>
  <h1 class="text-4xl font-bold text-center capitalize">{{ .Title }}</h1>
</header>
<main class="container mx-auto">
  <ul class="flex flex-col gap-4 w-full mt-4">
    {{ partial "article-list.html" (dict "Pages" .Data.Pages) }}
  </ul>
  
  <section>
    <h2 class="text-4xl mt-8 mb-4 font-bold text-center">Other {{ .Data.Plural }}</h2>
    <div class="wompum-container wompum-container--no-gap">
      <div class="wompum-grid" data-text="Other {{ .Data.Plural }}" data-columns="4" data-rows="1"></div>
    </div>
    <div class="tag-cloud font-iosevka text-gray-600 text-center mt-4">
      {{ $terms := index .Site.Taxonomies .Data.Plural }}
      {{ range $term, $pages := $terms }}
        {{ if ne $term $.Title }}
        {{ with $.Site.GetPage (printf "/%s/%s" $.Data.Plural ($term | urlize)) }}
        <a href="{{ .RelPermalink }}" 
           class="tag inline-block p-2 my-1 border border-gray-100 rounded-lg hover:bg-yellow-100 whitespace-nowrap">
          {{ .Title }}
        </a>
        {{ end }}
        {{ end }}
      {{ end }}
    </div>
  </section>
</main>
{{ end }}