Skip to content

Commit a372afb

Browse files
Yuki-NagoriYuki-Nagori
committed
index
1 parent fbe5ee2 commit a372afb

File tree

7 files changed

+418
-17
lines changed

7 files changed

+418
-17
lines changed

‎docs/.vitepress/config.mts‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,4 @@ export default defineConfig({
1313

1414
// 清理 URL
1515
cleanUrls: true,
16-
17-
// 最后更新时间
18-
lastUpdated: true,
1916
})

‎docs/.vitepress/theme/Layout.vue‎

Lines changed: 102 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,110 @@
11
<script setup lang="ts">
22
import { useData } from 'vitepress'
3+
import NavBar from './components/NavBar.vue'
4+
import Footer from './components/Footer.vue'
35
4-
// https://vitepress.dev/reference/runtime-api#usedata
5-
const { site, frontmatter } = useData()
6+
const { frontmatter, page } = useData()
67
</script>
78

89
<template>
9-
<div v-if="frontmatter.home">
10-
<h1>{{ site.title }}</h1>
11-
<p>{{ site.description }}</p>
12-
<ul>
13-
<li><a href="/markdown-examples.html">Markdown Examples</a></li>
14-
<li><a href="/api-examples.html">API Examples</a></li>
15-
</ul>
16-
</div>
17-
<div v-else>
18-
<a href="/">Home</a>
19-
<Content />
10+
<div class="layout">
11+
<!-- 导航栏 -->
12+
<NavBar />
13+
14+
<!-- 主要内容区 -->
15+
<main class="main-content">
16+
<!-- 首页布局 -->
17+
<div v-if="frontmatter.home" class="home">
18+
<Content />
19+
</div>
20+
21+
<!-- 文档页面布局 -->
22+
<div v-else class="page">
23+
<Content />
24+
</div>
25+
</main>
26+
27+
<!-- 页脚 -->
28+
<Footer />
2029
</div>
2130
</template>
31+
32+
<style scoped>
33+
.layout {
34+
min-height: 100vh;
35+
display: flex;
36+
flex-direction: column;
37+
}
38+
39+
.main-content {
40+
flex: 1;
41+
padding: 2rem;
42+
max-width: 1200px;
43+
margin: 0 auto;
44+
width: 100%;
45+
}
46+
47+
/* 首页样式 - 居中布局 */
48+
.home {
49+
text-align: center;
50+
}
51+
52+
.home :deep(h1) {
53+
font-size: 3rem;
54+
font-weight: 700;
55+
margin-bottom: 1rem;
56+
background: linear-gradient(120deg, #3b82f6, #10b981);
57+
-webkit-background-clip: text;
58+
-webkit-text-fill-color: transparent;
59+
}
60+
61+
.home :deep(p) {
62+
font-size: 1.25rem;
63+
color: #666;
64+
margin-bottom: 2rem;
65+
}
66+
67+
/* 文档页面样式 - 左对齐 */
68+
.page {
69+
text-align: left;
70+
}
71+
72+
.page :deep(h1) {
73+
font-size: 2rem;
74+
margin-bottom: 1rem;
75+
border-bottom: 1px solid #e5e7eb;
76+
padding-bottom: 0.5rem;
77+
}
78+
79+
.page :deep(h2) {
80+
font-size: 1.5rem;
81+
margin-top: 2rem;
82+
margin-bottom: 1rem;
83+
}
84+
85+
.page :deep(p) {
86+
line-height: 1.8;
87+
margin-bottom: 1rem;
88+
}
89+
90+
.page :deep(pre) {
91+
background: #1e1e1e;
92+
color: #d4d4d4;
93+
padding: 1rem;
94+
border-radius: 0.5rem;
95+
overflow-x: auto;
96+
}
97+
98+
.page :deep(code) {
99+
font-family: 'JetBrains Mono', monospace;
100+
background: #f3f4f6;
101+
padding: 0.2em 0.4em;
102+
border-radius: 0.25rem;
103+
font-size: 0.875em;
104+
}
105+
106+
.page :deep(pre code) {
107+
background: transparent;
108+
padding: 0;
109+
}
110+
</style>

‎docs/.vitepress/theme/components/Footer.vue‎

Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
<script setup lang="ts"></script>
2+
3+
<template>
4+
<footer class="footer">
5+
<div class="container">
6+
<div class="footer-content">
7+
<div class="footer-left">
8+
<p class="message">Released under the Apache-2.0 License.</p>
9+
<p class="copyright">Copyright © 2024-present MoganLab</p>
10+
</div>
11+
12+
<div class="footer-right">
13+
<a href="https://github.com/MoganLab/goldfish" target="_blank" class="github-link">
14+
<svg viewBox="0 0 24 24" class="github-icon">
15+
<path
16+
fill="currentColor"
17+
d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"
18+
/>
19+
</svg>
20+
GitHub
21+
</a>
22+
</div>
23+
</div>
24+
</div>
25+
</footer>
26+
</template>
27+
28+
<style scoped>
29+
.footer {
30+
background: #f9fafb;
31+
border-top: 1px solid #e5e7eb;
32+
padding: 2rem 0;
33+
margin-top: auto;
34+
}
35+
36+
.container {
37+
max-width: 1200px;
38+
margin: 0 auto;
39+
padding: 0 2rem;
40+
}
41+
42+
.footer-content {
43+
display: flex;
44+
justify-content: space-between;
45+
align-items: center;
46+
}
47+
48+
.footer-left {
49+
text-align: left;
50+
}
51+
52+
.message,
53+
.copyright {
54+
margin: 0;
55+
color: #6b7280;
56+
font-size: 0.875rem;
57+
}
58+
59+
.github-link {
60+
display: flex;
61+
align-items: center;
62+
gap: 0.5rem;
63+
text-decoration: none;
64+
color: #4b5563;
65+
font-weight: 500;
66+
transition: color 0.2s;
67+
}
68+
69+
.github-link:hover {
70+
color: #3b82f6;
71+
}
72+
73+
.github-icon {
74+
width: 1.25rem;
75+
height: 1.25rem;
76+
}
77+
78+
@media (max-width: 640px) {
79+
.footer-content {
80+
flex-direction: column;
81+
gap: 1rem;
82+
text-align: center;
83+
}
84+
85+
.footer-left {
86+
text-align: center;
87+
}
88+
}
89+
</style>

‎docs/.vitepress/theme/components/NavBar.vue‎

Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
<script setup lang="ts">
2+
import { useData } from 'vitepress'
3+
4+
const { site } = useData()
5+
6+
const navItems = [
7+
{ text: '首页', link: '/' },
8+
{ text: '指南', link: '/guide/getting-started' },
9+
{ text: 'GitHub', link: 'https://github.com/MoganLab/goldfish' },
10+
]
11+
</script>
12+
13+
<template>
14+
<nav class="navbar">
15+
<div class="container">
16+
<a href="/" class="logo">
17+
<span class="logo-icon">🐟</span>
18+
<span class="logo-text">{{ site.title }}</span>
19+
</a>
20+
21+
<div class="nav-links">
22+
<a
23+
v-for="item in navItems"
24+
:key="item.text"
25+
:href="item.link"
26+
class="nav-link"
27+
:target="item.link.startsWith('http') ? '_blank' : undefined"
28+
>
29+
{{ item.text }}
30+
</a>
31+
</div>
32+
</div>
33+
</nav>
34+
</template>
35+
36+
<style scoped>
37+
.navbar {
38+
background: white;
39+
border-bottom: 1px solid #e5e7eb;
40+
padding: 0.75rem 0;
41+
position: sticky;
42+
top: 0;
43+
z-index: 100;
44+
}
45+
46+
.container {
47+
max-width: 1200px;
48+
margin: 0 auto;
49+
padding: 0 2rem;
50+
display: flex;
51+
justify-content: space-between;
52+
align-items: center;
53+
}
54+
55+
.logo {
56+
display: flex;
57+
align-items: center;
58+
gap: 0.5rem;
59+
text-decoration: none;
60+
color: inherit;
61+
}
62+
63+
.logo-icon {
64+
font-size: 1.5rem;
65+
}
66+
67+
.logo-text {
68+
font-size: 1.25rem;
69+
font-weight: 600;
70+
background: linear-gradient(120deg, #3b82f6, #10b981);
71+
-webkit-background-clip: text;
72+
-webkit-text-fill-color: transparent;
73+
}
74+
75+
.nav-links {
76+
display: flex;
77+
gap: 1.5rem;
78+
}
79+
80+
.nav-link {
81+
text-decoration: none;
82+
color: #4b5563;
83+
font-weight: 500;
84+
transition: color 0.2s;
85+
}
86+
87+
.nav-link:hover {
88+
color: #3b82f6;
89+
}
90+
</style>

0 commit comments

Comments
 (0)