{{ define "main" }}
<section>
  <header>
    <h1>Themes</h1>
    <p data-text="dim">{{ len .Data.Terms }} threads running through the garden</p>
  </header>

  <div class="tag-cloud">
    {{- $max := 0 -}}
    {{- range .Data.Terms.Alphabetical -}}
      {{- if gt .Count $max }}{{ $max = .Count }}{{ end -}}
    {{- end -}}

    {{- range .Data.Terms.ByCount -}}
      {{- $weight := div (mul .Count 100) $max -}}
      {{- $size := add 80 (div (mul $weight 120) 100) -}}
      <a href="{{ .Page.RelPermalink }}"
         class="tag-weight"
         style="font-size: {{ $size }}%{{ if ge $weight 60 }}; color: var(--garden-dialogue){{ else if ge $weight 30 }}; color: var(--garden-text-dim){{ else }}; color: var(--garden-text-faint){{ end }}"
         title="{{ .Count }} {{ if eq .Count 1 }}piece{{ else }}pieces{{ end }}">
        {{ .Page.Title }}
        <small>{{ .Count }}</small>
      </a>
    {{- end }}
  </div>
</section>
{{ end }}