{{ $pages := .Paginate (where .Site.RegularPages "Type" "in" .Site.Params.mainSections) }} <div class="grid grid-catalog"> {{ range sort $pages.Pages "Date" "desc" }} {{ $original := resources.Get .Params.cover }} {{ $cover := $original.Resize "x320" }} {{ $cover2x := $original.Resize "x640" }} {{ $placeholder := $cover.Resize "x1" }} <div class="catalog-item"> <a class="catalog-item__content" href="{{ .Permalink }}"> <h2 class="catalog-item__album">{{ .Title }}</h2> <div class="catalog-item__artist">by {{ .Params.artist }}</div> <img class="catalog-item__visual" width="320" height="320" style="background-image: url(data:{{ $placeholder.MediaType }};base64,{{ $placeholder.Content | base64Encode }});" src="{{ $cover.Permalink }}" srcset="{{ $cover.Permalink }} 1x, {{ $cover2x.Permalink }} 2x" alt="{{ .Title }} album's cover'" title="{{ .Title }} album's cover'" > </a> </div> {{ end }} </div>