feat: 配置首页下划线

docs/.vitepress/config.mts

@@ -1,10 +1,14 @@
 import { defineConfig } from 'vitepress'
+import { base } from '../env.mts'
 import { sidebar } from '../sidebar.mts'
 import { nav } from '../nav.mts'
 import {
   GitChangelog,
   GitChangelogMarkdownSection,
 } from '@nolebase/vitepress-plugin-git-changelog/vite'
+// import {
+//   InlineLinkPreviewElementTransform
+// } from '@nolebase/vitepress-plugin-inline-link-preview/markdown-it'
 
 // https://vitepress.dev/reference/site-config
 export default defineConfig({
@@ -24,6 +28,8 @@ export default defineConfig({
 
     optimizeDeps: {
       exclude: [
+        // [配置] 行内链接预览
+        // '@nolebase/vitepress-plugin-inline-link-preview/client',
         // [配置] 阅读增强
         '@nolebase/vitepress-plugin-enhanced-readabilities/client',
         'vitepress',
@@ -33,9 +39,14 @@ export default defineConfig({
     ssr: {
       noExternal: [
         // 如果还有别的依赖需要添加的话，并排填写和配置到这里即可 //
+        // [配置] 行内链接预览
+        // '@nolebase/vitepress-plugin-inline-link-preview',
         // [配置] 阅读增强
         '@nolebase/vitepress-plugin-enhanced-readabilities',
         '@nolebase/ui',
+        // [配置] @theojs/lumen
+        // issue: https://github.com/Theo-Messi/lumen/issues/234
+        'dayjs',
       ],
     },
   },
@@ -43,7 +54,7 @@ export default defineConfig({
   title: "就这么弄 (🚧 施工中)",
   description: "简单步骤与实用技巧",
 
-  base: '/tutorials/',
+  base: base,
   locales: {
     root: {
       label: '简体中文',
@@ -97,8 +108,8 @@ export default defineConfig({
     },
 
     docFooter: {
-      prev: '上一页',
+      prev: '上一篇',
-      next: '下一页'
+      next: '下一篇'
     },
 
     outline: {
@@ -120,4 +131,13 @@ export default defineConfig({
     lightModeSwitchTitle: '切换到浅色模式',
     darkModeSwitchTitle: '切换到深色模式'
   },
+
+  // markdown: {
+  //   config(md) {
+  //     // 其他 markdown-it 配置... //
+  //     // [配置] 行内链接预览
+  //     // refer: https://nolebase-integrations.ayaka.io/pages/zh-CN/integrations/vitepress-plugin-inline-link-preview/getting-started
+  //     md.use(InlineLinkPreviewElementTransform)
+  //   }
+  // },
 })

docs/.vitepress/theme/index.ts

@@ -6,6 +6,12 @@ import './style.css'
 import './custom.css'
 import Announcement from './components/Announcement.vue'
 import ArticleInfo from './components/ArticleInfo.vue'
+import { FooterData } from '../../home-footbar.mts'
+import {
+  HomeFooter,
+  HomeUnderline,
+  ShareButton
+} from '@theojs/lumen'
 import {
   NolebaseGitChangelogPlugin
 } from '@nolebase/vitepress-plugin-git-changelog/client'
@@ -34,6 +40,15 @@ export default {
       'nav-bar-content-after': () => h(NolebaseEnhancedReadabilitiesMenu),
       // 为较窄的屏幕（通常是小于 iPad Mini）添加阅读增强菜单
       'nav-screen-content-after': () => h(NolebaseEnhancedReadabilitiesScreenMenu),
+      // [配置] 首页 Footbar
+      'layout-bottom': () => h(HomeFooter, { Footer_Data: FooterData }),
+      // [配置] 侧栏分享按钮
+      'aside-outline-before': () => h(ShareButton, {
+        buttonIcon: 'fa6-solid:share-nodes', // 自定义图标 //
+        buttonText: '分享此页面', // 自定义按钮文本 //
+        copiedIcon: 'mdi:thumbs-up', // 自定义复制成功后的图标 //
+        copiedText: '链接已复制！' // 自定义复制成功后的文本 //
+      }),
     })
   },
   enhanceApp({ app, router, siteData }) {
@@ -85,5 +100,9 @@ export default {
         }
       },
     } as Options)
+
+    // [配置] 首页下划线
+    // docs: https://lumen.theojs.cn/guide/homeunderline
+    app.component('Home', HomeUnderline)
   }
 } satisfies Theme

docs/components/contents.vue

@@ -29,6 +29,7 @@
 
 <script setup lang="ts">
 import { useRouter, DefaultTheme } from 'vitepress';
+import { base } from '../env.mts';
 
 const props = defineProps<{
     base?: string,
@@ -38,7 +39,8 @@ const props = defineProps<{
 const router = useRouter()
 
 function goTo(link: string) {
-    const target = (props.base || '') + link?.replace('.md', '.html')
+    const baseUrl = (base.endsWith('/') ? base.substring(0, base.length - 1) : base)
+    const target = baseUrl + (props.base || '') + link?.replace('.md', '.html')
     console.log('base', props.base)
     console.log('link', link)
     console.log('target', target)

docs/env.mts

@@ -0,0 +1,5 @@
+// 全局配置
+
+// 部署后网站的 base URL。
+// 注意：前后都带 /
+export const base = '/tutorials/'

docs/home-footbar.mts

@@ -0,0 +1,42 @@
+import type { FooterData as FooterDataType } from '@theojs/lumen'
+
+// [配置] 首页 Footbar
+export const FooterData: FooterDataType = {
+    // beian: { icp: '备案号', police: '公网安备号', showIcon: true },
+    author: {
+        name: 'coder-xiaomo', // 程序员小墨
+        // link: 'https://',
+    },
+    group: [
+        // {
+        //     title: '外部链接',
+        //     icon: 'bx:link', // `iconify`图标
+        //     color: 'rgba(255, 87, 51, 1)',
+        //     links: [
+        //         { name: '示例1', link: 'https://', icon: 'solar:book-bold' },
+        //         { name: '示例2', link: 'https://' }
+        //     ]
+        // },
+        {
+            title: '开源地址',
+            icon: 'bx:link',
+            color: 'rgba(255, 87, 51, 1)',
+            links: [
+                {
+                    name: 'GitHub',
+                    icon: 'octicon:mark-github-16',
+                    link: 'https://github.com/coder-xiaomo/tutorials',
+                },
+                {
+                    name: 'Gitee (码云)',
+                    link: 'https://gitee.com/coder-xiaomo/tutorials',
+                },
+                {
+                    name: 'GitCode',
+                    link: 'https://gitcode.com/coder-xiaomo/tutorials',
+                },
+
+            ]
+        }
+    ]
+}

docs/index.md

@@ -4,22 +4,23 @@ layout: home
 
 hero:
   name: "就这么弄"
-  text: "简单步骤与实用技巧"
+  text: "简单步骤"
+  textsuffix: "与实用技巧"
   image:
     src: /assets/logo.svg
     alt: VitePress
     style: "border-radius: 50%"
-  tagline: 时间应该更重要的事情
+  tagline: 你的时间应该去做更重要的事情
   actions:
     - theme: brand
       text: 进入教程
       link: /how-to/intro
-    - theme: alt
+    # - theme: alt
-      text: Markdown Examples
+    #   text: Markdown Examples
-      link: /markdown-examples
+    #   link: /markdown-examples
-    - theme: alt
+    # - theme: alt
-      text: API Examples
+    #   text: API Examples
-      link: /api-examples
+    #   link: /api-examples
 
 # features:
 #   - title: Feature A
@@ -30,6 +31,8 @@ hero:
 #     details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
 ---
 
+<Home />
+
 ::: warning 🚧 施工中
 
 很高兴见到你！但很抱歉，这个项目还在施工中。

package.json

@@ -8,6 +8,7 @@
     "docs:preview": "vitepress preview docs"
   },
   "dependencies": {
+    "@theojs/lumen": "^5.4.0",
     "vue": "^3.5.13"
   },
   "devDependencies": {