<div class='shout card {{ .Params.feed_name }} filter-item' data-section="{{ .Section }}" data-sources='{{- partial "data/sources.html" . -}}' data-contributors='{{- partial "data/contributors.html" . -}}' data-tags='{{- partial "data/tags.html" . -}}'>
  <article class="h-entry shout">
    <header>
      {{ $postPermalink := .Permalink}}
      <time class="dt-published" datetime="{{ .Date.Format `Jan 02 2006` }}">{{ .Date.Format "Jan 02, 2006" }}</time>
      <h2 class="p-name"><a href="{{ .Permalink }}" class="u-url">{{ .Title }}</a></h2>
    </header>
    
    <div class="shout-source"><span class="from p-author">From {{ if .Params.contributors }}<b>{{range .Params.contributors}} <a href='{{ "/contributors/" | relLangURL }}{{ . | urlize }}/'> {{ . }}</a> {{end}}</b> at {{ end }}<a href="{{ "/sources/" | relLangURL }}{{ .Params.feed_name | urlize }}">{{ .Params.feed_name }}</a></span></div>

    {{ if .Params.featured_image }}
      {{ with $img := .Resources.GetMatch .Params.featured_image }}
      {{ $height := add $img.Height 0.0}}
      {{ $ratio := div $height $img.Width}}
      {{ $thumb := $img.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>
      {{end}}
    {{ else if (.Resources.ByType "image") }}
      {{ with (index (.Resources.ByType "image") 0) }}
        {{ $img := . }}
        {{ $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>
      {{ end }}
    {{ else }}
      <div class="p-summary">
      {{ end }}
      <div class="summary-text">
        {{ .Summary }}
      </div>
    </div>
  
    <footer class='post-footer'>
      <a href="{{ .RelPermalink }}">
        <svg width="11" height="11" viewBox="0 0 11 11" xmlns="http://www.w3.org/2000/svg">
          <path d="M10.2172 3.892C9.86979 3.02585 9.33722 2.34509 8.61023 1.77874C8.23826 1.49028 7.72957 1.04191 7.21547 0.839212C7.21382 0.703503 7.14487 0.575079 6.97767 0.503871C5.42624 -0.162284 3.69503 0.311299 2.52647 1.51482C1.94635 2.11223 1.51951 2.8478 1.21108 3.62501C0.914861 4.3676 0.507572 5.32483 0.948415 6.07996C1.00646 6.17836 1.09356 6.24193 1.1908 6.27306C1.2735 7.35573 1.57765 8.46801 2.37847 9.21874C3.2325 10.0162 4.43613 10.3053 5.5673 10.1773C6.72371 10.0468 7.96432 9.57061 8.8816 8.82474C9.01086 8.71974 9.1274 8.60844 9.23337 8.49296C9.27968 8.4924 9.32805 8.4875 9.37839 8.4718C11.3643 7.82491 10.8101 5.37347 10.2172 3.892Z" />
        </svg>
      </a>
    </footer>            
  </article>
</div>
