From 93c2fbb5b35a163e8423596c843715ea43f114f5 Mon Sep 17 00:00:00 2001
From: radishzzz <shuyinsen@gmail.com>
Date: Mon, 17 Mar 2025 00:28:22 +0000
Subject: [PATCH] chore: update code comment

---
 src/components/Footer.astro                   |  2 +-
 src/components/Widgets/LanguageSwitcher.astro | 34 +++++++++++--------
 src/content/config.ts                         |  2 ++
 src/layouts/Head.astro                        |  3 +-
 src/layouts/Layout.astro                      | 18 ++++++----
 5 files changed, 36 insertions(+), 23 deletions(-)

diff --git a/src/components/Footer.astro b/src/components/Footer.astro
index 89abdf1..31fa013 100644
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@@ -24,7 +24,7 @@ const year = Number(startYear) === currentYear
     className,
   ]}
 >
-  <!-- Only show on desktop -->
+  <!-- Desktop widget -->
   <div class="mb-11.5 ml-1.5 hidden gap-7 lg:flex">
     <ThemeToggle />
     <LanguageSwitcher supportedLangs={supportedLangs} />
diff --git a/src/components/Widgets/LanguageSwitcher.astro b/src/components/Widgets/LanguageSwitcher.astro
index 55ef9a7..37d47d1 100644
--- a/src/components/Widgets/LanguageSwitcher.astro
+++ b/src/components/Widgets/LanguageSwitcher.astro
@@ -1,4 +1,5 @@
 ---
+import { moreLocales } from '@/config'
 import { getNextGlobalLangPath, getNextSupportedLangPath } from '@/i18n/path'
 import { isPostPage, isTagPage } from '@/utils/page'
 
@@ -11,6 +12,9 @@ const currentPath = Astro.url.pathname
 const isPost = isPostPage(currentPath)
 const isTag = isTagPage(currentPath)
 
+// Check if there are other languages to switch
+const showLanguageSwitcher = moreLocales.length > 0
+
 // Check if only the supported language switch list is used
 const useSupportedLangs = isPost || (isTag && supportedLangs.length > 0)
 
@@ -20,18 +24,20 @@ const nextUrl = useSupportedLangs
   : getNextGlobalLangPath(currentPath) // Switch between all languages
 ---
 
-<a
-  href={nextUrl}
-  class="aspect-square w-4 c-secondary active:scale-90 hover:c-primary"
-  aria-label="Switch website language"
->
-  <svg
-    xmlns="http://www.w3.org/2000/svg"
-    viewBox="0 0 24 24"
-    aria-hidden="true"
-    class="h-full w-full"
-    fill="currentColor"
+{showLanguageSwitcher && (
+  <a
+    href={nextUrl}
+    class="aspect-square w-4 c-secondary active:scale-90 hover:c-primary"
+    aria-label="Switch website language"
   >
-    <path d="M19 21 12.3 2h-1L4.7 21l-2.5.2v.8h6.3v-.8L5.7 21l2-5.9h7.5l2 5.9-3.3.2v.8h7.9v-.8zM8 14.3l3.4-10.1 3.5 10.1z" />
-  </svg>
-</a>
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 24 24"
+      aria-hidden="true"
+      class="h-full w-full"
+      fill="currentColor"
+    >
+      <path d="M19 21 12.3 2h-1L4.7 21l-2.5.2v.8h6.3v-.8L5.7 21l2-5.9h7.5l2 5.9-3.3.2v.8h7.9v-.8zM8 14.3l3.4-10.1 3.5 10.1z" />
+    </svg>
+  </a>
+)}
diff --git a/src/content/config.ts b/src/content/config.ts
index 906f90b..26b13f2 100644
--- a/src/content/config.ts
+++ b/src/content/config.ts
@@ -1,6 +1,7 @@
 import { allLocales } from '@/config'
 import { defineCollection, z } from 'astro:content'
 
