{{ define "main" }}
  <div class="container">
    <h1>{{ .Title }}</h1>

    {{ if eq .Type "articles" }}
      <div class="filter-bar">
        <button class="filter-btn active" data-filter="all">All</button>
        <button class="filter-btn" data-filter="tech">Tech</button>
        <button class="filter-btn" data-filter="life">Life</button>
        <button class="filter-btn" data-filter="quote">Quote</button>
        <button class="filter-btn" data-filter="link">Link</button>
        <button class="filter-btn" data-filter="photo">Photo</button>
      </div>

      <div class="feed-list" id="articles-feed">
        {{ range .Pages.ByDate.Reverse }}
          {{ $excerpt := .Params.excerpt }}
          {{ if not $excerpt }}
            {{ $excerpt = .Summary | plainify | truncate 150 }}
          {{ end }}

          {{ $data := dict "title" .Title "type" .Params.type "description" $excerpt "date" .Date "url" .RelPermalink "image" .Params.image "featured" false }}
          {{ partial "post-card.html" $data }}
        {{ end }}
      </div>
    {{ else }}
      {{ .Content }}
    {{ end }}
  </div>

  {{ if eq .Type "articles" }}
    {{ $filters := resources.Get "js/filters.js" | fingerprint }}
    <script defer src="{{ $filters.RelPermalink }}"></script>
  {{ end }}
{{ end }}