From c237e04744eb32bc29136ec801d06ff925908c23 Mon Sep 17 00:00:00 2001
From: stereobooster <stereobooster@gmail.com>
Date: Tue, 31 Oct 2023 17:53:15 +0100
Subject: [PATCH 1/8] Example of integration of picture partial

---
 config/_default/params.toml                |  1 +
 exampleSite/config/_default/params.toml    |  1 +
 layouts/_default/_markup/render-image.html | 78 +++++---------------
 layouts/partials/picture.html              | 85 ++++++++++++++++++++++
 layouts/partials/pictureDefaults.html      |  7 ++
 layouts/shortcodes/figure.html             | 52 ++++---------
 6 files changed, 126 insertions(+), 98 deletions(-)
 create mode 100644 layouts/partials/picture.html
 create mode 100644 layouts/partials/pictureDefaults.html

diff --git a/config/_default/params.toml b/config/_default/params.toml
index f2d3fcfb..6e6b46dc 100644
--- a/config/_default/params.toml
+++ b/config/_default/params.toml
@@ -12,6 +12,7 @@ autoSwitchAppearance = true
 enableSearch = false
 enableCodeCopy = false
 enableImageLazyLoading = true
+enableImageWebp = true
 
 # robots = ""
 fingerprintAlgorithm = "sha256"
diff --git a/exampleSite/config/_default/params.toml b/exampleSite/config/_default/params.toml
index 2b3fa153..3317d667 100644
--- a/exampleSite/config/_default/params.toml
+++ b/exampleSite/config/_default/params.toml
@@ -12,6 +12,7 @@ autoSwitchAppearance = true
 enableSearch = true
 enableCodeCopy = true
 enableImageLazyLoading = true
+enableImageWebp = true
 
 # robots = ""
 fingerprintAlgorithm = "sha256"
diff --git a/layouts/_default/_markup/render-image.html b/layouts/_default/_markup/render-image.html
index ac82a6aa..2e7a5b53 100644
--- a/layouts/_default/_markup/render-image.html
+++ b/layouts/_default/_markup/render-image.html
@@ -1,64 +1,20 @@
 {{ $url := urls.Parse .Destination }}
 {{ $altText := .Text }}
 {{ $caption := .Title }}
