use get-image partial

This commit is contained in:
Ben Goldsworthy 2025-06-04 17:57:21 +02:00
parent ed9e769b2d
commit edba5d203e
No known key found for this signature in database
8 changed files with 94 additions and 47 deletions

View file

@ -1,12 +1,15 @@
<!--
Render an image in a context-appropriate format and size.
@params context Image media file.
@params src Image media file.
@params raw Force raw image only. Optional.
-->
<!-- Variable assignment -->
{{- $src := . -}}
{{- $src := .src -}}
{{- $hint := default ( index $src.Params "hint" ) "" }}
{{- $format := cond ( and ( isset . "raw" ) .raw ) "" "webp" -}}
{{- $isResizable := not ( in ( slice "svg" "gif" ) $src.MediaType.SubType ) -}}
@ -17,18 +20,30 @@
itemprop="image"
>
{{ if $isResizable -}}
<source srcset="{{- ($src.Resize "1200x webp").RelPermalink -}}" />
<source
srcset="{{- ($src.Resize "800x png").RelPermalink -}}"
media="(max-width: 800px)"
<source
srcset="{{- partialCached "images/get-image.html" ( dict "img" $src "size" "same" "format" $format ) $src.Title -}}"
/>
{{- if gt $src.Width 1200 -}}
<source
srcset="{{- partialCached "images/get-image.html" ( dict "img" $src "size" "1200x" "format" $format ) ( printf "%s-1200x" $src.Title ) -}}"
media="(max-width: 1200px)"
/>
{{- end -}}
{{- if gt $src.Width 800 -}}
<source
srcset="{{- partialCached "images/get-image.html" ( dict "img" $src "size" "800x" "format" $format ) ( printf "%s-800x" $src.Title ) -}}"
media="(max-width: 800px)"
/>
{{- end -}}
{{- end }}
<img
class="u-photo picture__image"
{{ if not $isResizable -}}
src="{{- $src.RelPermalink -}}"
{{- else -}}
src="{{- ($src.Resize "1200x webp").RelPermalink -}}" width="{{- $src.Width -}}" height="{{- $src.Height -}}"
src="{{- partialCached "images/get-image.html" ( dict "img" $src "format" $format ) $src.Title -}}"
width="{{- $src.Width -}}"
height="{{- $src.Height -}}"
{{- end }}
{{ with $src.Params.alt -}}alt="{{- . -}}"{{- end }}
{{ with $src.Params.title -}}title="{{- . -}}"{{- end }}