From 5d4370b617ea08c535db42f4c6bd82c1b25358a4 Mon Sep 17 00:00:00 2001 From: Robert Kaussow Date: Sun, 11 Dec 2022 15:05:30 +0100 Subject: [PATCH] feat: add basic svg support to the img shortcode (#554) --- .../content/en/shortcodes/images/_index.md | 16 ++++ .../content/en/shortcodes/images/forest-8.svg | 90 +++++++++++++++++++ layouts/shortcodes/img.html | 54 +++++++---- 3 files changed, 141 insertions(+), 19 deletions(-) create mode 100644 exampleSite/content/en/shortcodes/images/forest-8.svg diff --git a/exampleSite/content/en/shortcodes/images/_index.md b/exampleSite/content/en/shortcodes/images/_index.md index 60038eb..951c686 100644 --- a/exampleSite/content/en/shortcodes/images/_index.md +++ b/exampleSite/content/en/shortcodes/images/_index.md @@ -36,6 +36,11 @@ resources: title: Forest (7) params: credits: "[Asher Ward](https://unsplash.com/@the_asher_ward) on [Unsplash](https://unsplash.com/s/photos/forest)" + - name: forest-8 + src: "forest-8.svg" + title: Forest (8) + params: + credits: "SVG Repo on [SVGRepo](https://www.svgrepo.com/svg/286078/forest)" --- If you need more flexibility for your embedded images, you could use the `img` shortcode. It is using Hugo's @@ -144,3 +149,14 @@ copious quo ad. Stet probates in duo. {{< img name="forest-7" lazy=true >}} + +Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates +investiture. Ornateness bland it ex enc, est yeti am bongo detract re. Pro ad prompts +feud gait, quid exercise emeritus bis e. In pro quints consequent, denim fastidious +copious quo ad. Stet probates in duo. + + + +{{< img name="forest-8" size=small lazy=true >}} + + diff --git a/exampleSite/content/en/shortcodes/images/forest-8.svg b/exampleSite/content/en/shortcodes/images/forest-8.svg new file mode 100644 index 0000000..716ea38 --- /dev/null +++ b/exampleSite/content/en/shortcodes/images/forest-8.svg @@ -0,0 +1,90 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/layouts/shortcodes/img.html b/layouts/shortcodes/img.html index f630d83..f76eaf2 100644 --- a/layouts/shortcodes/img.html +++ b/layouts/shortcodes/img.html @@ -2,18 +2,26 @@ {{- $customAlt := .Get "alt" }} {{- $customSize := .Get "size" | lower }} {{- $lazyLoad := default (default true $.Site.Params.GeekdocImageLazyLoading) (.Get "lazy") }} +{{- $data := newScratch }} {{- with $source }} {{- $caption := default .Title $customAlt }} + {{- $isSVG := (eq .MediaType.SubType "svg") }} {{- $origin := .Permalink }} - {{- $profile := (.Fill "180x180 Center").Permalink }} - {{- $tiny := (.Resize "320x").Permalink }} - {{- $small := (.Resize "600x").Permalink }} - {{- $medium := (.Resize "1200x").Permalink }} - {{- $large := (.Resize "1800x").Permalink }} - - {{- $size := dict "origin" $origin "profile" $profile "tiny" $tiny "small" $small "medium" $medium "large" $large }} + {{ if $isSVG }} + {{- $data.SetInMap "size" "profile" "180" }} + {{- $data.SetInMap "size" "tiny" "320" }} + {{- $data.SetInMap "size" "small" "600" }} + {{- $data.SetInMap "size" "medium" "1200" }} + {{- $data.SetInMap "size" "large" "1800" }} + {{ else }} + {{- $data.SetInMap "size" "profile" (.Fill "180x180 Center").Permalink }} + {{- $data.SetInMap "size" "tiny" (.Resize "320x").Permalink }} + {{- $data.SetInMap "size" "small" (.Resize "600x").Permalink }} + {{- $data.SetInMap "size" "medium" (.Resize "1200x").Permalink }} + {{- $data.SetInMap "size" "large" (.Resize "1800x").Permalink }} + {{ end }}
@@ -23,21 +31,29 @@ > - + {{- $size := $data.Get "size" }} + {{- if not $isSVG }} + + {{- end }} {{ $caption }}