From 904176c43c5d0389aef3c2132b0a4ecfe06cbc7e Mon Sep 17 00:00:00 2001
From: ZhenShuo Leo <98386542+ZhenShuo2021@users.noreply.github.com>
Date: Wed, 30 Jul 2025 01:52:24 +0800
Subject: [PATCH] style(footer): use flex-row and overflow-x-auto when only has
 icons

---
 assets/css/compiled/main.css        |  3 +++
 layouts/partials/footer.html        | 37 ++++++++++++++++++-----------
 layouts/partials/scroll-to-top.html |  2 +-
 3 files changed, 27 insertions(+), 15 deletions(-)

diff --git a/assets/css/compiled/main.css b/assets/css/compiled/main.css
index d9788bf9..5d7368c8 100644
--- a/assets/css/compiled/main.css
+++ b/assets/css/compiled/main.css
@@ -1585,6 +1585,9 @@ body.zen-mode-enable {
   .overflow-visible {
     overflow: visible;
   }
+  .overflow-x-auto {
+    overflow-x: auto;
+  }
   .overflow-y-auto {
     overflow-y: auto;
   }
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index fb4918ff..b7b958b5 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -2,11 +2,20 @@
   {{/* Footer menu */}}
   {{ if .Site.Params.footer.showMenu | default true }}
     {{ if .Site.Menus.footer }}
-      <nav class="flex flex-row pb-4 text-base font-medium text-neutral-500 dark:text-neutral-400">
-        <ul class="flex flex-col list-none sm:flex-row">
+      {{ $onlyIcon := true }}
+      {{ range .Site.Menus.footer }}
+        {{ if .Name }}
+          {{ $onlyIcon = false }}
+          {{ break }}
+        {{ end }}
+      {{ end }}
+      {{ $navClass := printf "flex flex-row pb-4 text-base font-medium text-neutral-500 dark:text-neutral-400 %s" (cond $onlyIcon "overflow-x-auto py-2" "") }}
+      {{ $ulClass := printf "flex list-none %s" (cond $onlyIcon "flex-row" "flex-col sm:flex-row") }}
+      {{ $liClass := printf "flex mb-1 ltr:text-right rtl:text-left sm:mb-0 ltr:sm:mr-7 ltr:sm:last:mr-0 rtl:sm:ml-7 rtl:sm:last:ml-0 %s" (cond $onlyIcon "ltr:mr-4 rtl:ml-4" "") }}
+      <nav class="{{ $navClass }}">
+        <ul class="{{ $ulClass }}">
           {{ range .Site.Menus.footer }}
-            <li
-              class="flex mb-1 ltr:text-right rtl:text-left sm:mb-0 ltr:sm:mr-7 ltr:sm:last:mr-0 rtl:sm:ml-7 rtl:sm:last:ml-0">
+            <li class=" {{ $liClass }}">
               <a
                 class="decoration-primary-500 hover:underline hover:decoration-2 hover:underline-offset-2 flex items-center"
                 href="{{ .URL }}"
@@ -50,17 +59,17 @@
         {{ i18n "footer.powered_by" (dict "Hugo" $hugo "Theme" $blowfish) | safeHTML }}
       </p>
     {{ end }}
-
   </div>
-  <script>
-    {{ if not .Site.Params.disableImageZoom | default true }}
-    mediumZoom(document.querySelectorAll("img:not(.nozoom)"), {
-      margin: 24,
-      background: 'rgba(0,0,0,0.5)',
-      scrollOffset: 0,
-    })
-    {{ end }}
-  </script> {{ $jsProcess := resources.Get "js/process.js" }}
+  {{ if not .Site.Params.disableImageZoom | default true }}
+    <script>
+      mediumZoom(document.querySelectorAll("img:not(.nozoom)"), {
+        margin: 24,
+        background: "rgba(0,0,0,0.5)",
+        scrollOffset: 0,
+      });
+    </script>
+  {{ end }}
+  {{ $jsProcess := resources.Get "js/process.js" }}
   {{ $jsProcess = $jsProcess | resources.Minify | resources.Fingerprint (.Site.Params.fingerprintAlgorithm | default "sha512") }}
   <script
     type="text/javascript"
diff --git a/layouts/partials/scroll-to-top.html b/layouts/partials/scroll-to-top.html
index 25dec90c..e34b3660 100644
--- a/layouts/partials/scroll-to-top.html
+++ b/layouts/partials/scroll-to-top.html
@@ -1,4 +1,4 @@
-<div id="top-scroller" class="pointer-events-none absolute top-[110vh] bottom-0 w-12 ltr:right-0 rtl:left-0">
+<div id="top-scroller" class="pointer-events-none absolute top-[110vh] bottom-0 w-12 ltr:right-0 rtl:left-0 z-10">
   <a
     href="#the-top"
     class="pointer-events-auto sticky top-[calc(100vh-5.5rem)] flex h-12 w-12 mb-16 items-center justify-center rounded-full bg-neutral/50 text-xl text-neutral-700 hover:text-primary-600 dark:bg-neutral-800/50 dark:text-neutral dark:hover:text-primary-400"