{{- $optimized := partial "optimize-image" . -}}

{{- with .Inner }}
<figure>
  <picture>
    <img src="{{ $optimized.Permalink }}" width="{{ $.Scratch.Get "displayWidth" }}" height="{{ $.Scratch.Get "displayHeight" }}"
         alt="{{ . | markdownify | plainify | safeHTMLAttr }}" title="{{ . | markdownify | plainify | safeHTMLAttr }}">
  </picture>
  <figcaption>{{ . | $.Page.RenderString | safeHTML }}</figcaption>
</figure>
{{- else -}}
<p><img src="{{ $optimized.Permalink }}" width="{{ $.Scratch.Get "displayWidth" }}" height="{{ $.Scratch.Get "displayHeight" }}"
     {{- with .Get "alt" }} alt="{{ . | safeHTMLAttr }}" title="{{ . | safeHTMLAttr }}"{{ end }}></p>
{{- end }}