From 751856fcc2707ab14a6d65c6d8058aaae70a0601 Mon Sep 17 00:00:00 2001
From: ZhenShuo Leo <98386542+ZhenShuo2021@users.noreply.github.com>
Date: Sat, 4 Oct 2025 01:05:46 +0800
Subject: [PATCH] fix: show full size author image when zooming

---
 layouts/partials/author-extra.html    |  6 ++++--
 layouts/partials/author.html          | 12 ++++++++----
 layouts/partials/home/background.html |  8 +++++---
 layouts/partials/home/hero.html       | 10 ++++++----
 layouts/partials/home/profile.html    | 10 ++++++----
 5 files changed, 29 insertions(+), 17 deletions(-)

diff --git a/layouts/partials/author-extra.html b/layouts/partials/author-extra.html
index fd18a385..de97e797 100644
--- a/layouts/partials/author-extra.html
+++ b/layouts/partials/author-extra.html
@@ -8,14 +8,16 @@
       {{ $authorImage = resources.Get . }}
     {{ end }}
     {{ if $authorImage }}
+      {{ $final := $authorImage }}
       {{ if not $disableImageOptimization }}
-        {{ $authorImage = $authorImage.Fill "192x192" }}
+        {{ $final = $authorImage.Fill "192x192" }}
       {{ end }}
       <img
         class="!mt-0 !mb-0 h-24 w-24 rounded-full me-4"
         width="96"
         height="96"
-        src="{{ $authorImage.RelPermalink }}">
+        src="{{ $final.RelPermalink }}"
+        data-zoom-src="{{ $authorImage.RelPermalink }}">
     {{ end }}
   {{ end }}
   <div class="place-self-center">
diff --git a/layouts/partials/author.html b/layouts/partials/author.html
index 50d2f54c..57d8088c 100644
--- a/layouts/partials/author.html
+++ b/layouts/partials/author.html
@@ -8,26 +8,30 @@
       {{ $authorImage = resources.Get . }}
     {{ end }}
     {{ if $authorImage }}
+      {{ $final := $authorImage }}
       {{ if not $disableImageOptimization }}
-        {{ $authorImage = $authorImage.Fill "192x192" }}
+        {{ $final = $authorImage.Fill "192x192" }}
       {{ end }}
       <img
         class="!mt-0 !mb-0 h-24 w-24 rounded-full me-4"
         width="96"
         height="96"
         alt="{{ $.Site.Params.Author.name | default " Author" }}"
-        src="{{ $authorImage.RelPermalink }}">
+        src="{{ $final.RelPermalink }}"
+        data-zoom-src="{{ $authorImage.RelPermalink }}">
     {{ else }}
       {{ $authorImage := resources.GetRemote . }}
+      {{ $final := $authorImage }}
       {{ if not $disableImageOptimization }}
-        {{ $authorImage = $authorImage.Fill "192x192" }}
+        {{ $final = $authorImage.Fill "192x192" }}
       {{ end }}
       <img
         class="!mt-0 !mb-0 h-24 w-24 rounded-full me-4"
         width="96"
         height="96"
         alt="{{ $.Site.Params.Author.name | default " Author" }}"
-        src="{{ $authorImage.RelPermalink }}">
+        src="{{ $authorImage.RelPermalink }}"
+        data-zoom-src="{{ $authorImage.RelPermalink }}">
     {{ end }}
   {{ end }}
   <div class="place-self-center">
diff --git a/layouts/partials/home/background.html b/layouts/partials/home/background.html
index b0090d12..e425de9a 100644
--- a/layouts/partials/home/background.html
+++ b/layouts/partials/home/background.html
@@ -41,15 +41,17 @@
               {{ $authorImage = resources.Get . }}
             {{ end }}
             {{ if $authorImage }}
+              {{ $final := $authorImage }}
               {{ if not $disableImageOptimization }}
-                {{ $authorImage = $authorImage.Fill (print "288x288 q" ( $.Site.Params.Author.imagequality | default "96" )) }}
+                {{ $final = $authorImage.Fill (print "288x288 q" ( $.Site.Params.Author.imagequality | default "96" )) }}
               {{ end }}
               <img
                 class="mb-2 h-36 w-36 rounded-full"
                 width="144"
                 height="144"
-                alt="{{ $.Site.Params.Author.name | default " Author" }}"
-                src="{{ $authorImage.RelPermalink }}">
+                alt="{{ $.Site.Params.Author.name | default `Author` }}"
+                src="{{ $final.RelPermalink }}"
+                data-zoom-src="{{ $authorImage.RelPermalink }}">
             {{ end }}
           {{ end }}
           <h1 class="mb-2 text-4xl font-extrabold text-neutral-800 dark:text-neutral-200">
diff --git a/layouts/partials/home/hero.html b/layouts/partials/home/hero.html
index 7fda230f..a281b938 100644
--- a/layouts/partials/home/hero.html
+++ b/layouts/partials/home/hero.html
@@ -42,15 +42,17 @@
               {{ $authorImage = resources.Get . }}
             {{ end }}
             {{ if $authorImage }}
+              {{ $final := $authorImage }}
               {{ if not $disableImageOptimization }}
-                {{ $authorImage = $authorImage.Fill (print "288x288 q" ( $.Site.Params.Author.imagequality | default "96" )) }}
+                {{ $final = $authorImage.Fill (print "288x288 q" ( $.Site.Params.Author.imagequality | default "96" )) }}
               {{ end }}
               <img
-                class="mb-2 rounded-full h-36 w-36"
+                class="mb-2 h-36 w-36 rounded-full"
                 width="144"
                 height="144"
-                alt="{{ $.Site.Params.Author.name | default " Author" }}"
-                src="{{ $authorImage.RelPermalink }}">
+                alt="{{ $.Site.Params.Author.name | default `Author` }}"
+                src="{{ $final.RelPermalink }}"
+                data-zoom-src="{{ $authorImage.RelPermalink }}">
             {{ end }}
           {{ end }}
           {{ if not $disableHeroImageFilter }}
diff --git a/layouts/partials/home/profile.html b/layouts/partials/home/profile.html
index 842ee72f..7866f9c4 100644
--- a/layouts/partials/home/profile.html
+++ b/layouts/partials/home/profile.html
@@ -12,15 +12,17 @@
         {{ $authorImage = resources.Get . }}
       {{ end }}
       {{ if $authorImage }}
+        {{ $final := $authorImage }}
         {{ if not $disableImageOptimization }}
-          {{ $authorImage = $authorImage.Fill (print "288x288 q" ( $.Site.Params.Author.imagequality | default "96" )) }}
+          {{ $final = $authorImage.Fill (print "288x288 q" ( $.Site.Params.Author.imagequality | default "96" )) }}
         {{ end }}
         <img
-          class="mb-2 rounded-full h-36 w-36"
+          class="mb-2 h-36 w-36 rounded-full"
           width="144"
           height="144"
-          alt="{{ $.Site.Params.Author.name | default " Author" }}"
-          src="{{ $authorImage.RelPermalink }}">
+          alt="{{ $.Site.Params.Author.name | default `Author` }}"
+          src="{{ $final.RelPermalink }}"
+          data-zoom-src="{{ $authorImage.RelPermalink }}">
       {{ end }}
     {{ end }}
     <h1 class="text-4xl font-extrabold">