Merge pull request #2509 from ZhenShuo2021/fix/terms-typo

🐛 Fix: multiple small patches

assets/css/compiled/main.css

@@ -245,6 +245,7 @@ body.zen-mode-enable {
     --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
       "Courier New", monospace;
     --spacing: 0.25rem;
+    --container-2xs: 18rem;
     --container-xs: 20rem;
     --container-xl: 36rem;
     --container-3xl: 48rem;
@@ -656,6 +657,9 @@ body.zen-mode-enable {
   .me-4 {
     margin-inline-end: calc(var(--spacing) * 4);
   }
+  .me-6 {
+    margin-inline-end: calc(var(--spacing) * 6);
+  }
   .prose {
     color: var(--tw-prose-body);
     max-width: 65ch;
@@ -1147,9 +1151,6 @@ body.zen-mode-enable {
   .mt-20 {
     margin-top: calc(var(--spacing) * 20);
   }
-  .mt-\[0\.1rem\] {
-    margin-top: 0.1rem;
-  }
   .mt-\[0\.5rem\] {
     margin-top: 0.5rem;
   }
@@ -1171,9 +1172,6 @@ body.zen-mode-enable {
   .mr-5 {
     margin-right: calc(var(--spacing) * 5);
   }
-  .mr-auto {
-    margin-right: auto;
-  }
   .\!mb-0 {
     margin-bottom: calc(var(--spacing) * 0) !important;
   }
@@ -1222,12 +1220,6 @@ body.zen-mode-enable {
   .ml-2 {
     margin-left: calc(var(--spacing) * 2);
   }
-  .ml-3 {
-    margin-left: calc(var(--spacing) * 3);
-  }
-  .ml-auto {
-    margin-left: auto;
-  }
   .box-border {
     box-sizing: border-box;
   }
@@ -1455,9 +1447,6 @@ body.zen-mode-enable {
   .max-w-\[5rem\] {
     max-width: 5rem;
   }
-  .max-w-\[64rem\] {
-    max-width: 64rem;
-  }
   .max-w-\[200px\] {
     max-width: 200px;
   }
@@ -1983,9 +1972,6 @@ body.zen-mode-enable {
   .p-1\.5 {
     padding: calc(var(--spacing) * 1.5);
   }
-  .p-2\.5 {
-    padding: calc(var(--spacing) * 2.5);
-  }
   .p-4 {
     padding: calc(var(--spacing) * 4);
   }
@@ -2091,18 +2077,12 @@ body.zen-mode-enable {
   .pt-\[5px\] {
     padding-top: 5px;
   }
-  .pr-0 {
+  .pr-2 {
-    padding-right: calc(var(--spacing) * 0);
+    padding-right: calc(var(--spacing) * 2);
   }
   .pr-8 {
     padding-right: calc(var(--spacing) * 8);
   }
-  .pr-\[24px\] {
-    padding-right: 24px;
-  }
-  .pb-0 {
-    padding-bottom: calc(var(--spacing) * 0);
-  }
   .pb-2 {
     padding-bottom: calc(var(--spacing) * 2);
   }
@@ -2124,12 +2104,6 @@ body.zen-mode-enable {
   .pl-0 {
     padding-left: calc(var(--spacing) * 0);
   }
-  .pl-4 {
-    padding-left: calc(var(--spacing) * 4);
-  }
-  .pl-\[24px\] {
-    padding-left: 24px;
-  }
   .text-center {
     text-align: center;
   }
@@ -2533,27 +2507,6 @@ body.zen-mode-enable {
       }
     }
   }
-  .group-hover\:text-primary-600 {
-    &:is(:where(.group):hover *) {
-      @media (hover: hover) {
-        color: rgba(var(--color-primary-600), 1);
-      }
-    }
-  }
-  .group-hover\:underline {
-    &:is(:where(.group):hover *) {
-      @media (hover: hover) {
-        text-decoration-line: underline;
-      }
-    }
-  }
-  .group-hover\:decoration-primary-500 {
-    &:is(:where(.group):hover *) {
-      @media (hover: hover) {
-        text-decoration-color: rgba(var(--color-primary-500), 1);
-      }
-    }
-  }
   .group-hover\:opacity-100 {
     &:is(:where(.group):hover *) {
       @media (hover: hover) {
@@ -3049,6 +3002,11 @@ body.zen-mode-enable {
       padding-inline: calc(var(--spacing) * 24);
     }
   }
+  .md\:pr-4 {
+    @media (width >= 853px) {
+      padding-right: calc(var(--spacing) * 4);
+    }
+  }
   .lg\:absolute {
     @media (width >= 1024px) {
       position: absolute;
@@ -3139,6 +3097,11 @@ body.zen-mode-enable {
       width: auto;
     }
   }
+  .lg\:max-w-2xs {
+    @media (width >= 1024px) {
+      max-width: var(--container-2xs);
+    }
+  }
   .lg\:max-w-7xl {
     @media (width >= 1024px) {
       max-width: var(--container-7xl);
@@ -3224,11 +3187,6 @@ body.zen-mode-enable {
       grid-template-columns: repeat(5, minmax(0, 1fr));
     }
   }
-  .ltr\:mr-4 {
-    &:where(:dir(ltr), [dir="ltr"], [dir="ltr"] *) {
-      margin-right: calc(var(--spacing) * 4);
-    }
-  }
   .ltr\:-ml-12 {
     &:where(:dir(ltr), [dir="ltr"], [dir="ltr"] *) {
       margin-left: calc(var(--spacing) * -12);
@@ -3244,21 +3202,11 @@ body.zen-mode-enable {
       display: none;
     }
   }
-  .ltr\:inline {
-    &:where(:dir(ltr), [dir="ltr"], [dir="ltr"] *) {
-      display: inline;
-    }
-  }
   .rtl\:-mr-\[79px\] {
     &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
       margin-right: calc(79px * -1);
     }
   }
-  .rtl\:ml-4 {
-    &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
-      margin-left: calc(var(--spacing) * 4);
-    }
-  }
   .rtl\:block {
     &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
       display: block;
@@ -3269,9 +3217,9 @@ body.zen-mode-enable {
       display: none;
     }
   }
-  .rtl\:inline {
+  .rtl\:rotate-180 {
     &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
-      display: inline;
+      rotate: 180deg;
     }
   }
   .dark\:flex {
@@ -3517,15 +3465,6 @@ body.zen-mode-enable {
       }
     }
   }
-  .dark\:group-hover\:text-primary-400 {
-    &:is(.dark *) {
-      &:is(:where(.group):hover *) {
-        @media (hover: hover) {
-          color: rgba(var(--color-primary-400), 1);
-        }
-      }
-    }
-  }
   .dark\:hover\:\!bg-primary-700 {
     &:is(.dark *) {
       &:hover {
@@ -3657,11 +3596,6 @@ button, [role="button"] {
 .prose div.min-w-0.max-w-prose > *:first-child {
   margin-top: calc(var(--spacing) * 3);
 }
-#TableOfContents {
-  @media (width >= 1024px) {
-    max-width: 25vw;
-  }
-}
 #TOCView {
   max-height: calc(100vh - 150px);
   min-height: 0;
@@ -3746,8 +3680,8 @@ button, [role="button"] {
   overflow: auto hidden;
 }
 .katex-display {
-  padding-right: 2px;
+  padding: 1em;
-  width: calc(100% - 2px);
+  width: calc(100% - 1em);
 }
 table {
   display: block;
@@ -3773,6 +3707,7 @@ pre {
   object-fit: cover;
 }
 .single_hero_background {
+  width: calc(100% + 1px);
   z-index: -10;
 }
 .hero_gradient {

assets/css/main.css

@@ -66,10 +66,6 @@ button,
 }
 
 /* Table of Contents */
-#TableOfContents {
-  @apply lg:max-w-[25vw];
-}
-
 #TOCView {
   max-height: calc(100vh - 150px);
   min-height: 0;
@@ -130,8 +126,8 @@ button,
 
 /* Fix katex overflow https://github.com/nunocoracao/blowfish/issues/2138 */
 .katex-display {
-  padding-right: 2px;
+  padding: 1em;
-  width: calc(100% - 2px);
+  width: calc(100% - 1em);
 }
 
 /* Fix long tables breaking out of article on mobile */
@@ -169,6 +165,7 @@ pre {
 }
 
 .single_hero_background {
+  width: calc(100% + 1px); /* patch for very small gap at right edge on mobile devices */
   z-index: -10;
 }
 

layouts/_default/baseof.html

@@ -8,9 +8,10 @@
   {{- partial "head.html" . -}}
   {{- partialCached "init.html" . -}}
 
-
+  {{ $bodyLayout := "flex flex-col h-screen m-auto leading-7 max-w-7xl px-6 sm:px-14 md:px-24 lg:px-32" }}
-  <body
+  {{ $bodyColor := "text-lg bg-neutral text-neutral-900 dark:bg-neutral-800 dark:text-neutral" }}
-    class="flex flex-col h-screen px-6 m-auto text-lg leading-7 max-w-7xl bg-neutral text-neutral-900 dark:bg-neutral-800 dark:text-neutral sm:px-14 md:px-24 lg:px-32 scrollbar-thin scrollbar-track-neutral-200 scrollbar-thumb-neutral-400 dark:scrollbar-track-neutral-800 dark:scrollbar-thumb-neutral-600">
+  {{ $bodyScrollbar := "scrollbar-thin scrollbar-track-neutral-200 scrollbar-thumb-neutral-400 dark:scrollbar-track-neutral-800 dark:scrollbar-thumb-neutral-600" }}
+  <body class="{{ $bodyLayout }} {{ $bodyColor }} {{ $bodyScrollbar }}">
     <div id="the-top" class="absolute flex self-center">
       <a
         class="px-3 py-1 text-sm -translate-y-8 rounded-b-lg bg-primary-200 focus:translate-y-0 dark:bg-neutral-600"

layouts/_default/single.html

@@ -31,19 +31,16 @@
 
     {{/* Body */}}
     <section class="flex flex-col max-w-full mt-0 prose dark:prose-invert lg:flex-row">
-      {{ $enableToc := .Params.showTableOfContents | default (site.Params.list.showTableOfContents | default false) }}
+      {{ $enableToc := site.Params.article.showTableOfContents | default false }}
+      {{ $enableToc = .Params.showTableOfContents | default $enableToc }}
       {{ $showToc := and $enableToc (in .TableOfContents "<ul") }}
-      {{ $showRelated := site.Params.article.showRelatedPosts | default false }}
       {{ $topClass := cond (hasPrefix site.Params.header.layout "fixed") "lg:top-[140px]" "lg:top-10" }}
-      {{ if or $showToc $showRelated }}
+      {{ if $showToc }}
-        <div class="order-first lg:ml-auto px-0 lg:order-last lg:ps-8">
+        <div class="order-first lg:ml-auto px-0 lg:order-last lg:ps-8 lg:max-w-2xs">
           <div class="toc ps-5 print:hidden lg:sticky {{ $topClass }}">
             {{ if $showToc }}
               {{ partial "toc.html" . }}
             {{ end }}
-            {{ if $showRelated }}
-              sd
-            {{ end }}
           </div>
         </div>
       {{ end }}

layouts/_default/terms.html

@@ -1,6 +1,6 @@
 {{ define "main" }}
   {{ .Scratch.Set "scope" "list" }}
-  {{ $showHero := .Params.showHero | default site.Params.term.showHero | default false }}
+  {{ $showHero := .Params.showHero | default site.Params.taxonomy.showHero | default false }}
   {{ if $showHero }}
     {{ $heroStyle := print "hero/" site.Params.taxonomy.heroStyle ".html" }}
     {{ if templates.Exists ( printf "partials/%s" $heroStyle ) }}

layouts/partials/article-link/_shortcode.html

@@ -20,7 +20,7 @@
 {{ if site.Params.list.showCards }}
   {{ $cardClasses = printf "%s overflow-hidden rounded-md border-2 border-neutral-200 dark:border-neutral-700" $cardClasses }}
   {{ $figureClasses = "" }}
-  {{ $cardContentClasses = printf "%s p-2.5 pl-4 pb-0" $cardContentClasses }}
+  {{ $cardContentClasses = printf "%s p-4 pt-2" $cardContentClasses }}
 {{ else }}
   {{ $cardClasses = printf "%s" $cardClasses }}
   {{ $figureClasses = printf "%s thumbnail-shadow md:mr-7" $figureClasses }}

layouts/partials/article-pagination.html

@@ -9,52 +9,36 @@
     <div class="pt-8">
       <hr class="border-dotted border-neutral-300 dark:border-neutral-600">
       <div class="flex justify-between pt-3">
-        <span>
+        <span class="flex flex-col">
           {{ if $prev }}
-            <a class="flex group mr-3" href="{{ $prev.RelPermalink }}">
+            <a
-              <span
+              class="flex text-neutral-700 hover:text-primary-600 dark:text-neutral dark:hover:text-primary-400"
-                class="mr-3 text-neutral-700 group-hover:text-primary-600 ltr:inline rtl:hidden dark:text-neutral dark:group-hover:text-primary-400"
+              href="{{ $prev.RelPermalink }}">
-                >&larr;</span
+              <span class="leading-6">
-              >
+                <span class="inline-block rtl:rotate-180">&larr;</span>&ensp;{{ $prev.Title | emojify }}
-              <span
-                class="ml-3 text-neutral-700 group-hover:text-primary-600 ltr:hidden rtl:inline dark:text-neutral dark:group-hover:text-primary-400"
-                >&rarr;</span
-              >
-              <span class="flex flex-col">
-                <span class="mt-[0.1rem] leading-6 group-hover:underline group-hover:decoration-primary-500"
-                  >{{ $prev.Title | emojify }}</span
-                >
-                <span class="mt-[0.1rem] text-xs text-neutral-500 dark:text-neutral-400">
-                  {{ if .Params.showDate | default (.Site.Params.article.showDate | default true) }}
-                    {{ partial "meta/date.html" $prev.Date }}
-                  {{ end }}
-                </span>
               </span>
             </a>
+            {{ if .Params.showDate | default (.Site.Params.article.showDate | default true) }}
+              <span class="ms-6 mt-1 text-xs text-neutral-500 dark:text-neutral-400">
+                {{ partial "meta/date.html" $prev.Date }}
+              </span>
+            {{ end }}
           {{ end }}
         </span>
-        <span>
+        <span class="flex flex-col items-end">
           {{ if $next }}
-            <a class="flex text-right group ml-3" href="{{ $next.RelPermalink }}">
+            <a
-              <span class="flex flex-col">
+              class="flex text-right text-neutral-700 hover:text-primary-600 dark:text-neutral dark:hover:text-primary-400"
-                <span class="mt-[0.1rem] leading-6 group-hover:underline group-hover:decoration-primary-500"
+              href="{{ $next.RelPermalink }}">
-                  >{{ $next.Title | emojify }}</span
+              <span class="leading-6">
-                >
+                {{ $next.Title | emojify }}&ensp;<span class="inline-block rtl:rotate-180">&rarr;</span>
-                <span class="mt-[0.1rem] text-xs text-neutral-500 dark:text-neutral-400">
-                  {{ if .Params.showDate | default (.Site.Params.article.showDate | default true) }}
-                    {{ partial "meta/date.html" $next.Date }}
-                  {{ end }}
-                </span>
               </span>
-              <span
-                class="ml-3 text-neutral-700 group-hover:text-primary-600 ltr:inline rtl:hidden dark:text-neutral dark:group-hover:text-primary-400"
-                >&rarr;</span
-              >
-              <span
-                class="mr-3 text-neutral-700 group-hover:text-primary-600 ltr:hidden rtl:inline dark:text-neutral dark:group-hover:text-primary-400"
-                >&larr;</span
-              >
             </a>
+            {{ if .Params.showDate | default (.Site.Params.article.showDate | default true) }}
+              <span class="me-6 mt-1 text-xs text-neutral-500 dark:text-neutral-400">
+                {{ partial "meta/date.html" $next.Date }}
+              </span>
+            {{ end }}
           {{ end }}
         </span>
       </div>

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">

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">

layouts/partials/footer.html

@@ -11,7 +11,7 @@
       {{ 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 text-end sm:mb-0 sm:me-7 sm:last:me-0 %s" (cond $onlyIcon "ltr:mr-4 rtl:ml-4" "") }}
+      {{ $liClass := printf "flex mb-1 text-end sm:mb-0 sm:me-7 sm:last:me-0 %s" (cond $onlyIcon "me-4" "") }}
       <nav class="{{ $navClass }}">
         <ul class="{{ $ulClass }}">
           {{ range .Site.Menus.footer }}

layouts/partials/header/basic.html

@@ -16,7 +16,7 @@
               width="{{ div $logo.Width 2 }}"
               height="{{ div $logo.Height 2 }}"
               class="logo max-h-[5rem] max-w-[5rem] object-scale-down object-left nozoom"
-              alt="{{ .Site.Title }}">
+              alt="">
           {{ end }}
         </a>
       </div>
@@ -68,7 +68,7 @@
 {{ end }}
 
 {{/* Mobile navigation */}}
-{{ define "HeaderMobileNavigation" }}
+{{ define "HeaderMobileToolbar" }}
   <div class="flex md:hidden items-center gap-x-5 md:ml-12 h-12">
     <span></span>
 
@@ -104,7 +104,7 @@
   </div>
 {{ end }}
 
-{{ define "HeaderMobileMenu" }}
+{{ define "HeaderMobileNavigation" }}
   <div class="-my-2 md:hidden">
     <div id="menu-button" class="block">
       {{ if .Site.Menus.main }}
@@ -243,7 +243,7 @@
 
 {{/* ========== Render HTML ========== */}}
 <div
-  class="main-menu flex items-center justify-between px-4 py-6 sm:px-6 md:justify-start gap-x-3 pt-[2px] pr-0 pb-[3px] pl-0">
+  class="main-menu flex items-center justify-between py-6 md:justify-start gap-x-3 pt-[2px] pr-2 md:pr-4 pb-[3px] pl-0">
   {{ template "HeaderLogo" . }}
   <div class="flex flex-1 items-center justify-between">
     <nav class="flex space-x-3">
@@ -254,9 +254,9 @@
       {{ end }}
     </nav>
     {{ template "HeaderDesktopNavigation" . }}
-    {{ template "HeaderMobileNavigation" . }}
+    {{ template "HeaderMobileToolbar" . }}
   </div>
-  {{ template "HeaderMobileMenu" . }}
+  {{ template "HeaderMobileNavigation" . }}
 </div>
 
 {{ if .Site.Menus.subnavigation }}

layouts/partials/header/fixed-fill-blur.html

@@ -1,9 +1,9 @@
 <div class="min-h-[148px]"></div>
-<div class="fixed inset-x-0 pl-[24px] pr-[24px] z-100">
+<div class="fixed inset-x-0 z-100">
   <div
     id="menu-blur"
     class="absolute opacity-0 inset-x-0 top-0 h-full single_hero_background nozoom bg-neutral dark:bg-neutral-800"></div>
-  <div class="relative max-w-[64rem] ml-auto mr-auto">
+  <div class="relative m-auto leading-7 max-w-7xl px-6 sm:px-14 md:px-24 lg:px-32">
     {{ partial "header/basic.html" . }}
   </div>
 </div>

layouts/partials/header/fixed-fill.html

@@ -1,6 +1,6 @@
 <div class="min-h-[148px]"></div>
-<div class="fixed inset-x-0 pl-[24px] pr-[24px] bg-neutral dark:bg-neutral-800 z-100">
+<div class="fixed inset-x-0 bg-neutral dark:bg-neutral-800 z-100">
-  <div class="relative max-w-[64rem] ml-auto mr-auto">
+  <div class="relative m-auto leading-7 max-w-7xl px-6 sm:px-14 md:px-24 lg:px-32">
     {{ partial "header/basic.html" . }}
   </div>
 </div>

layouts/partials/header/fixed-gradient.html

@@ -1,11 +1,11 @@
 <div class="min-h-[148px]"></div>
 <div
-  class="fixed inset-x-0 min-h-[130px] opacity-65 pl-[24px] pr-[24px] bg-gradient-to-b from-neutral from-60% dark:from-neutral-800 to-transparent mix-blend-normal z-80"></div>
+  class="fixed inset-x-0 min-h-[130px] opacity-65 bg-gradient-to-b from-neutral from-60% dark:from-neutral-800 to-transparent mix-blend-normal z-80"></div>
-<div class="fixed inset-x-0 pl-[24px] pr-[24px] z-100">
+<div class="fixed inset-x-0 z-100">
   <div
     id="menu-blur"
     class="absolute opacity-0 inset-x-0 top-0 h-full single_hero_background nozoom backdrop-blur-2xl shadow-2xl"></div>
-  <div class="relative max-w-[64rem] ml-auto mr-auto">
+  <div class="relative m-auto leading-7 max-w-7xl px-6 sm:px-14 md:px-24 lg:px-32">
     {{ partial "header/basic.html" . }}
   </div>
 </div>

layouts/partials/header/fixed.html

@@ -1,9 +1,9 @@
 <div class="min-h-[148px]"></div>
-<div class="fixed inset-x-0 pl-[24px] pr-[24px] z-100">
+<div class="fixed inset-x-0 z-100">
   <div
     id="menu-blur"
     class="absolute opacity-0 inset-x-0 top-0 h-full single_hero_background nozoom backdrop-blur-2xl shadow-2xl"></div>
-  <div class="relative max-w-[64rem] ml-auto mr-auto">
+  <div class="relative m-auto leading-7 max-w-7xl px-6 sm:px-14 md:px-24 lg:px-32">
     {{ partial "header/basic.html" . }}
   </div>
 </div>

layouts/partials/header/header-mobile-option-nested.html

@@ -1,6 +1,7 @@
 <li class="mt-1">
   <a
     href="{{ .URL }}"
+    {{ with or .Name .Pre }}aria-label="{{ . }}"{{ end }}
     class="flex items-center hover:text-primary-600 dark:hover:text-primary-400">
     {{ if .Pre }}
       <span {{ if and .Pre .Name }}class="mr-1"{{ end }}>
@@ -24,6 +25,7 @@
       }}
         target="_blank"
       {{ end }}
+      {{ with or .Name .Pre }}aria-label="{{ . }}"{{ end }}
       class="flex items-center hover:text-primary-600 dark:hover:text-primary-400">
       {{ if .Pre }}
         <span {{ if and .Pre .Name }}class="mr-1"{{ end }}>

layouts/partials/header/header-mobile-option-simple.html

@@ -7,6 +7,7 @@
       target="_blank"
     {{ end }}
     class="flex items-center hover:text-primary-600 dark:hover:text-primary-400"
+    {{ with or .Name .Pre }}aria-label="{{ . }}"{{ end }}
     title="{{ .Title }}">
     {{ if .Pre }}
       <div {{ if and .Pre .Name }}class="mr-2"{{ end }}>

layouts/partials/header/header-option-nested.html

@@ -12,6 +12,7 @@
           target="_blank"
         {{ end }}
       {{ end }}
+      {{ with or .Name .Pre }}aria-label="{{ . }}"{{ end }}
       class="text-base font-medium hover:text-primary-600 dark:hover:text-primary-400"
       title="{{ .Title }}">
       <p>
@@ -31,6 +32,7 @@
             {{ if or (strings.HasPrefix .URL "http:" ) (strings.HasPrefix .URL "https:" ) }}
               target="_blank"
             {{ end }}
+            {{ with or .Name .Pre }}aria-label="{{ . }}"{{ end }}
             class="flex items-center hover:text-primary-600 dark:hover:text-primary-400">
             {{ if .Pre }}
               <span {{ if and .Pre .Name }}class="mr-1"{{ end }}>

layouts/partials/header/header-option-simple.html

@@ -2,6 +2,7 @@
   href="{{ .URL }}"
   {{ if or (strings.HasPrefix .URL "http:" ) (strings.HasPrefix .URL "https:" ) }}target="_blank"{{ end }}
   class="flex items-center hover:text-primary-600 dark:hover:text-primary-400"
+  {{ with or .Name .Pre }}aria-label="{{ . }}"{{ end }}
   title="{{ .Title }}">
   {{ if .Pre }}
     <span {{ if and .Pre .Name }}class="mr-1"{{ end }}>

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" }}"
+                alt="{{ $.Site.Params.Author.name | default `Author` }}"
-                src="{{ $authorImage.RelPermalink }}">
+                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">

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" }}"
+                alt="{{ $.Site.Params.Author.name | default `Author` }}"
-                src="{{ $authorImage.RelPermalink }}">
+                src="{{ $final.RelPermalink }}"
+                data-zoom-src="{{ $authorImage.RelPermalink }}">
             {{ end }}
           {{ end }}
           {{ if not $disableHeroImageFilter }}

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" }}"
+          alt="{{ $.Site.Params.Author.name | default `Author` }}"
-          src="{{ $authorImage.RelPermalink }}">
+          src="{{ $final.RelPermalink }}"
+          data-zoom-src="{{ $authorImage.RelPermalink }}">
       {{ end }}
     {{ end }}
     <h1 class="text-4xl font-extrabold">

layouts/partials/scroll-to-top.html

@@ -1,5 +1,9 @@
-{{ $coffeeIsRight := and site.Params.buymeacoffee.globalWidget (eq (lower site.Params.buymeacoffee.globalWidgetPosition) "right") }}
+{{ $coffeeIsRight := and .Site.Params.buymeacoffee.globalWidget (eq (lower site.Params.buymeacoffee.globalWidgetPosition) "right") }}
-{{ $toTopYOffset := cond $coffeeIsRight "bottom-24" "bottom-6" }}
+{{ $isRTL := .Site.Params.rtl | default false }}
+{{ $needAvoidCoffee := ne $coffeeIsRight $isRTL }}
+{{ $toTopYOffset := cond $needAvoidCoffee "bottom-24" "bottom-6" }}
+
+
 <div
   id="scroll-to-top"
   class="fixed {{ $toTopYOffset }} end-6 z-50 transform translate-y-4 opacity-0 duration-200">

layouts/partials/toc.html

@@ -33,12 +33,24 @@
     const TOC_LINK_SELECTOR = 'a[href^="#"]'
     const NESTED_LIST_SELECTOR = 'li ul'
     const ACTIVE_CLASS = 'active'
+    let isJumpingToAnchor = false
 
     function getActiveAnchorId(anchors, offsetRatio) {
       const threshold = window.scrollY + window.innerHeight * offsetRatio
       const tocLinks = [...document.querySelectorAll('#TableOfContents a[href^="#"]')]
       const tocIds = new Set(tocLinks.map(link => link.getAttribute('href').substring(1)))
 
+      if (isJumpingToAnchor) {
+        for (let i = 0; i < anchors.length; i++) {
+          const anchor = anchors[i]
+          if (!tocIds.has(anchor.id)) continue
+          const top = anchor.getBoundingClientRect().top + window.scrollY
+          if (Math.abs(window.scrollY - top) < 100) {
+            return anchor.id
+          }
+        }
+      }
+
       for (let i = anchors.length - 1; i >= 0; i--) {
         const top = anchors[i].getBoundingClientRect().top + window.scrollY
         if (top <= threshold && tocIds.has(anchors[i].id)) {
@@ -85,6 +97,12 @@
         toc.querySelectorAll(NESTED_LIST_SELECTOR).forEach(ul => ul.style.display = 'none')
       }
 
+      links.forEach(link => {
+        link.addEventListener('click', () => {
+          isJumpingToAnchor = true
+        })
+      })
+
       const config = {
         toc,
         anchors,

layouts/partials/vendor.html

@@ -149,8 +149,9 @@
     {{ end }}
   {{ end }}
 
-  {{ $repoCardCSS := resources.FromString "css/repo-cards.css" (delimit $cssRules "\n")
+  {{ $cssContent := delimit $cssRules "\n" }}
-    | minify | resources.Fingerprint (.Site.Params.fingerprintAlgorithm | default "sha512")
+  {{ $outputPath := path.Join .Page.RelPermalink "repo-cards.css" }}
-  }}
+  {{ $repoCardCSS := resources.FromString $outputPath $cssContent | minify | resources.Fingerprint (.Site.Params.fingerprintAlgorithm | default "sha512") }}
+
   <link rel="stylesheet" href="{{ $repoCardCSS.RelPermalink }}" integrity="{{ $repoCardCSS.Data.Integrity }}">
 {{ end }}

tailwind.config.js

@@ -2,9 +2,10 @@ module.exports = {
   content: [
     "./layouts/**/*.html",
     "./content/**/*.{html,md}",
+    "./node_modules/tw-elements/js/**/*.js",
     "./themes/blowfish/layouts/**/*.html",
     "./themes/blowfish/content/**/*.{html,md}",
-    "./node_modules/tw-elements/js/**/*.js",
+    "./themes/blowfish/node_modules/tw-elements/js/**/*.js",
   ],
   darkMode: "class",
   theme: {