Skip to content

Commit 5e8f20b

Browse files
committed
添加页内导航
1 parent 957bc8e commit 5e8f20b

File tree

2 files changed

+194
-0
lines changed

2 files changed

+194
-0
lines changed

src/components/Nested.astro

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
---
2+
const { heading } = Astro.props;
3+
const { depth, slug, text } = heading as Heading;
4+
---
5+
6+
<li class="nested" style=`--depth: ${depth};`>
7+
<a href=`#${slug}` style=`--depth: ${depth};`>
8+
<span class="nested-text" style=`--depth: ${depth};`>{text}</span>
9+
</a>
10+
<slot />
11+
</li>

src/components/OnThisPages.astro

Lines changed: 183 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,183 @@
1+
---
2+
import type { JSX } from "astro/jsx-runtime";
3+
4+
const { headings } = Astro.props as { headings: Heading[] };
5+
---
6+
7+
<nav aria-labelledby="starlight__on-this-page">
8+
<h2 id="starlight__on-this-page">本页内容</h2>
9+
{
10+
() => {
11+
let stack: JSX.Element[] = [];
12+
13+
let prevDepth = 0;
14+
for (const i in headings) {
15+
const heading = headings[i]
16+
if (heading.depth > prevDepth) {
17+
prevDepth = heading.depth;
18+
stack.push();
19+
}
20+
}
21+
}
22+
}
23+
24+
</nav>
25+
26+
<nav aria-labelledby="starlight__on-this-page">
27+
<h2 id="starlight__on-this-page">本页内容</h2>
28+
<ul class="astro-oitnbpw7" style="--depth: 0;">
29+
<li class="astro-oitnbpw7" style="--depth: 0;">
30+
<a href="#_top" class="astro-oitnbpw7" style="--depth: 0;">
31+
<span class="astro-oitnbpw7" style="--depth: 0;">概述</span>
32+
</a>
33+
</li>
34+
<li class="astro-oitnbpw7" style="--depth: 0;">
35+
<a href="#context-files" class="astro-oitnbpw7" style="--depth: 0;">
36+
<span class="astro-oitnbpw7" style="--depth: 0;">Context files</span>
37+
</a>
38+
</li>
39+
<li class="astro-oitnbpw7" style="--depth: 0;">
40+
<a
41+
href="#astro-docs-mcp-server"
42+
class="astro-oitnbpw7"
43+
style="--depth: 0;"
44+
>
45+
<span class="astro-oitnbpw7" style="--depth: 0;"
46+
>Astro Docs MCP Server</span
47+
>
48+
</a>
49+
<ul class="astro-oitnbpw7" style="--depth: 1;">
50+
<li class="astro-oitnbpw7" style="--depth: 1;">
51+
<a href="#server-details" class="astro-oitnbpw7" style="--depth: 1;">
52+
<span class="astro-oitnbpw7" style="--depth: 1;"
53+
>Server Details</span
54+
>
55+
</a>
56+
</li>
57+
<li class="astro-oitnbpw7" style="--depth: 1;">
58+
<a href="#installation" class="astro-oitnbpw7" style="--depth: 1;">
59+
<span class="astro-oitnbpw7" style="--depth: 1;">Installation</span>
60+
</a>
61+
<ul class="astro-oitnbpw7" style="--depth: 2;">
62+
<li class="astro-oitnbpw7" style="--depth: 2;">
63+
<a
64+
href="#manual-setup"
65+
class="astro-oitnbpw7"
66+
style="--depth: 2;"
67+
>
68+
<span class="astro-oitnbpw7" style="--depth: 2;"
69+
>Manual setup</span
70+
>
71+
</a>
72+
</li><li class="astro-oitnbpw7" style="--depth: 2;">
73+
<a
74+
href="#claude-code-cli"
75+
class="astro-oitnbpw7"
76+
style="--depth: 2;"
77+
>
78+
<span class="astro-oitnbpw7" style="--depth: 2;"
79+
>Claude Code CLI</span
80+
>
81+
</a>
82+
</li><li class="astro-oitnbpw7" style="--depth: 2;">
83+
<a
84+
href="#claude-code-github-action"
85+
class="astro-oitnbpw7"
86+
style="--depth: 2;"
87+
>
88+
<span class="astro-oitnbpw7" style="--depth: 2;"
89+
>Claude Code GitHub Action</span
90+
>
91+
</a>
92+
</li><li class="astro-oitnbpw7" style="--depth: 2;">
93+
<a
94+
href="#cursor"
95+
class="astro-oitnbpw7"
96+
style="--depth: 2;"
97+
aria-current="true"
98+
>
99+
<span class="astro-oitnbpw7" style="--depth: 2;">Cursor</span>
100+
</a>
101+
</li><li class="astro-oitnbpw7" style="--depth: 2;">
102+
<a
103+
href="#visual-studio-code"
104+
class="astro-oitnbpw7"
105+
style="--depth: 2;"
106+
>
107+
<span class="astro-oitnbpw7" style="--depth: 2;"
108+
>Visual Studio Code</span
109+
>
110+
</a>
111+
</li><li class="astro-oitnbpw7" style="--depth: 2;">
112+
<a href="#warp" class="astro-oitnbpw7" style="--depth: 2;">
113+
<span class="astro-oitnbpw7" style="--depth: 2;">Warp</span>
114+
</a>
115+
</li><li class="astro-oitnbpw7" style="--depth: 2;">
116+
<a
117+
href="#claudeai--claude-desktop"
118+
class="astro-oitnbpw7"
119+
style="--depth: 2;"
120+
>
121+
<span class="astro-oitnbpw7" style="--depth: 2;"
122+
>Claude.ai / Claude Desktop</span
123+
>
124+
</a>
125+
</li><li class="astro-oitnbpw7" style="--depth: 2;">
126+
<a href="#windsurf" class="astro-oitnbpw7" style="--depth: 2;">
127+
<span class="astro-oitnbpw7" style="--depth: 2;">Windsurf</span>
128+
</a>
129+
</li><li class="astro-oitnbpw7" style="--depth: 2;">
130+
<a href="#gemini-cli" class="astro-oitnbpw7" style="--depth: 2;">
131+
<span class="astro-oitnbpw7" style="--depth: 2;"
132+
>Gemini CLI</span
133+
>
134+
</a>
135+
</li><li class="astro-oitnbpw7" style="--depth: 2;">
136+
<a href="#zed" class="astro-oitnbpw7" style="--depth: 2;">
137+
<span class="astro-oitnbpw7" style="--depth: 2;">Zed</span>
138+
</a>
139+
</li><li class="astro-oitnbpw7" style="--depth: 2;">
140+
<a href="#chatgpt" class="astro-oitnbpw7" style="--depth: 2;">
141+
<span class="astro-oitnbpw7" style="--depth: 2;">ChatGPT</span>
142+
</a>
143+
</li><li class="astro-oitnbpw7" style="--depth: 2;">
144+
<a href="#raycast" class="astro-oitnbpw7" style="--depth: 2;">
145+
<span class="astro-oitnbpw7" style="--depth: 2;">Raycast</span>
146+
</a>
147+
</li>
148+
</ul>
149+
</li>
150+
<li class="astro-oitnbpw7" style="--depth: 1;">
151+
<a href="#usage" class="astro-oitnbpw7" style="--depth: 1;">
152+
<span class="astro-oitnbpw7" style="--depth: 1;">Usage</span>
153+
</a>
154+
</li>
155+
<li class="astro-oitnbpw7" style="--depth: 1;">
156+
<a href="#troubleshooting" class="astro-oitnbpw7" style="--depth: 1;">
157+
<span class="astro-oitnbpw7" style="--depth: 1;"
158+
>Troubleshooting</span
159+
>
160+
</a>
161+
</li>
162+
</ul>
163+
</li>
164+
<li class="astro-oitnbpw7" style="--depth: 0;">
165+
<a href="#discord-ai-support" class="astro-oitnbpw7" style="--depth: 0;">
166+
<span class="astro-oitnbpw7" style="--depth: 0;"
167+
>Discord AI Support</span
168+
>
169+
</a>
170+
</li>
171+
<li class="astro-oitnbpw7" style="--depth: 0;">
172+
<a
173+
href="#tips-for-ai-powered-astro-development"
174+
class="astro-oitnbpw7"
175+
style="--depth: 0;"
176+
>
177+
<span class="astro-oitnbpw7" style="--depth: 0;"
178+
>Tips for AI-Powered Astro Development</span
179+
>
180+
</a>
181+
</li>
182+
</ul>
183+
</nav>

0 commit comments

Comments
 (0)