Files
portails/layouts/shortcodes/img.html
Marco Blessing 13434c9788 Merge upstream (#2)
* replaces possible backslash for win environments

like in hugo docs explained:  `.File.Path` returns paths joined by backslashes instead of slashes.

* Updating the README!

* Updating the README!

* Updating the README!

* Updating the README!

* Updating the README!

* Updating the README!

* Updating the README!

* Updating the README!

* Updating the README!

* Updating the README!

* Updating the README!

* fix mixture of permanent and relative links

* Updating the README!

* Updating the README!

* Replace highlightBlock with highlightElement

* Updating the README!

* Updating the README!

* deps: bump versions to latest

* Updating the README!

* Updating the README!

Co-authored-by: Henk Verlinde <henk@henkverlinde.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: Mike Pianka <47948499+mikepianka@users.noreply.github.com>
Co-authored-by: umatare5 <umatare5@gmail.com>
Co-authored-by: Henk Verlinde <henk@ventizo.com>
2021-04-19 19:19:03 +02:00

24 lines
1.2 KiB
HTML

{{ $image := .Page.Resources.GetMatch (printf "*%s*" (.Get "src")) -}}
{{ $lqip := $image.Resize $.Site.Params.lqipWidth -}}
{{ $imgSrc := "" -}}
{{ $imgSrcSet := slice -}}
{{ $widths := $.Site.Params.landscapePhotoWidths -}}
{{ if gt $image.Height $image.Width -}}
{{ $widths = $.Site.Params.portraitPhotoWidths -}}
{{ end -}}
{{ range $widths -}}
{{ $srcUrl := (printf "%dx" . | $image.Resize).Permalink -}}
{{ if eq $imgSrc "" -}}{{ $imgSrc = $srcUrl -}}{{ end -}}
{{ $imgSrcSet = $imgSrcSet | append (printf "%s %dw" $srcUrl .) -}}
{{ end -}}
{{ $imgSrcSet = (delimit $imgSrcSet ",") -}}
<figure{{ with .Get "class" }} class="{{.}}"{{ end }}>
<img class="img-fluid lazyload blur-up" data-sizes="auto" src="{{ $lqip.RelPermalink }}" data-srcset="{{ $imgSrcSet }}" width="{{ $image.Width }}" height="{{ $image.Height }}" {{ with .Get "alt" }}alt="{{.}}"{{ end }}>
<noscript><img class="img-fluid" sizes="100vw" srcset="{{ $imgSrcSet }}" src="{{ $image.RelPermalink }}" width="{{ $image.Width }}" height="{{ $image.Height }}" {{ with .Get "alt" }}alt="{{.}}"{{ end }}></noscript>
{{ with .Get "caption" }}<figcaption class="figure-caption">{{ . | safeHTML }}</figcaption>{{ end }}
</figure>