{{ define "main" }}
  {{ .Scratch.Set "scope" "list" }}
  {{ $enableToc := .Params.showTableOfContents | default (site.Params.list.showTableOfContents | default false) }}
  {{ $showToc := and $enableToc (in .TableOfContents "<ul") }}

  {{/* Hero */}}
  {{ if site.Params.list.showHero | default false }}
    {{ $heroStyle := print "hero/" site.Params.list.heroStyle ".html" }}
    {{ if templates.Exists ( printf "partials/%s" $heroStyle ) }}
      {{ partial $heroStyle . }}
    {{ else }}
      {{ partial "hero/basic.html" . }}
    {{ end }}
  {{ end }}

  {{/* Header */}}
  <header>
    {{ if .Params.showBreadcrumbs | default (site.Params.list.showBreadcrumbs | default false) }}
      {{ partial "breadcrumbs.html" . }}
    {{ end }}
    <h1 class="mt-5 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/list.html" (dict "context" . "scope" "single") }}
    </div>
  </header>

  {{/* Description (markdown content) */}}
  {{ $tocMargin := cond $showToc "mt-12" "mt-0" }}
  {{ $topClass := cond (hasPrefix site.Params.header.layout "fixed") "lg:top-[140px]" "lg:top-10" }}
  <section class="{{ $tocMargin }} prose flex max-w-full flex-col dark:prose-invert lg:flex-row">
    {{ if $showToc }}
      <div class="order-first px-0 lg:order-last lg:max-w-xs lg:ps-8">
        <div class="toc ps-5 lg:sticky {{ $topClass }}">
          {{ if $showToc }}
            {{ partial "toc.html" . }}
          {{ end }}
        </div>
      </div>
    {{ end }}
    <div class="min-w-0 min-h-0 max-w-prose w-full">
      {{ .Content }}
    </div>
  </section>

  {{/* Article Grid */}}
  {{ if gt .Pages 0 }}
    {{ $cardView := .Params.cardView | default (site.Params.list.cardView | default false) }}
    {{ $cardViewScreenWidth := .Params.cardViewScreenWidth | default (site.Params.list.cardViewScreenWidth | default false) }}
    {{ $groupByYear := .Params.groupByYear | default (site.Params.list.groupByYear | default false) }}
    {{ $orderByWeight := .Params.orderByWeight | default (site.Params.list.orderByWeight | default false) }}
    {{ $groupByYear := and (not $orderByWeight) $groupByYear }}

    {{ if not $cardView }}
      <section class="space-y-10 w-full">
        {{ if not $orderByWeight }}
          {{ range (.Pages.GroupByDate "2006") }}
            {{ if $groupByYear }}
              <h2 class="mt-12 text-2xl font-bold text-neutral-700 first:mt-8 dark:text-neutral-300">
                {{ .Key }}
              </h2>
            {{ end }}
            {{ range .Pages }}
              {{ partial "article-link/simple.html" . }}
            {{ end }}
          {{ end }}
        {{ else }}
          {{ range .Pages.ByWeight }}
            {{ partial "article-link/simple.html" . }}
          {{ end }}
        {{ end }}
      </section>
    {{ else }}
      {{ if $groupByYear }}
        {{ range (.Pages.GroupByDate "2006") }}
          {{ if $cardViewScreenWidth }}
            <div class="relative w-screen max-w-[1600px] px-[30px] start-[calc(max(-50vw,-800px)+50%)]">
              <h2 class="mt-12 mb-3 text-2xl font-bold text-neutral-700 first:mt-8 dark:text-neutral-300">
                {{ .Key }}
              </h2>
              <section class="w-full grid gap-4 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5">
                {{ range .Pages }}
                  {{ partial "article-link/card.html" . }}
                {{ end }}
              </section>
            </div>
          {{ else }}
            <h2 class="mt-12 mb-3 text-2xl font-bold text-neutral-700 first:mt-8 dark:text-neutral-300">
              {{ .Key }}
            </h2>
            <section class="w-full grid gap-4 sm:grid-cols-2 md:grid-cols-3">
              {{ range .Pages }}
                {{ partial "article-link/card.html" . }}
              {{ end }}
            </section>
          {{ end }}
        {{ end }}
      {{ else }}
        {{ if $cardViewScreenWidth }}
          <div class="relative w-screen max-w-[1600px] px-[30px] start-[calc(max(-50vw,-800px)+50%)]">
            <section class="w-full grid gap-4 sm:grid-cols-2 md:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5">
              {{ if not $orderByWeight }}
                {{ range (.Pages.GroupByDate "2006") }}
                  {{ range .Pages }}
                    {{ partial "article-link/card.html" . }}
                  {{ end }}
                {{ end }}
              {{ else }}
                {{ range .Pages.ByWeight }}
                  {{ partial "article-link/card.html" . }}
                {{ end }}
              {{ end }}
            </section>
          </div>
        {{ else }}
          <section class="w-full grid gap-4 sm:grid-cols-2 md:grid-cols-3">
            {{ if not $orderByWeight }}
              {{ range (.Pages.GroupByDate "2006") }}
                {{ range .Pages }}
                  {{ partial "article-link/card.html" . }}
                {{ end }}
              {{ end }}
            {{ else }}
              {{ range .Pages.ByWeight }}
                {{ partial "article-link/card.html" . }}
              {{ end }}
            {{ end }}
          </section>
        {{ end }}
      {{ end }}
    {{ end }}
  {{ else }}
    <section class="mt-10 prose dark:prose-invert">
      <p class="py-8 border-t">
        <em>{{ i18n "list.no_articles" | emojify }}</em>
      </p>
    </section>
  {{ end }}
{{ end }}