{{ define "main" }}
  {{- $images := .Resources.ByType "image" }}
  {{- $cover := $images.GetMatch "*cover*" }}
  {{- $feature := $images.GetMatch "*feature*" | default $cover }}
  <article>
    <header class="max-w-prose">
      {{ if .Params.showBreadcrumbs | default (.Site.Params.article.showBreadcrumbs | default false) }}
        {{ partial "breadcrumbs.html" . }}
      {{ end }}
      <h1 class="mt-0 text-4xl font-extrabold text-neutral-900 dark:text-neutral">
        {{ .Title | emojify }}
      </h1>
      <div class="mt-8 mb-12 text-base text-neutral-500 dark:text-neutral-400 print:hidden">
        {{ partial "article-meta.html" (dict "context" . "scope" "single") }}
      </div>
      {{ with $feature }}
        <img
          class="mb-6 -mt-4 rounded-md"
          srcset="
                {{- (.Resize "330x").RelPermalink }} 330w,
                {{- (.Resize "660x").RelPermalink }} 660w,
                {{- (.Resize "1024x").RelPermalink }} 1024w,
                {{- (.Resize "1320x").RelPermalink }} 2x"
          src="{{ (.Resize "660x").RelPermalink }}"
        />
      {{ end }}
    </header>
    <section class="flex flex-col max-w-full mt-0 prose dark:prose-invert lg:flex-row">
      {{ if and (.Params.showTableOfContents | default (.Site.Params.article.showTableOfContents | default false)) (in .TableOfContents "<ul") }}
        <div class="order-first px-0 lg:order-last lg:max-w-xs ltr:lg:pl-8 rtl:lg:pr-8">
          <div class="toc ltr:pl-5 rtl:pr-5 print:hidden lg:sticky lg:top-10">
            {{ partial "toc.html" . }}
          </div>
        </div>
      {{ end }}
      <div class="min-w-0 min-h-0 max-w-prose grow">
        {{ .Content | emojify }}
      </div>
    </section>
    <footer class="pt-8 max-w-prose print:hidden">
      {{ partial "author.html" . }}
      {{ partial "sharing-links.html" . }}
      {{ partial "article-pagination.html" . }}
      {{ if .Params.showComments | default (.Site.Params.article.showComments | default false) }}
        {{ if templates.Exists "partials/comments.html" }}
          <div class="pt-3">
            <hr class="border-dotted border-neutral-300 dark:border-neutral-600" />
            <div class="pt-3">
              {{ partial "comments.html" . }}
            </div>
          </div>
        {{ else }}
          {{ warnf "[CONGO] Comments are enabled for %s but no comments partial exists." .File.Path }}
        {{ end }}
      {{ end }}
    </footer>
  </article>
{{ end }}