{{- define "main" -}}

<!-- Page header -->
<header class="gutter-x pt-36 pb-14 border-b border-zinc speed-lines">
  <div class="max-w-4xl">
    {{- with .Data.Singular -}}
    <span class="badge badge-pulse mb-5 inline-block">{{ . | title }}</span>
    {{- else -}}
    <span class="badge badge-pulse mb-5 inline-block">{{ .Kind | title }}</span>
    {{- end -}}
    <h1 class="font-display text-5xl md:text-7xl text-paper text-balance leading-none">{{ .Title }}</h1>
    {{- with .Description -}}
    <p class="text-chalk text-lg mt-5 max-w-xl leading-relaxed text-pretty font-body">{{ . }}</p>
    {{- end -}}
  </div>
</header>

<div class="gradient-line"></div>

<!-- Posts grid -->
<section class="gutter-x py-16 md:py-24">
  {{- if .Paginator.Pages -}}
  <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-5">
    {{- range .Paginator.Pages -}}
    {{- partial "post-card.html" . -}}
    {{- end -}}
  </div>
  {{- partial "pagination.html" . -}}
  {{- else -}}
  <p class="label text-fog text-center py-24">No posts yet.</p>
  {{- end -}}
</section>

{{- end -}}