hugo-theme-stack-stars/layouts/_default/_markup/render-image.html
Jimmy Cai 2ad65a4c07
feat: add option to disable image processing (#83)
* feat: add option to disable image processing

closes https://github.com/CaiJimmy/hugo-theme-stack/issues/37

* refactor(list): use article/components/header inside default.html

* refactor: use .Fill for cover image
2020-12-23 21:02:35 +01:00

30 lines
No EOL
1.2 KiB
HTML

{{- $image := .Page.Resources.GetMatch (printf "%s" (.Destination | safeURL)) -}}
{{- if $image -}}
{{- $alt := .PlainText | safeHTML -}}
<figure style="flex-grow: {{ div (mul $image.Width 100) $image.Height }}; flex-basis: {{ div (mul $image.Width 240) $image.Height }}px">
<a href="{{ $image.RelPermalink }}" data-size="{{ $image.Width }}x{{ $image.Height }}">
{{- $Permalink := $image.RelPermalink -}}
{{- $Width := $image.Width -}}
{{- $Height := $image.Height -}}
{{- $Srcset := "" -}}
{{- if (default true .Page.Site.Params.imageProcessing.content.enabled) -}}
{{- $small := $image.Resize "480x" -}}
{{- $big := $image.Resize "1024x" -}}
{{- $Srcset = printf "%s 480w, %s 1024w" $small.RelPermalink $big.RelPermalink -}}
{{- end -}}
<img src="{{ $Permalink }}"
{{ with $Srcset }}srcset="{{ . }}"{{ end }}
width="{{ $Width }}"
height="{{ $Height }}"
loading="lazy"
{{ with $alt }}alt="{{ . }}"{{ end }}>
</a>
{{ with $alt }}
<figcaption>{{ . | markdownify }}</figcaption>
{{ end }}
</figure>
{{- else -}}
<img src="{{ .Destination | safeURL }}" alt="{{ .Text }}" {{ with .Title }} title="{{ . }}"{{ end }} />
{{- end -}}