|
|
@ -6,40 +6,36 @@ Renders an image with the given class, alt, and sizes. |
|
|
|
@context {classes} classes for the image. |
|
|
|
*/}} |
|
|
|
|
|
|
|
|
|
|
|
{{ $alt := .alt }} |
|
|
|
{{ $image := .image }} |
|
|
|
{{ $sizes := .sizes }} |
|
|
|
{{ $classes := .classes }} |
|
|
|
|
|
|
|
{{- $alt := .alt }} |
|
|
|
{{- $image := .image }} |
|
|
|
{{- $sizes := .sizes }} |
|
|
|
{{- $classes := .classes }} |
|
|
|
|
|
|
|
{{- $srcsetParts := slice }} |
|
|
|
{{- $sizesParts := slice }} |
|
|
|
{{- $len := len $sizes }} |
|
|
|
|
|
|
|
{{/* Loop through widths to resize images and build attributes */}} |
|
|
|
{{- range $index, $width := $sizes }} |
|
|
|
{{- $resizeSpec := printf "%dx webp q90" $width }} |
|
|
|
{{- $resized := ($image.Resize $resizeSpec) }} |
|
|
|
|
|
|
|
{{- $srcsetParts = $srcsetParts | append (printf "%s %dw" $resized.RelPermalink $width) }} |
|
|
|
|
|
|
|
{{- /* Build sizes: media query for all but the last width */}} |
|
|
|
{{- if lt $index (sub $len 1) }} |
|
|
|
{{- $nextWidth := index $sizes (add $index 1) }} |
|
|
|
{{- $sizesParts = $sizesParts | append (printf "(max-width: %dpx) %dpx" $nextWidth $width) }} |
|
|
|
{{- else }} |
|
|
|
{{- $sizesParts = $sizesParts | append (printf "%dpx" $width) }} |
|
|
|
{{- end }} |
|
|
|
{{- end }} |
|
|
|
|
|
|
|
{{- $smallestWidth := index $sizes 0 }} |
|
|
|
{{- $smallestResizeSpec := printf "%dx webp q90" $smallestWidth }} |
|
|
|
{{- $smallest := ($image.Resize $smallestResizeSpec) }} |
|
|
|
{{- $src := $smallest.RelPermalink }} |
|
|
|
<img class="{{ delimit $classes " " }}" |
|
|
|
{{ $srcsetParts := slice }} |
|
|
|
{{ $sizesParts := slice }} |
|
|
|
{{ $len := len $sizes }} |
|
|
|
|
|
|
|
{{/* Loop through widths to resize images and build attributes */}} |
|
|
|
{{ range $index, $width := $sizes }} |
|
|
|
{{ $resizeSpec := printf "%dx webp q90" $width }} |
|
|
|
{{ $resized := ($image.Resize $resizeSpec) }} |
|
|
|
|
|
|
|
{{ $srcsetParts = $srcsetParts | append (printf "%s %dw" $resized.RelPermalink $width) }} |
|
|
|
|
|
|
|
{{/* Build sizes: media query for all but the last width */}} |
|
|
|
{{ if lt $index (sub $len 1) }} |
|
|
|
{{ $nextWidth := index $sizes (add $index 1) }} |
|
|
|
{{ $sizesParts = $sizesParts | append (printf "(max-width: %dpx) %dpx" $nextWidth $width) }} |
|
|
|
{{ else }} |
|
|
|
{{ $sizesParts = $sizesParts | append (printf "%dpx" $width) }} |
|
|
|
{{ end }} |
|
|
|
{{ end }} |
|
|
|
|
|
|
|
{{/* Set src to the smallest image */}} |
|
|
|
{{ $smallestWidth := index $sizes 0 }} |
|
|
|
{{ $smallestResizeSpec := printf "%dx webp q90" $smallestWidth }} |
|
|
|
{{ $smallest := ($image.Resize $smallestResizeSpec) }} |
|
|
|
{{ $src := $smallest.RelPermalink }} |
|
|
|
|
|
|
|
{{/* Output attributes */}} |
|
|
|
src="{{ $src }}" |
|
|
|
srcset="{{ delimit $srcsetParts ", " }}" |
|
|
|
sizes="{{ delimit $sizesParts ", " }}" |
|
|
|