-{{ $lazyLoad := $.Page.Site.Params.enableImageLazyLoading | default true }}
-{{ if findRE "^https?" $url.Scheme }}
-  <figure>
-    <img
-      class="mx-auto my-0 rounded-md"
-      src="{{ $url.String }}"
-      alt="{{ $altText }}" 
-      {{ if $lazyLoad }}
-        loading="lazy"
-      {{ end }}
-    />
-    {{ with $caption }}<figcaption class="text-center">{{ . | markdownify }}</figcaption>{{ end }}
-  </figure>
-{{ else }}
-  {{ $resource := "" }}
-  {{ if $.Page.Resources.GetMatch ($url.String) }}
-    {{ $resource = $.Page.Resources.GetMatch ($url.String) }}
-  {{ else if resources.GetMatch ($url.String) }}
-    {{ $resource = resources.Get ($url.String) }}
-  {{ end }}
-  {{ with $resource }}
-    <figure>
-      <img
-        class="mx-auto my-0 rounded-md"
-        {{ if eq .MediaType.SubType "svg" }}
-          src="{{ .RelPermalink }}"
-        {{ else }}
-          width="{{ .Width }}"
-          height="{{ .Height }}"
-          {{ if lt .Width 660 }}
-            src="{{ .RelPermalink }}"
-          {{ else }}
-            srcset="
-            {{- (.Resize "330x").RelPermalink }} 330w,
-            {{- (.Resize "660x").RelPermalink }} 660w,
-            {{- (.Resize "1024x").RelPermalink }} 1024w,
-            {{- (.Resize "1320x").RelPermalink }} 2x"
-            src="{{ (.Resize "660x").RelPermalink }}"
-          {{ end }}
-        {{ end }}
-        alt="{{ $altText }}"
-        {{ if $lazyLoad }}
-          loading="lazy"
-        {{ end }}
-      />
-      {{ with $caption }}<figcaption class="text-center">{{ . | markdownify }}</figcaption>{{ end }}
-    </figure>
-  {{ else }}
-    <figure>
-      <img
-        class="mx-auto my-0 rounded-md"
-        src="{{ $url.String }}"
-        alt="{{ $altText }}"
-        {{ if $lazyLoad }}
-          loading="lazy"
-        {{ end }}
-      />
-      {{ with $caption }}<figcaption class="text-center">{{ . | markdownify }}</figcaption>{{ end }}
-    </figure>
-  {{ end }}
-{{ end }}
\ No newline at end of file
+{{ $class := "mx-auto my-0 rounded-md" }}
+
+{{ $file := $url.Path }}
+{{ $img := .Page.Resources.GetMatch $file }}
+{{- if and (not $img) .Page.File }}
+    {{ $path := path.Join .Page.File.Dir $file }}
+    {{ $img = resources.Get $path }}
+{{ end -}}
+
+<figure>
+  {{- with $img -}}
+    {{ partial "pictureDefaults.html" (dict "img" . "alt" $altText "class" $class) }}
+  {{- else -}}
+    <img src="{{ .Destination | safeURL }}" alt="{{ $altText }}" class="{{ $class }}"/>
+  {{- end -}}
+  {{ with $caption }}<figcaption class="text-center">{{ . | markdownify }}</figcaption>{{ end }}
+</figure>
diff --git a/layouts/partials/picture.html b/layouts/partials/picture.html
new file mode 100644
index 00000000..4d5aa7e3
--- /dev/null
+++ b/layouts/partials/picture.html
@@ -0,0 +1,85 @@
+{{ $img := .img }}
+{{ $alt := .alt }}
+{{ $class := .class }}
+{{ $lazy := .lazy }}
+{{ $webp := .webp }}
+{{ $lqip := .lqip }}
+
+{{ with $img }}
+  {{ if (eq .MediaType.SubType "svg") }}
+    {{ $width := ""}}
+    {{ $height := ""}}
+    {{ $svgContent := .Content }}
+    {{ range (findRESubmatch `<svg[^>]*width=["']([.0-9]*)["'a-zA-Z]` $svgContent 1) }}
+      {{ $width = index . 1 }}
+    {{ end }}
+    {{ range (findRESubmatch `<svg[^>]*height=["']([.0-9]*)["'a-zA-Z]` $svgContent 1) }}
+      {{ $height = index . 1 }}
+    {{ end }}
+    {{ if (eq "" $width $height) }}
+      {{ range (findRESubmatch `<svg[^>]*viewBox=["']?([.0-9]*) ([.0-9]*) ([.0-9]*) ([.0-9]*)` $svgContent 1) }}
+        {{ $width = index . 3 }}
+        {{ $height = index . 4 }}
+      {{ end }}
+    {{ end }}
+    {{ if (eq "" $width $height) }}
+      {{ warnf "Can't detect width and height for SVG %s" .RelPermalink }}
+      {{/* do not use lazy without dimensions */}}
+      {{ $lazy = false }}
+    {{ end }}
+    <picture {{ with $class }} class="{{ . }}" {{ end }}>
+      <img
+        src="{{ .RelPermalink }}"
+        {{ with $width }} width="{{ . }}" {{ end }}
+        {{ with $height }} height="{{ . }}" {{ end }}
+        {{ with $class }} class="{{ . }}" {{ end }}
+        {{ with $alt }} alt="{{ . }}" {{ end }}
+        {{ with $lazy }} loading="lazy" decoding="async" {{ end }}
+      >
+    </picture>
+  {{ else }}
+    <picture 
+      {{ with $class }} class="{{ . }}" {{ end }}
+      {{ if $lqip }}
+        {{ $bg := (.Resize "20x webp q20").Content | base64Encode }}
+        style="background-image:url(data:image/webp;base64,{{ $bg }});background-size:cover"
+      {{ end }}
+    >
+    {{ if $webp }}
+      <source 
+        {{ if lt .Width 660 }}
+          {{ with .Resize (printf "%dx%d webp" .Width .Height) }}
+            src="{{ .RelPermalink }}"
+          {{ end }}
+        {{ else }}
+          srcset="
+            {{- (.Resize "330x webp").RelPermalink }} 330w,
+            {{- (.Resize "660x webp").RelPermalink }} 660w,
+            {{- (.Resize "1024x webp").RelPermalink }} 1024w,
+            {{- (.Resize "1320x webp").RelPermalink }} 2x"
+          src="{{ (.Resize "660x webp").RelPermalink }}" 
+        {{ end }}
+        type="image/webp" 
+      />
+    {{ end }}
+      <img
+        src="{{ .RelPermalink }}"
+        width="{{ .Width }}"
+        height="{{ .Height }}"
+        {{ with $class }} class="{{ . }}" {{ end }}
+        {{ with $alt }} alt="{{ . }}" {{ end }}
+        {{ with $lazy }} loading="lazy" decoding="async" {{ end }}
+        {{ if lt .Width 660 }}
+          src="{{ .RelPermalink }}"
+        {{ else }}
+          srcset="
+          {{- (.Resize "330x").RelPermalink }} 330w,
+          {{- (.Resize "660x").RelPermalink }} 660w,
+          {{- (.Resize "1024x").RelPermalink }} 1024w,
+          {{- (.Resize "1320x").RelPermalink }} 2x"
+          src="{{ (.Resize "660x").RelPermalink }}"
+        {{ end }}
+      >
+    </picture>
+  {{ end }}
+{{ end }}
\ No newline at end of file
diff --git a/layouts/partials/pictureDefaults.html b/layouts/partials/pictureDefaults.html
new file mode 100644
index 00000000..1e31be6c
--- /dev/null
+++ b/layouts/partials/pictureDefaults.html
@@ -0,0 +1,7 @@
+{{ $img := .img }}
+{{ $alt := .alt }}
+{{ $class := .class }}
+{{ $lazy := $.Page.Site.Params.enableImageLazyLoading | default true }}
+{{ $webp := $.Page.Site.Params.enableImageWebp | default true }}
+{{ $lqip := false }}
+{{ partial "picture.html" (dict "img" $img "alt" $alt "class" $class "lazy" $lazy "webp" $webp "lqip" $lqip) }}
\ No newline at end of file
diff --git a/layouts/shortcodes/figure.html b/layouts/shortcodes/figure.html
index 7028c6c1..f0d49dfe 100644
--- a/layouts/shortcodes/figure.html
+++ b/layouts/shortcodes/figure.html
@@ -6,45 +6,23 @@
   {{ $caption := .Get "caption" }}
   {{ $href := .Get "href" }}
   {{ $class := .Get "class" }}
