<div class='book card filter-item'>
  <article class="h-entry book">
    <div class="tape-label book"><span><time class="dt-published" datetime="{{ .Date.Format `Jan 02 2006` }}">{{ .Date.Format "Jan 02, 2006" }}</time></span><div></div></div>
    
      {{ $postPermalink := .Permalink}}
    </header>

    {{ with (index (.Resources.ByType "image") 0) }}
      {{ $height := add .Height 0.0}}
      {{ $ratio := div $height .Width}}
      {{ $thumb := .Fit "540x540 q80 webp"}}
    <div class="p-summary{{if gt $ratio 1 }} portrait {{else}} landscape {{end}}">
      <div class="summary-image {{if gt $ratio 1 }} portrait {{else}} landscape {{end}}"> 
      <a href="{{ $postPermalink }}"><img src="{{ $thumb.Permalink }}"  alt="{{ .Title }}"> </a>
    </div>
      {{ else }}
      <div class="p-summary">
      {{ end }}
      <header>
      <h2 class="p-name"><a href="{{ .Permalink }}" class="u-url">
        {{.Title}}</a></h2>
      </header>
      <div class="summary-text">
        {{ .Summary }}
      </div>
      </div>
      <div class="shout-source"></div>

    <footer class='post-footer'>
      <div class='footer-metadata'>
      <span class="from p-author">{{ if .Params.authors }}By {{range .Params.authors}}<b> <a href='{{ "/authors/" | relLangURL }}{{ . | urlize }}/'> {{ . }}</a> {{end}}</b> on{{ end }}</span>
       
     {{ if .Truncated }}
        <div class="footer-filler"></div>
        <div class='read-more'><a href="{{ .RelPermalink }}">Read More…</a></div>
        {{ end }}
      </footer>            
  </article>
</div>