Files
knaeckeboot-eu/themes/bluewater/layouts/_default/_markup/render-image.html
T
2024-04-08 16:48:18 +02:00

33 lines
1.0 KiB
HTML

{{- $image := .Page.Resources.GetMatch .Destination -}}
{{- if $image -}}
{{ $tiny := $image.Resize "500x webp q80" }}
{{ $small := $image.Resize "800x webp q80" }}
{{ $medium := $image.Resize "1200x webp q80" }}
{{ $large := $image.Resize "1500x webp q80" }}
{{ $classes := ""}}
{{ if gt $image.Height $image.Width }}
{{ $classes = "mx-12 md:mx-32"}}
{{ else }}
{{ $classes = "mx-4 md:mx-12"}}
{{ end }}
<div class="flex justify-center {{ print $classes }}">
<a href="{{- $image.RelPermalink -}}">
<picture>
<source media="(max-width: 376px)"
srcset="{{ $tiny.RelPermalink }}">
<source media="(max-width: 992px)"
srcset="{{ $small.RelPermalink }}">
<source media="(max-width: 1400px)"
srcset="{{ $medium.RelPermalink }}">
<source media="(min-width: 1401px)"
srcset="{{ $large.RelPermalink }}">
<img
alt="{{ .Text }}" src="{{ $image.RelPermalink }}"
height="{{ $image.Height}}" width="{{ $image.Width }}">
</picture>
</a>
</div>
{{- end -}}