+
+  {{ $file := $url.Path }}
+  {{ $img := .Page.Resources.GetMatch $file }}
+  {{- if and (not $img) .Page.File }}
+    {{ $path := path.Join .Page.File.Dir $file }}
+    {{ $img = resources.Get $path }}
+  {{ end -}}
+
   <figure{{ with $class }} class="{{ . }}"{{ end }}>
     {{ with $href }}<a href="{{ . }}">{{ end }}
-    <img
-      class="mx-auto my-0 rounded-md"
-      alt="{{ $altText }}"
-      {{ if .Site.Params.enableImageLazyLoading | default true }}
-        loading="lazy"
-      {{ end }}
-      {{ if findRE "^https?" $url.Scheme }}
-        src="{{ $url.String }}"
-      {{ else }}
-        {{ $resource := "" }}
-        {{ if $.Page.Resources.GetMatch ($url.String) }}
-          {{ $resource = $.Page.Resources.GetMatch ($url.String) }}
-        {{ else if resources.GetMatch ($url.String) }}
-          {{ $resource = resources.Get ($url.String) }}
-        {{ end }}
-        {{ with $resource }}
-          {{ if eq .MediaType.SubType "svg" }}
-            src="{{ .RelPermalink }}"
-          {{ else }}
-            width="{{ .Width }}"
-            height="{{ .Height }}"
-            {{ if lt .Width 660 }}
-              src="{{ .RelPermalink }}"
-            {{ else }}
-              srcset="
-              {{- (.Resize "330x").RelPermalink }} 330w,
-              {{- (.Resize "660x").RelPermalink }} 660w,
-              {{- (.Resize "1024x").RelPermalink }} 1024w,
-              {{- (.Resize "1320x").RelPermalink }} 2x"
-              src="{{ (.Resize "660x").RelPermalink }}"
-            {{ end }}
-          {{ end }}
-        {{ else }}
-          src="{{ $url.String }}"
-        {{ end }}
-      {{ end }}
-    />
+
+    {{- with $img -}}
+      {{ partial "pictureDefaults.html" (dict "img" . "alt" $altText "class" $class) }}
+    {{- else -}}
+      <img src="{{ $url.String }}" alt="{{ $altText }}" class="{{ $class }}"/>
+    {{- end -}}
+
     {{ with $href }}</a>{{ end }}
     {{ with $caption }}<figcaption class="text-center">{{ . | markdownify }}</figcaption>{{ end }}
   </figure>

