Commit bb7c2f0

HPCesia <me@hpcesia.com>
2025-05-26 11:35:33
feat(footer): column footer links
1 parent d6cd71f
Changed files (8)
packages/i18n/src/en/web/index.ts
@@ -6,6 +6,7 @@ const en_web = {
     close: 'Close',
   },
   navigation: {
+    title: 'Navigation',
     home: 'Home',
     about: 'About',
     archive: {
packages/i18n/src/zh-CN/web/index.ts
@@ -6,6 +6,7 @@ const zh_CN_web = {
     close: '关闭',
   },
   navigation: {
+    title: '导航',
     home: '首页',
     about: '关于',
     archive: {
packages/i18n/src/zh-TW/web/index.ts
@@ -6,6 +6,7 @@ const zh_TW_web = {
     close: '關閉',
   },
   navigation: {
+    title: '導航',
     home: '首頁',
     about: '關於',
     archive: {
packages/i18n/src/i18n-types.ts
@@ -185,6 +185,10 @@ export type NamespaceWebTranslation = {
 		close: string
 	}
 	navigation: {
+		/**
+		 * N​a​v​i​g​a​t​i​o​n
+		 */
+		title: string
 		/**
 		 * H​o​m​e
 		 */
@@ -581,6 +585,10 @@ export type TranslationFunctions = {
 			close: () => LocalizedString
 		}
 		navigation: {
+			/**
+			 * Navigation
+			 */
+			title: () => LocalizedString
 			/**
 			 * Home
 			 */
src/components/widgets/Pagination.astro
@@ -1,4 +1,5 @@
 ---
+import { footerConfig } from '@/config';
 import { t } from '@utils/i18n';
 import { Icon } from 'astro-icon/components';
 import Button from './Button.astro';
@@ -44,7 +45,14 @@ else {
 }
 ---
 
-<nav id="pagination" class="relative flex min-h-10 w-full justify-between max-md:px-2">
+<nav
+  id="pagination"
+  class:list={[
+    'relative flex min-h-10 w-full justify-between max-md:px-2',
+    // Hide pagination if only one page and no footer columns
+    pages.length <= 1 && footerConfig.columns !== false && 'max-xs:hidden',
+  ]}
+>
   {
     current > 1 && (
       <Button
src/components/PageFooter.astro
@@ -4,7 +4,28 @@ import { footerConfig, profileConfig } from '@/config';
 const currentYear = new Date().getFullYear();
 ---
 
-<footer class="footer mt-auto shrink-0" id="page-footer"></footer>
+<footer class="mt-auto shrink-0" id="page-footer">
+  {
+    footerConfig.columns && (
+      <div class="mt-4 mb-8 flex w-full flex-wrap justify-between px-8 md:px-12">
+        {footerConfig.columns.map((col) => (
+          <nav class="grid grid-cols-1 gap-4">
+            <ul class="menu">
+              <li class="menu-title">
+                <h3 class="font-bold uppercase">{col.title}</h3>
+              </li>
+              {col.items.map((item) => (
+                <li>
+                  <a href={item.link}>{item.text}</a>
+                </li>
+              ))}
+            </ul>
+          </nav>
+        ))}
+      </div>
+    )
+  }
+</footer>
 <footer
   class="footer border-base-300 bg-base-200/25 text-base-content flex flex-col justify-between border-t px-10 py-4 text-lg md:flex-row"
   id="footer"
src/types/config.d.ts
@@ -454,6 +454,20 @@ export type LicenseConfig = {
 };
 
 export type FooterConfig = {
+  /**
+   * The columns displayed in the footer. If set to `false`, no columns will be displayed.
+   *
+   * 页脚中显示的列。如果设置为 `false`,则不显示任何列。
+   */
+  columns:
+    | {
+        title: string;
+        items: {
+          text: string;
+          link: string;
+        }[];
+      }[]
+    | false;
   /**
    * The start year of the copyright.
    *
src/config.ts
@@ -145,6 +145,25 @@ export const licenseConfig: LicenseConfig = {
 };
 
 export const footerConfig: FooterConfig = {
+  columns: [
+    {
+      title: t.navigation.title(),
+      items: [
+        { text: t.navigation.home(), link: '/' },
+        { text: t.navigation.archive.title(), link: '/archives/' },
+        { text: t.navigation.about(), link: '/about/' },
+        { text: t.button.subscribe(), link: '/rss.xml' },
+      ],
+    },
+    {
+      title: t.navigation.friendLinks(),
+      items: linksConfig.items
+        .flatMap((group) =>
+          group.groupItems.map((item) => ({ text: item.name, link: item.url }))
+        )
+        .slice(0, 5),
+    },
+  ],
   copyrightYear: 2025,
   rightItems: [
     [