样式优化与小调整

docs/.vitepress/theme/custom.css

@@ -1,3 +1,11 @@
 :root {
+  /* 左侧边栏加宽 */
   --vp-sidebar-width: 320px;
+  /* 导航栏加高 */
+  --vp-nav-height: 72px;
 }
+
+.VPContent {
+  /* 首页与顶部之间的距离加高 */
+  padding-top: calc(var(--vp-nav-height) + 48px) !important;
+}

docs/components/contents.vue

@@ -6,35 +6,35 @@
     <br>
     props.sidebarItem.base: {{ props.sidebarItem.base }}
     <br>
--->
+    -->
-    <p v-if="props.sidebarItem.text">
-        <a v-if="props.sidebarItem.link" @click="goTo(props.sidebarItem.link)" style="cursor: pointer;">
-            {{ props.sidebarItem.text }}
-        </a>
-        <span style="font-weight: bold;" v-else>
-            {{ props.sidebarItem.text }}
-        </span>
-    </p>
-    <!-- ------------------- -->
 
-    <!-- <pre>{{ page }}</pre> -->
+    <!-- 跳过当前页面的菜单 -->
+    <template v-if="props.sidebarItem.text !== '开始'">
+        <p v-if="props.sidebarItem.text">
+            <a v-if="props.sidebarItem.link" @click="goTo(props.sidebarItem.link)" style="cursor: pointer;">
+                {{ props.sidebarItem.text }}
+            </a>
+            <span style="font-weight: bold;" v-else>
+                {{ props.sidebarItem.text }}
+            </span>
+        </p>
+        <!-- ------------------- -->
 
-    <div v-if="props.sidebarItem.items" :style="props.sidebarItem.text ? 'margin-left: 25px;' : undefined">
+        <div v-if="props.sidebarItem.items" :style="props.sidebarItem.text ? 'margin-left: 25px;' : undefined">
-        <contents v-for="item in props.sidebarItem.items" :base="props.sidebarItem.base || props.base"
+            <contents v-for="item in props.sidebarItem.items" :base="props.sidebarItem.base || props.base"
-            :sidebar-item="item" />
+                :sidebar-item="item" />
-    </div>
+        </div>
+    </template>
 </template>
 
 <script setup lang="ts">
-import { useData, useRouter, DefaultTheme } from 'vitepress';
+import { useRouter, DefaultTheme } from 'vitepress';
 
 const props = defineProps<{
     base?: string,
     sidebarItem: DefaultTheme.SidebarItem
 }>()
 
-const { page } = useData()
-
 const router = useRouter()
 
 function goTo(link: string) {

docs/index.md

@@ -9,11 +9,11 @@ hero:
     src: /public/assets/logo.svg
     alt: VitePress
     style: "border-radius: 50%"
-  tagline: My great project tagline
+  tagline: 时间应该更重要的事情
   actions:
     - theme: brand
       text: 进入教程
-      link: /how-to
+      link: /how-to/intro
     - theme: alt
       text: Markdown Examples
       link: /markdown-examples

docs/nav.mts

@@ -7,7 +7,7 @@ export const nav: DefaultTheme.NavItem[] = [
     },
     {
         text: 'Home2',
-        link: '/how-to/index',
+        link: '/how-to/intro',
         activeMatch: '/how-to/',
     },
     {

docs/sidebar.mts

@@ -23,7 +23,7 @@ export const sidebar: DefaultTheme.Sidebar = {
                 items: [
                     {
                         text: '教程简介',
-                        link: '/index.md',
+                        link: 'intro',
                     },
                 ]
             },
@@ -35,7 +35,7 @@ export const sidebar: DefaultTheme.Sidebar = {
                         items: [
                             {
                                 text: `${serial('linux.db')}MySQL 8.x 安装 & 配置 (Ubuntu)`,
-                                link: 'database/mysql/install-on-ubuntu.md',
+                                link: 'database/mysql/install-on-ubuntu',
                             }
                         ]
                     },