From 978791808f9d28377164ed7602d1003a9b7dc68e Mon Sep 17 00:00:00 2001
From: stereobooster <stereobooster@gmail.com>
Date: Tue, 31 Oct 2023 18:14:03 +0100
Subject: [PATCH 2/8] integrate in single.html

---
 layouts/_default/single.html | 22 +++-------------------
 1 file changed, 3 insertions(+), 19 deletions(-)

diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 340e95a1..90e41daa 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -15,25 +15,9 @@
       </div>
       {{ with $feature }}
         <div class="prose">
-          <img
-            class="mb-6 -mt-4 rounded-md"
-            {{ if eq .MediaType.SubType "svg" }}
-              src="{{ .RelPermalink }}"
-            {{ else }}
-              width="{{ .Width }}"
-              height="{{ .Height }}"
-              {{ if lt .Width 660 }}
-                src="{{ .RelPermalink }}"
-              {{ else }}
-                srcset="
-                {{- (.Resize "330x").RelPermalink }} 330w,
-                {{- (.Resize "660x").RelPermalink }} 660w,
-                {{- (.Resize "1024x").RelPermalink }} 1024w,
-                {{- (.Resize "1320x").RelPermalink }} 2x"
-              {{ end }}
-            {{ end }}
-            alt="{{ $.Params.featureAlt | default $.Params.coverAlt | default "" }}"
-          />
+          {{ $altText := $.Params.featureAlt | default $.Params.coverAlt | default "" }}
+          {{ $class := "mb-6 -mt-4 rounded-md" }}
+          {{ partial "pictureDefaults.html" (dict "img" . "alt" $altText "class" $class) }}
           {{ with $.Params.coverCaption }}
             <figcaption class="mb-6 -mt-3 text-center">{{ . | markdownify }}</figcaption>
           {{ end }}

From 3ffe2b1002b4c4cae0b3b61ca6c63f263c7762ba Mon Sep 17 00:00:00 2001
From: stereobooster <stereobooster@gmail.com>
Date: Sun, 26 Nov 2023 01:21:36 +0100
Subject: [PATCH 3/8] do not upscale images in picture shortcode

---
 layouts/partials/picture.html | 20 ++++++++++++++------
 1 file changed, 14 insertions(+), 6 deletions(-)

diff --git a/layouts/partials/picture.html b/layouts/partials/picture.html
index 4d5aa7e3..47ffe103 100644
--- a/layouts/partials/picture.html
+++ b/layouts/partials/picture.html
@@ -54,9 +54,13 @@
         {{ else }}
           srcset="
             {{- (.Resize "330x webp").RelPermalink }} 330w,
-            {{- (.Resize "660x webp").RelPermalink }} 660w,
-            {{- (.Resize "1024x webp").RelPermalink }} 1024w,
-            {{- (.Resize "1320x webp").RelPermalink }} 2x"
+            {{- (.Resize "660x webp").RelPermalink }} 660w
+            {{ if gt .Width 1024 }}
+              ,{{ (.Resize "1024x webp").RelPermalink }} 1024w
+            {{ end }}
+            {{ if gt .Width 1320 }}
+              ,{{ (.Resize "1320x webp").RelPermalink }} 2x
+            {{ end }}"
           src="{{ (.Resize "660x webp").RelPermalink }}" 
         {{ end }}
         type="image/webp" 
@@ -74,9 +78,13 @@
         {{ else }}
           srcset="
           {{- (.Resize "330x").RelPermalink }} 330w,
-          {{- (.Resize "660x").RelPermalink }} 660w,
-          {{- (.Resize "1024x").RelPermalink }} 1024w,
-          {{- (.Resize "1320x").RelPermalink }} 2x"
+          {{- (.Resize "660x").RelPermalink }} 660w
+          {{ if gt .Width 1024 }}
+            ,{{ (.Resize "1024x").RelPermalink }} 1024w
+          {{ end }}
+          {{ if gt .Width 1320 }}
+            ,{{ (.Resize "1320x").RelPermalink }} 2x
+          {{ end }}"
           src="{{ (.Resize "660x").RelPermalink }}"
         {{ end }}
       >