+// Posts collection
 const postsCollection = defineCollection({
   schema: z.object({
     // required
@@ -22,6 +23,7 @@ const postsCollection = defineCollection({
   }),
 })
 
+// About page
 const aboutCollection = defineCollection({
   schema: z.object({
     lang: z.enum(['', ...allLocales]).optional().default(''),
diff --git a/src/layouts/Head.astro b/src/layouts/Head.astro
index 0446ed8..f42b895 100644
--- a/src/layouts/Head.astro
+++ b/src/layouts/Head.astro
@@ -24,15 +24,16 @@ const { commentURL = '', imageHostURL = '', customGoogleAnalyticsJS = '', custom
 const initMetaTheme = mode === 'dark' ? darkMode : lightMode
 const headTitle = i18nTitle ? currentUI.title : title
 const headSubtitle = i18nTitle ? currentUI.subtitle : subtitle
+
 const pageTitle = postTitle ? `${postTitle} | ${headTitle}` : `${headTitle} - ${headSubtitle}`
 const pageDescription = postDescription || description
-// TODO: Change openGraph image fallback url
 const pageImage = postSlug
   ? `${url}/og/${postSlug}.png`
   : apiflashKey
     ? `https://api.apiflash.com/v1/urltoimage?access_key=${apiflashKey}&url=${url}${langCode}&format=png&width=1500&height=788&ttl=86400&wait_until=network_idle&no_tracking=true`
     : `https://api.apiflash.com/v1/urltoimage?access_key=02a837b6188f4ba0a7fd9fbeff03a83e&url=https://retypeset.radishzz.cc${langCode}&format=png&width=1500&height=788&ttl=604800&wait_until=network_idle&no_tracking=true`
 ---
+
 <head>
 <!-- Basic info -->
 <meta charset="utf-8" />
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index edef7cd..4f986c4 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -27,7 +27,7 @@ const { postTitle, postDescription, postSlug, supportedLangs = [] } = Astro.prop
 const { isHome, isPost } = getPageInfo(Astro.url.pathname)
 const { light: { background: lightMode }, dark: { background: darkMode } } = themeConfig.color
 const fontStyle = themeConfig.global.fontStyle === 'serif' ? 'font-serif' : 'font-sans'
-const footerMarginClass = isPost && themeConfig.comment?.waline?.serverURL
+const mobileFooterMargin = isPost && themeConfig.comment?.waline?.serverURL
   ? 'mt-8'
   : 'mt-12'
 ---
@@ -39,13 +39,16 @@ const footerMarginClass = isPost && themeConfig.comment?.waline?.serverURL
 >
   <Head {postTitle} {postDescription} {postSlug} />
   <body data-overlayscrollbars-initialize>
-    <!-- mobile -->
+
+    <!-- Layout Calculation -->
+    <!-- Mobile -->
     <!-- mobile width: 393px / suitable words number: 21 / content width: 21*16px=336px / padding: (393px-336px)/2=28.5px=（28.5px/393px）=7.25vw -->
     <!-- max mobile width: 1024px / max word number: 42+2=44 / max content width: 44*16px=704px / max div width: 704px/(100vw-7.25vw*2)=823.3918px/4=205.848 / max padding: 823.3918px-704px=119.3918px/2=59.6959px/16=3.731rem -->
-    <!-- desktop -->
+    <!-- Desktop -->
     <!-- desktop min div width: 1024px-90px*2=844px / min words number: 32 / min content width: 32*16px=512px/16=32rem / title width: 14*16px=224px/16=14rem / min-gap: 844px-512px-224px=108px -->
     <!-- desktop max div width: 1100px+90px*2=1280px/4=320 / max words number: 42+2=44 / max content width: 44*16px=704px / title width: 14*16px=224px / max-gap: 1100px-704px-224px=172px/16=10.75rem -->
     <!-- content width: calc(32rem+(100vw-1024px)*(44rem-32rem)/(1280-1024))=calc(75vw-16rem) / gap width: calc(6.75rem+(100vw-1024px)*(10.75rem-6.75rem)/(1280-1024))=calc(25vw-9.25rem) -->
+
     <div
       class="mx-auto max-w-205.848 min-h-vh w-full min-h-dvh"
       p="x-[min(7.25vw,3.731rem)] y-9 lg:(x-22.5 y-20)"
@@ -55,7 +58,7 @@ const footerMarginClass = isPost && themeConfig.comment?.waline?.serverURL
       <div class={!isHome && isPost ? 'hidden lg:block' : ''}>
         <MainHeader />
         <Navigation />
-        <!-- only show footer on desktop-->
+        <!-- Desktop footer -->
         <Footer class="fixed hidden lg:block" supportedLangs={supportedLangs} />
       </div>
 
@@ -67,14 +70,15 @@ const footerMarginClass = isPost && themeConfig.comment?.waline?.serverURL
         <slot />
       </main>
 
-      <!-- show footer on mobile -->
-      <Footer class={`block lg:hidden ${footerMarginClass}`} supportedLangs={supportedLangs} />
+      <!-- Mobile footer -->
+      <Footer class={`block lg:hidden ${mobileFooterMargin}`} supportedLangs={supportedLangs} />
     </div>
+
     <!-- <Scrollbar /> -->
     <!-- <BackToTop /> -->
     <!-- <PhotoSwipe /> -->
 
-    <!-- only show on mobile (fix position issue on ios / fix right distance)-->
+    <!-- Mobile widget (fix position issue on ios / fix right distance)-->
     <div class="absolute right-7.25vw top-13.6 flex gap-6 [@supports(-webkit-touch-callout:none)]:top-12.6 min-[823px]:right-[calc(50vw-22rem)] lg:hidden">
       <LanguageSwitcher supportedLangs={supportedLangs} />
       <ThemeToggle />