{{ define "main" }}
<div class="content-grid">
  <main id="main-content">

    <div style="margin-bottom:1.5rem; padding-bottom:1rem; border-bottom:2px solid var(--border-dim);">
      <h1 style="font-family:var(--font-terminal); font-size:1.8rem; color:var(--amber-light); letter-spacing:0.06em; text-shadow: 0 0 10px var(--glow-amber);">
        TOPIC INDEX
      </h1>
      <p class="taxonomy-header">
        <span style="color:var(--forest-light);">~/tags $</span>
        ls &bull;
        <span style="color:var(--amber);">{{ len .Data.Terms }} topics found</span>
      </p>
    </div>

    <ul class="taxonomy-list">
      {{- range .Data.Terms.Alphabetical }}
      <li class="taxonomy-list__item">
        <a href="{{ .Page.Permalink }}">
          #{{ .Page.Title }}
          <span class="count">{{ .Count }}</span>
        </a>
      </li>
      {{- end }}
    </ul>

  </main>
  {{ partial "sidebar.html" . }}
</div>
{{ end }}