From 8cfe33965bee26cab2190bd6e6fc7706c77945b5 Mon Sep 17 00:00:00 2001
From: stereobooster <stereobooster@gmail.com>
Date: Sun, 26 Nov 2023 02:02:09 +0100
Subject: [PATCH 4/8] use original image as backup for srcset

---
 layouts/partials/picture.html | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/layouts/partials/picture.html b/layouts/partials/picture.html
index 47ffe103..9056f224 100644
--- a/layouts/partials/picture.html
+++ b/layouts/partials/picture.html
@@ -57,9 +57,17 @@
             {{- (.Resize "660x webp").RelPermalink }} 660w
             {{ if gt .Width 1024 }}
               ,{{ (.Resize "1024x webp").RelPermalink }} 1024w
+            {{ else }}
+              {{ with .Resize (printf "%dx%d webp" .Width .Height) }}
+                ,{{ .RelPermalink }} {{ .Width }}w
+              {{ end }}
             {{ end }}
             {{ if gt .Width 1320 }}
               ,{{ (.Resize "1320x webp").RelPermalink }} 2x
+            {{ else }}
+              {{ with .Resize (printf "%dx%d webp" .Width .Height) }}
+                ,{{ .RelPermalink }} {{ .Width }}w
+              {{ end }}
             {{ end }}"
           src="{{ (.Resize "660x webp").RelPermalink }}" 
         {{ end }}
@@ -81,9 +89,13 @@
           {{- (.Resize "660x").RelPermalink }} 660w
           {{ if gt .Width 1024 }}
             ,{{ (.Resize "1024x").RelPermalink }} 1024w
+          {{ else }}
+            ,{{ .RelPermalink }} {{ .Width }}w
           {{ end }}
           {{ if gt .Width 1320 }}
             ,{{ (.Resize "1320x").RelPermalink }} 2x
+          {{ else }}
+            ,{{ .RelPermalink }} {{ .Width }}w
           {{ end }}"
           src="{{ (.Resize "660x").RelPermalink }}"
         {{ end }}

From 11fd48f5d09596e68705169d3faa343c752b6d62 Mon Sep 17 00:00:00 2001
From: stereobooster <stereobooster@gmail.com>
Date: Sun, 26 Nov 2023 02:23:34 +0100
Subject: [PATCH 5/8] potential solution to screenshot

---
 layouts/_default/_markup/render-image.html | 10 +++++++++-
 layouts/partials/picture.html              | 11 +++++++++--
 layouts/partials/pictureDefaults.html      |  3 ++-
 layouts/shortcodes/screenshot.html         | 21 ++++++++++-----------
 4 files changed, 30 insertions(+), 15 deletions(-)

diff --git a/layouts/_default/_markup/render-image.html b/layouts/_default/_markup/render-image.html
index 2e7a5b53..7a7e18a5 100644
--- a/layouts/_default/_markup/render-image.html
+++ b/layouts/_default/_markup/render-image.html
@@ -10,9 +10,17 @@
     {{ $img = resources.Get $path }}
 {{ end -}}
 
+{{/* https://github.com/gohugoio/hugo/pull/10666/files */}}
+{{- $params := $url.Query -}}
+{{- $x2Param := $params.Get "x2" -}}
+{{- $x2 := false -}}
+{{- if eq $x2Param "true" -}}
+    {{- $x2 = true  -}}
+{{- end -}}
+
 <figure>
   {{- with $img -}}
-    {{ partial "pictureDefaults.html" (dict "img" . "alt" $altText "class" $class) }}
+    {{ partial "pictureDefaults.html" (dict "img" . "alt" $altText "class" $class "x2" $x2) }}
   {{- else -}}
     <img src="{{ .Destination | safeURL }}" alt="{{ $altText }}" class="{{ $class }}"/>
   {{- end -}}
diff --git a/layouts/partials/picture.html b/layouts/partials/picture.html
index 9056f224..33553667 100644
--- a/layouts/partials/picture.html
+++ b/layouts/partials/picture.html
@@ -4,6 +4,7 @@
 {{ $lazy := .lazy }}
 {{ $webp := .webp }}
 {{ $lqip := .lqip }}
