28 lines
1.4 KiB
HTML
28 lines
1.4 KiB
HTML
{{/*
|
|
Responsives Bild aus static/img (über assets/img gemountet).
|
|
Parameter: src (z. B. "/img/about/Olly_compressed.jpg") oder res (fertige Ressource),
|
|
alt, sizes, widths, class, eager
|
|
*/}}
|
|
{{- $r := .res -}}
|
|
{{- $src := .src -}}
|
|
{{- if $r }}{{ $src = $r.Name }}{{ else }}{{ $r = resources.Get (strings.TrimPrefix "/" $src) }}{{ end -}}
|
|
{{- $alt := .alt | default "" -}}
|
|
{{- $sizes := .sizes | default "100vw" -}}
|
|
{{- $widths := .widths | default (slice 480 960 1600) -}}
|
|
{{- $loading := cond (.eager | default false) "eager" "lazy" -}}
|
|
{{- if and $r (in (slice ".jpg" ".jpeg" ".png") (lower (path.Ext $src))) -}}
|
|
{{- $set := slice -}}
|
|
{{- $fallback := "" -}}
|
|
{{- range $widths -}}
|
|
{{- if le . $r.Width -}}
|
|
{{- $img := $r.Resize (printf "%dx webp q78" .) -}}
|
|
{{- $set = $set | append (printf "%s %dw" $img.RelPermalink $img.Width) -}}
|
|
{{- $fallback = $img -}}
|
|
{{- end -}}
|
|
{{- end -}}
|
|
{{- if not $fallback -}}{{- $fallback = $r -}}{{- end -}}
|
|
<img src="{{ $fallback.RelPermalink }}"{{ with $set }} srcset="{{ delimit . ", " }}" sizes="{{ $sizes }}"{{ end }} width="{{ $r.Width }}" height="{{ $r.Height }}" alt="{{ $alt }}" loading="{{ $loading }}" decoding="async"{{ with $.class }} class="{{ . }}"{{ end }}>
|
|
{{- else -}}
|
|
<img src="{{ $src }}" alt="{{ $alt }}" loading="{{ $loading }}"{{ with .class }} class="{{ . }}"{{ end }}>
|
|
{{- end -}}
|