style: opt

Author: NelsonYong

docs/.vitepress/config/en.ts

@@ -157,7 +157,7 @@ function nav(): DefaultTheme.NavItem[] {
       text: 'Guide',
       activeMatch: '/guide/',
       items: [
-        { text: 'Introduction', link: '/guide/' },
+        { text: 'Introduction', link: '/guide' },
         { text: 'Getting Started', link: '/guide/getting-started' },
         { text: '🫶 Migrate to v2 version', link: '/guide/migrate' }
       ]

docs/.vitepress/config/zh.ts

@@ -184,7 +184,7 @@ function nav(): DefaultTheme.NavItem[] {
       text: '指南',
       activeMatch: '/zh/guide/',
       items: [
-        { text: '介绍', link: '/zh/guide/' },
+        { text: '介绍', link: '/zh/guide' },
         { text: '开始使用', link: '/zh/guide/getting-started' },
         { text: '🫶 迁移到 v2 版本', link: '/zh/guide/migrate' }
       ]

docs/.vitepress/theme/styles.css

@@ -14,11 +14,53 @@
   --vp-home-hero-image-background-image: linear-gradient(-45deg,
       #42d392 50%,
       #647eff 50%);
+  --vhp-demo-shadow-color: rgba(0, 0, 0, 0.3);
+  --vp-code-line-number-color: var(--vp-c-text-dark-3);
+}
+
+.dark {
+  --vhp-demo-shadow-color: rgba(188, 189, 190, 0.3);
+
+  /* 暗黑模式拟物圆角 - 突出版 */
+  .vitepress-demo {
+    border-radius: 8px;
+    overflow: hidden;
+    margin-top: 8px;
+    background: #121212;
+    /* 更深的背景色 */
+    box-shadow:
+      4px 4px 8px rgba(0, 0, 0, 0.5),
+      /* 更强的阴影 */
+      -4px -4px 8px rgba(80, 80, 80, 0.3),
+      /* 更亮的高光 */
+      inset 0 0 10px rgba(0, 0, 0, 0.2);
+    /* 添加内阴影增加层次感 */
+    border: none;
+  }
+
+
+}
+
+/* 亮色模式拟物圆角 - 突出版 */
+.vitepress-demo {
+  border-radius: 8px !important;
+  overflow: hidden;
+  margin-top: 8px;
+  background: #ffffff;
+  /* 更亮的背景色 */
+  box-shadow:
+    4px 4px 8px rgba(0, 0, 0, 0.1),
+    /* 更强的阴影 */
+    -4px -4px 8px rgba(255, 255, 255, 0.8),
+    /* 更亮的高光 */
+    inset 0 0 10px rgba(0, 0, 0, 0.05);
+  /* 添加内阴影增加层次感 */
+  border: none;
 }
 
 input {
   opacity: 1;
-  background-color: var(--vhp-func-bg);
+  background-color: var(--vp-code-bg);
   padding-left: 8px;
   height: 36px;
   font-weight: 500;

docs/index.md

@@ -9,7 +9,7 @@ hero:
   actions:
     - theme: brand
       text: Quick Start 
-      link: /guide
+      link: /guide/
     - theme: alt
       text: Hooks list
       link: /hooks/useRequest/quick-start

docs/zh/index.md

@@ -9,7 +9,7 @@ hero:
   actions:
     - theme: brand
       text: 快速开始
-      link: /zh/guide
+      link: /zh/guide/
     - theme: alt
       text: Hooks 列表  
       link: /zh/hooks/useRequest/quick-start
@@ -39,3 +39,32 @@ features:
     details: 测试完善，安全可靠。 
 ---
 
+<script setup>
+import {
+  VPTeamPage,
+  VPTeamPageTitle,
+  VPTeamMembers,
+  VPTeamPageSection
+} from 'vitepress/theme'
+
+import {members} from '../contributors'
+
+</script>
+
+<VPTeamPage>
+  <VPTeamPageTitle>
+    <template #title>团队</template>
+    <template #lead>Vue Hooks Plus 由一群热爱 Vue 的开发者开发和维护。</template>
+  </VPTeamPageTitle>
+  <VPTeamMembers size="small" :members="members" />
+  <VPTeamPageSection>
+    <template #title>贡献者</template>
+    <template #members>
+      <div style="display: flex; justify-content: center;">
+        <a target="__blank" href="https://github.com/InhiblabCore/vue-hooks-plus/graphs/contributors">
+           <img src="https://contrib.rocks/image?repo=InhiblabCore/vue-hooks-plus" />
+        </a>
+      </div>
+    </template>
+  </VPTeamPageSection>
+</VPTeamPage>