+{{ $x2 := .x2 | default false }}
 
 {{ with $img }}
   {{ if (eq .MediaType.SubType "svg") }}
@@ -45,6 +46,12 @@
         style="background-image:url(data:image/webp;base64,{{ $bg }});background-size:cover"
       {{ end }}
     >
+    {{ $width := .Width }}
+    {{ $height := .Height }}
+    {{ if $x2 }}
+      {{ $width = div .Width 2 }}
+      {{ $height = div .Height 2 }}
+    {{ end }}
     {{ if $webp }}
       <source 
         {{ if lt .Width 660 }}
@@ -76,8 +83,8 @@
     {{ end }}
       <img
         src="{{ .RelPermalink }}"
-        width="{{ .Width }}"
-        height="{{ .Height }}"
+        width="{{ $width }}"
+        height="{{ $height }}"
         {{ with $class }} class="{{ . }}" {{ end }}
         {{ with $alt }} alt="{{ . }}" {{ end }}
         {{ with $lazy }} loading="lazy" decoding="async" {{ end }}
diff --git a/layouts/partials/pictureDefaults.html b/layouts/partials/pictureDefaults.html
index 1e31be6c..01eb0986 100644
--- a/layouts/partials/pictureDefaults.html
+++ b/layouts/partials/pictureDefaults.html
@@ -4,4 +4,5 @@
 {{ $lazy := $.Page.Site.Params.enableImageLazyLoading | default true }}
 {{ $webp := $.Page.Site.Params.enableImageWebp | default true }}
 {{ $lqip := false }}
-{{ partial "picture.html" (dict "img" $img "alt" $alt "class" $class "lazy" $lazy "webp" $webp "lqip" $lqip) }}
\ No newline at end of file
+{{ $x2 := .x2 }}
+{{ partial "picture.html" (dict "img" $img "alt" $alt "class" $class "lazy" $lazy "webp" $webp "lqip" $lqip "x2" $x2) }}
\ No newline at end of file
diff --git a/layouts/shortcodes/screenshot.html b/layouts/shortcodes/screenshot.html
index 653e1fd7..28025748 100644
--- a/layouts/shortcodes/screenshot.html
+++ b/layouts/shortcodes/screenshot.html
@@ -4,17 +4,16 @@
     {{- if .Get "href" -}}
       <a href="{{ .Get "href" }}">
     {{- end -}}
-    <img src="{{ $image.RelPermalink }}"
-      {{- if or (.Get "alt") (.Get "caption") }}
-        alt="{{ with .Get "alt" }}{{ . }}{{ else }}{{ .Get "caption" | markdownify | plainify }}{{ end }}"
-      {{- end -}}
-      {{ if .Site.Params.enableImageLazyLoading | default true }}
-        loading="lazy"
-      {{ end }}
-      width="100%"
-      height="auto"
-      style="max-width:{{ div $image.Width 2 }}px; max-height:{{ div $image.Height 2 }}px;"
-    />
+
+    {{ $altText := "" }}
+    {{ with .Get "alt" }}
+      {{ $altText = . }}
+    {{ else }}
+      {{ $altText = (.Get "caption") | markdownify | plainify }}
+    {{ end }}
+
+    {{ partial "pictureDefaults.html" (dict "img" $image "alt" $altText "x2" true) }}
+
     {{- if .Get "href" }}</a>{{ end -}}
     {{- if .Get "caption" -}}
       <figcaption>

From 6eb34e7124d6eea6262fffb1ba233d38b6a2647d Mon Sep 17 00:00:00 2001
From: stereobooster <stereobooster@gmail.com>
Date: Sun, 26 Nov 2023 14:23:42 +0100
Subject: [PATCH 6/8] use 2x instead of x2 in query params

---
 layouts/_default/_markup/render-image.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/layouts/_default/_markup/render-image.html b/layouts/_default/_markup/render-image.html
index 7a7e18a5..6c80f343 100644
--- a/layouts/_default/_markup/render-image.html
+++ b/layouts/_default/_markup/render-image.html
@@ -12,7 +12,7 @@
 
 {{/* https://github.com/gohugoio/hugo/pull/10666/files */}}
 {{- $params := $url.Query -}}
