{{ define "main" }}
  <header>
    {{ if .Params.showBreadcrumbs | default (.Site.Params.taxonomy.showBreadcrumbs | default false) }}
      {{ partial "breadcrumbs.html" . }}
    {{ end }}
    <h1 class="mt-0 text-4xl font-extrabold text-neutral-900 dark:text-neutral">{{ .Title }}</h1>
    <div class="mt-1 mb-2 text-base text-neutral-500 dark:text-neutral-400 print:hidden">
      {{ partial "article-meta-taxonomy.html" (dict "context" . "scope" "single") }}
    </div>
  </header>
  {{ if .Content }}
    <section class="flex flex-col max-w-full mt-0 prose dark:prose-invert lg:flex-row">
      <div class="min-w-0 min-h-0 max-w-prose">
        {{ .Content | emojify }}
      </div>
      <script>
        var oid = "views_{{ .File.Path }}"
        var oid_likes = "likes_{{ .File.Path }}"
      </script>
      {{ $jsPage := resources.Get "js/page.js" }}
      {{ $jsPage = $jsPage | resources.Minify | resources.Fingerprint "sha512" }}
      <script type="text/javascript" src="{{ $jsPage.RelPermalink }}" integrity="{{ $jsPage.Data.Integrity }}"></script>
    </section>
  {{ end }}
  <section class="flex flex-wrap max-w-prose -mx-2 overflow-hidden">
    {{ range .Data.Terms }}
      <article class="w-full px-2 my-3 overflow-hidden sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/4">
        <h2 class="flex items-center">
          <a
            class="text-xl font-medium decoration-primary-500 hover:underline hover:underline-offset-2"
            href="{{ .Page.RelPermalink }}"
            >{{ .Page.Title }}</a
          >
          {{ if $.Site.Params.taxonomy.showTermCount | default true }}
            <span class="px-2 text-base text-primary-500">&middot;</span>
            <span class="text-base text-neutral-400">
              {{ .Count }}
            </span>
          {{ end }}
        </h2>
      </article>
    {{ end }}
  </section>
{{ end }}