Redo the figure shortcode to take multiple images

Put all images in a flexbox container
This commit is contained in:
Eryn Wells 2023-08-02 17:16:30 -07:00
parent cce2a1670e
commit afc6e81b70
2 changed files with 41 additions and 11 deletions

View file

@ -1,11 +1,36 @@
{{- $img := (.Page.Resources.GetMatch (.Get "name")) -}}
{{- $resized_img := $img.Fit "1280x1280" -}}
{{- $altText := $img.Params.alt | default $img.Title -}}
{{- $imgs := slice -}}
{{- if .Get "name" -}}
{{- $imgs = $imgs | append (.Page.Resources.GetMatch (.Get "name")) -}}
{{- else if .Get "names" -}}
{{- range (split (.Get "names") ",") -}}
{{- $imgs = $imgs | append ($.Page.Resources.GetMatch .) -}}
{{- end -}}
{{- else -}}
{{ errorf "Missing name or names parameter to figures/image" }}
{{- end -}}
{{- if lt (len $imgs) 0 -}}
{{ errorf "No images found for name(s) parameter" }}
{{- end -}}
{{- $shouldShowTitle := (.Get "shouldShowTitle") | default true -}}
<figure>
<a href="{{ $img.RelPermalink }}">
<img src="{{ $resized_img.RelPermalink }}"{{ with $altText}} alt="{{ . }}"{{ end }}>
</a>
{{ if $img.Title }}
<figcaption>{{ $img.Title }}</figcaption>
{{ end }}
<div class=container>
{{ range $img := $imgs -}}
{{- $resizedImg := $img.Fit "1280x1280" -}}
{{- $altText := $img.Params.alt | default $img.Title -}}
<a href="{{ $img.RelPermalink }}">
<img src="{{ $resizedImg.RelPermalink }}"
{{- with $altText }} alt="{{ . }}"{{- end }}
{{- with $img.Title }} title="{{ . }}"{{- end }}>
</a>
{{- end }}
</div>
{{ if and $shouldShowTitle -}}
{{- range $imgs -}}
<figcaption>{{ .Title }}</figcaption>
{{- end -}}
{{- end }}
</figure>