-{{- $x2Param := $params.Get "x2" -}}
+{{- $x2Param := $params.Get "2x" -}}
 {{- $x2 := false -}}
 {{- if eq $x2Param "true" -}}
     {{- $x2 = true  -}}

From 0c6c30fec166f18310264433929ff69a442637ca Mon Sep 17 00:00:00 2001
From: stereobooster <stereobooster@gmail.com>
Date: Sun, 26 Nov 2023 14:38:27 +0100
Subject: [PATCH 7/8] do not lazy load the feature image

---
 layouts/_default/_markup/render-image.html | 2 +-
 layouts/_default/single.html               | 2 +-
 layouts/partials/picture.html              | 2 +-
 layouts/partials/pictureDefaults.html      | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/layouts/_default/_markup/render-image.html b/layouts/_default/_markup/render-image.html
index 6c80f343..d8a5136d 100644
--- a/layouts/_default/_markup/render-image.html
+++ b/layouts/_default/_markup/render-image.html
@@ -10,7 +10,7 @@
     {{ $img = resources.Get $path }}
 {{ end -}}
 
-{{/* https://github.com/gohugoio/hugo/pull/10666/files */}}
+{{/* https://github.com/gohugoio/hugo/pull/10666 */}}
 {{- $params := $url.Query -}}
 {{- $x2Param := $params.Get "2x" -}}
 {{- $x2 := false -}}
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 90e41daa..199a3235 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -17,7 +17,7 @@
         <div class="prose">
           {{ $altText := $.Params.featureAlt | default $.Params.coverAlt | default "" }}
           {{ $class := "mb-6 -mt-4 rounded-md" }}
-          {{ partial "pictureDefaults.html" (dict "img" . "alt" $altText "class" $class) }}
+          {{ partial "pictureDefaults.html" (dict "img" . "alt" $altText "class" $class "lazy" false) }}
           {{ with $.Params.coverCaption }}
             <figcaption class="mb-6 -mt-3 text-center">{{ . | markdownify }}</figcaption>
           {{ end }}
diff --git a/layouts/partials/picture.html b/layouts/partials/picture.html
index 33553667..f0bc2f49 100644
--- a/layouts/partials/picture.html
+++ b/layouts/partials/picture.html
@@ -4,7 +4,7 @@
 {{ $lazy := .lazy }}
 {{ $webp := .webp }}
 {{ $lqip := .lqip }}
-{{ $x2 := .x2 | default false }}
+{{ $x2 := .x2 }}
 
 {{ with $img }}
   {{ if (eq .MediaType.SubType "svg") }}
diff --git a/layouts/partials/pictureDefaults.html b/layouts/partials/pictureDefaults.html
index 01eb0986..9ce43084 100644
--- a/layouts/partials/pictureDefaults.html
+++ b/layouts/partials/pictureDefaults.html
@@ -1,7 +1,7 @@
 {{ $img := .img }}
 {{ $alt := .alt }}
 {{ $class := .class }}
-{{ $lazy := $.Page.Site.Params.enableImageLazyLoading | default true }}
+{{ $lazy := .lazy | default $.Page.Site.Params.enableImageLazyLoading | default true }}
 {{ $webp := $.Page.Site.Params.enableImageWebp | default true }}
 {{ $lqip := false }}
 {{ $x2 := .x2 }}

From c8b33ae51ec3b011c9a2364ef06c525febc09aa2 Mon Sep 17 00:00:00 2001
From: stereobooster <stereobooster@gmail.com>
Date: Sun, 26 Nov 2023 14:47:26 +0100
Subject: [PATCH 8/8] refactoring

---
 layouts/_default/_markup/render-image.html | 2 +-
 layouts/_default/single.html               | 2 +-
 layouts/partials/picture.html              | 8 ++++----
 layouts/partials/pictureDefaults.html      | 8 --------
 layouts/shortcodes/figure.html             | 2 +-
 layouts/shortcodes/screenshot.html         | 2 +-
 6 files changed, 8 insertions(+), 16 deletions(-)
 delete mode 100644 layouts/partials/pictureDefaults.html

diff --git a/layouts/_default/_markup/render-image.html b/layouts/_default/_markup/render-image.html
index d8a5136d..593279b6 100644
--- a/layouts/_default/_markup/render-image.html
+++ b/layouts/_default/_markup/render-image.html
@@ -20,7 +20,7 @@
 
 <figure>
   {{- with $img -}}
