{{ define "main" }}
  <article>
    <header class="max-w-prose">
      {{ if .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">
        {{ partial "article-meta.html" (dict "context" . "scope" "single") }}
      </div>
    </header>
    <section class="flex flex-col max-w-full mt-0 prose lg:flex-row dark:prose-invert">
      {{ if and (.Params.showTableOfContents | default (.Site.Params.article.showTableOfContents | default false)) (in .TableOfContents "<ul") }}
        <div class="order-first px-0 lg:max-w-xs ltr:lg:pl-8 rtl:lg:pr-8 lg:order-last">
          <div class="ltr:pl-5 rtl:pr-5 toc lg:sticky lg:top-10">
            {{ partial "toc.html" . }}
          </div>
        </div>
      {{ end }}
      <div class="min-w-0 min-h-0 max-w-prose">
        {{ .Content | emojify }}
      </div>
    </section>
    <footer class="pt-8 max-w-prose">
      {{ partial "author.html" . }}
      {{ partial "sharing-links.html" . }}
      {{ partial "article-pagination.html" . }}
    </footer>
    {{ if templates.Exists "partials/comments.html" }}
      {{ partial "comments.html" . }}
    {{ end }}
  </article>
{{ end }}