53 lines
1.6 KiB
HTML
53 lines
1.6 KiB
HTML
<!--
|
|
Render an image in a context-appropriate format and size.
|
|
|
|
@params src Image media file.
|
|
@params raw Force raw image only. Optional.
|
|
-->
|
|
|
|
<!-- Variable assignment -->
|
|
|
|
{{- $src := .src -}}
|
|
{{- $hint := default ( index $src.Params "hint" ) "" }}
|
|
{{- $format := cond ( and ( isset . "raw" ) .raw ) "" "webp" -}}
|
|
{{- $isResizable := not ( in ( slice "svg" "gif" ) $src.MediaType.SubType ) -}}
|
|
|
|
|
|
<!-- Rendering -->
|
|
|
|
<picture
|
|
class="picture"
|
|
itemprop="image"
|
|
>
|
|
{{ if $isResizable -}}
|
|
<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="{{- 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 }}
|
|
loading="lazy"
|
|
role="img"
|
|
/>
|
|
</picture>
|