-    {{ partial "pictureDefaults.html" (dict "img" . "alt" $altText "class" $class "x2" $x2) }}
+    {{ partial "picture.html" (dict "img" . "alt" $altText "class" $class "x2" $x2) }}
   {{- else -}}
     <img src="{{ .Destination | safeURL }}" alt="{{ $altText }}" class="{{ $class }}"/>
   {{- end -}}
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 199a3235..726dac87 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -17,7 +17,7 @@
         <div class="prose">
           {{ $altText := $.Params.featureAlt | default $.Params.coverAlt | default "" }}
           {{ $class := "mb-6 -mt-4 rounded-md" }}
-          {{ partial "pictureDefaults.html" (dict "img" . "alt" $altText "class" $class "lazy" false) }}
+          {{ partial "picture.html" (dict "img" . "alt" $altText "class" $class "lazy" false) }}
           {{ with $.Params.coverCaption }}
             <figcaption class="mb-6 -mt-3 text-center">{{ . | markdownify }}</figcaption>
           {{ end }}
diff --git a/layouts/partials/picture.html b/layouts/partials/picture.html
index f0bc2f49..752f84a8 100644
--- a/layouts/partials/picture.html
+++ b/layouts/partials/picture.html
@@ -1,10 +1,10 @@
 {{ $img := .img }}
 {{ $alt := .alt }}
 {{ $class := .class }}
-{{ $lazy := .lazy }}
-{{ $webp := .webp }}
-{{ $lqip := .lqip }}
-{{ $x2 := .x2 }}
+{{ $lazy := .lazy | default $.Page.Site.Params.enableImageLazyLoading | default true }}
+{{ $webp := .webp | default $.Page.Site.Params.enableImageWebp | default true }}
+{{ $lqip := .lqip | default false }}
+{{ $x2 := .x2 | default false }}
 
 {{ with $img }}
   {{ if (eq .MediaType.SubType "svg") }}
diff --git a/layouts/partials/pictureDefaults.html b/layouts/partials/pictureDefaults.html
deleted file mode 100644
index 9ce43084..00000000
--- a/layouts/partials/pictureDefaults.html
+++ /dev/null
@@ -1,8 +0,0 @@
-{{ $img := .img }}
-{{ $alt := .alt }}
-{{ $class := .class }}
-{{ $lazy := .lazy | default $.Page.Site.Params.enableImageLazyLoading | default true }}
-{{ $webp := $.Page.Site.Params.enableImageWebp | default true }}
-{{ $lqip := false }}
-{{ $x2 := .x2 }}
-{{ partial "picture.html" (dict "img" $img "alt" $alt "class" $class "lazy" $lazy "webp" $webp "lqip" $lqip "x2" $x2) }}
\ No newline at end of file
diff --git a/layouts/shortcodes/figure.html b/layouts/shortcodes/figure.html
index f0d49dfe..118b7a05 100644
--- a/layouts/shortcodes/figure.html
+++ b/layouts/shortcodes/figure.html
@@ -18,7 +18,7 @@
     {{ with $href }}<a href="{{ . }}">{{ end }}
 
     {{- with $img -}}
-      {{ partial "pictureDefaults.html" (dict "img" . "alt" $altText "class" $class) }}
+      {{ partial "picture.html" (dict "img" . "alt" $altText "class" $class) }}
     {{- else -}}
       <img src="{{ $url.String }}" alt="{{ $altText }}" class="{{ $class }}"/>
     {{- end -}}
diff --git a/layouts/shortcodes/screenshot.html b/layouts/shortcodes/screenshot.html
index 28025748..e08243ce 100644
--- a/layouts/shortcodes/screenshot.html
+++ b/layouts/shortcodes/screenshot.html
@@ -12,7 +12,7 @@
       {{ $altText = (.Get "caption") | markdownify | plainify }}
     {{ end }}
 
-    {{ partial "pictureDefaults.html" (dict "img" $image "alt" $altText "x2" true) }}
+    {{ partial "picture.html" (dict "img" $image "alt" $altText "x2" true) }}
 
     {{- if .Get "href" }}</a>{{ end -}}
     {{- if .Get "caption" -}}