{{define "postlist"}}
{{if .Posts}}
{{range .Posts}}
<div class="card mb-3">
  <div class="card-image">
    <figure class="image is-2by1 is-fullwidth">
      <img src="{{.HeaderImage.Location}}" alt="Header image" />
    </figure>
  </div>
  <header class="card-header">
    <div class="card-header-title fixed-grid has-1-cols pb-0">
      <div class="grid">
        <div class="cell">
          <h3 class="is-size-3 has-text-weight-bold">{{.Title}}</h3>
        </div>
        <div class="cell">
          <div class="field is-grouped is-grouped-multiline">
            {{range .Tags}}
            <div class="control">
              <a href="/blog?filter={{pathEscape .Name}}" class="tag {{.Color}} post-tag">{{.Name}}</a>
            </div>
            {{end}}
          </div>
        </div>
      </div>
    </div> 
    <p class="card-header-icon">
      Posted {{humanDate .Created}}
      {{if (ne .Modified .Created)}}
      <br>
      Edited &nbsp;{{humanDate .Modified}}
      {{end}}
    </p>
  </header>
  <div class="card-content is-clipped readmore-card">
    <div class="content">
      {{.Description}}
    </div>
  </div>
  <div class="card-footer">
    <a href="/blog/post/{{.URL}}" class="card-footer-item">Read Full Post</a>
    {{if $.IsAuthenticated}}
    {{if not .IsDraft}}
    <a class="card-footer-item" href="/blog/edit/{{.ID}}">Edit Post</a>
    {{else}}
    <a class="card-footer-item" href="/blog/drafts/edit/{{.ID}}">Edit Draft</a>
    {{end}}
    {{end}}
  </div>
</div>
{{end}}
{{else}}
<div class="is-flex is-justify-content-center">
  <p>There's nothing here!</p>
</div>
{{end}}
{{end}}