36 lines
1.1 KiB
HTML
36 lines
1.1 KiB
HTML
|
<ul class="photos-list">
|
||
|
|
{{ range . }}
|
||
|
|
<li>
|
||
|
|
<a href="{{ .Permalink }}">
|
||
|
|
{{ $page := . }}
|
||
|
|
{{ $alt := or .Title "image" }}
|
||
|
|
<figure class="photo">
|
||
|
|
{{ with resources.GetMatch .Params.photo_asset}}
|
||
|
|
|
||
|
|
{{ $smallw := default "640x webp Lanczos" }}
|
||
|
|
{{ $mediumw := default "960x webp Lanczos" }}
|
||
|
|
{{ $largew := default "1280x webp Lanczos" }}
|
||
|
|
|
||
|
|
{{ $page.Scratch.Set "small" (.Resize $smallw) }}
|
||
|
|
{{ $page.Scratch.Set "medium" (.Resize $mediumw) }}
|
||
|
|
{{ $page.Scratch.Set "large" (.Resize $largew) }}
|
||
|
|
|
||
|
|
{{ $small := $page.Scratch.Get "small" }}
|
||
|
|
{{ $medium := $page.Scratch.Get "medium" }}
|
||
|
|
{{ $large := $page.Scratch.Get "large" }}
|
||
|
|
|
||
|
|
<picture>
|
||
|
|
<source media="(max-width: 80rem)" srcset="{{ $small.Permalink }}" />
|
||
|
|
<source media="(max-width: 100rem)" srcset="{{ $medium.Permalink }}" />
|
||
|
|
<img class="photo-asset" src="{{ $large.Permalink }}" alt="{{ $alt }}" title="{{ $alt }}">
|
||
|
|
</picture>
|
||
|
|
{{ end }}
|
||
|
|
<figcaption class="photo-details">
|
||
|
|
<p class="photo-title">{{ .Title }}</p>
|
||
|
|
<p class="photo-summary">{{ .Summary }}</p>
|
||
|
|
</figcaption>
|
||
|
|
</figure>
|
||
|
|
</a>
|
||
|
|
</li>
|
||
|
|
{{end}}
|
||
|
|
</ul>
|