Skip to content

Commit 27310e9

Browse files
liruifengvdelucis
andauthored
i18n(zh-cn): Add more EC text markers and frames (#1328)
* i18n(zh-cn): Add more EC text markers and frames * Update docs/src/content/docs/zh-cn/guides/customization.mdx Co-authored-by: Chris Swithinbank <[email protected]> --------- Co-authored-by: Chris Swithinbank <[email protected]>
1 parent 5ff926f commit 27310e9

File tree

5 files changed

+50
-40
lines changed

5 files changed

+50
-40
lines changed

docs/src/content/docs/zh-cn/guides/components.mdx

+10-2
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ Starlight 支持在 [MDX](https://mdxjs.com/) 文件中使用组件,并提供
1616

1717
```mdx
1818
---
19-
# src/content/docs/index.mdx
19+
# src/content/docs/example.mdx
2020
title: 欢迎来到我的文档
2121
---
2222

@@ -37,7 +37,7 @@ Starlight 为你的 Markdown 内容应用了默认样式,例如在元素之间
3737

3838
如果这些样式与你的组件的外观冲突,请在组件上设置 `not-content` 类来禁用它们。
3939

40-
```astro
40+
```astro 'class="not-content"'
4141
---
4242
// src/components/Example.astro
4343
---
@@ -60,6 +60,8 @@ import { Tabs, TabItem } from '@astrojs/starlight/components';
6060
每个 `<TabItem>` 必须有一个 `label` 来显示给用户。
6161

6262
```mdx
63+
# src/content/docs/example.mdx
64+
6365
import { Tabs, TabItem } from '@astrojs/starlight/components';
6466

6567
<Tabs>
@@ -85,6 +87,8 @@ import { Card, CardGrid } from '@astrojs/starlight/components';
8587
`<Card>` 需要一个 `title`,并且可以选择包含一个 `icon` 属性,该属性设置为 [Starlight 内置图标](#所有图标) 之一的名称。
8688

8789
```mdx
90+
# src/content/docs/example.mdx
91+
8892
import { Card, CardGrid } from '@astrojs/starlight/components';
8993

9094
<Card title="看看这个">你想要突出显示的有趣内容。</Card>
@@ -133,6 +137,8 @@ import { Card, CardGrid } from '@astrojs/starlight/components';
133137
当有足够的空间时,将多个 `<LinkCard>` 组件组合在 `<CardGrid>` 中,以便并排显示卡片。
134138

135139
```mdx
140+
# src/content/docs/example.mdx
141+
136142
import { LinkCard, CardGrid } from '@astrojs/starlight/components';
137143

138144
<LinkCard
@@ -172,6 +178,8 @@ Starlight 提供了一组常用的图标,你可以使用 `<Icon>` 组件在你
172178
每个 `<Icon>` 都需要一个 [`name`](#所有图标),并且可以选择包含 `label``size``color` 属性。
173179

174180
```mdx
181+
# src/content/docs/example.mdx
182+
175183
import { Icon } from '@astrojs/starlight/components';
176184

177185
<Icon name="star" color="goldenrod" size="2rem" />

docs/src/content/docs/zh-cn/guides/css-and-tailwind.mdx

+3-3
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ description: 了解如何使用自定义 CSS 设置你的 Starlight 网站的样
2222

2323
2.`astro.config.mjs` 中的 `customCss` 数组中添加你的 CSS 文件的路径:
2424

25-
```js
25+
```diff lang="js"
2626
// astro.config.mjs
2727
import { defineConfig } from 'astro/config';
2828
import starlight from '@astrojs/starlight';
@@ -32,8 +32,8 @@ description: 了解如何使用自定义 CSS 设置你的 Starlight 网站的样
3232
starlight({
3333
title: 'Docs With Custom CSS',
3434
customCss: [
35-
// 你的自定义 CSS 文件的相对路径
36-
'./src/styles/custom.css',
35+
+ // 你的自定义 CSS 文件的相对路径
36+
+ './src/styles/custom.css',
3737
],
3838
}),
3939
],

docs/src/content/docs/zh-cn/guides/customization.mdx

+24-23
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ Starlight 提供了合理的默认样式和功能,因此你可以快速开始
2727

2828
2.`astro.config.mjs` 中,将 logo 的路径添加到 Starlight 的 [`logo.src`](/zh-cn/reference/configuration/#logo) 选项:
2929

30-
```js
30+
```diff lang="js"
3131
// astro.config.mjs
3232
import { defineConfig } from 'astro/config';
3333
import starlight from '@astrojs/starlight';
@@ -37,7 +37,7 @@ Starlight 提供了合理的默认样式和功能,因此你可以快速开始
3737
starlight({
3838
title: '带有我的标志的页面',
3939
logo: {
40-
src: './src/assets/my-logo.svg',
40+
+ src: './src/assets/my-logo.svg',
4141
},
4242
}),
4343
],
@@ -48,7 +48,7 @@ Starlight 提供了合理的默认样式和功能,因此你可以快速开始
4848
如果你的 logo 图像已经包含了网站标题,你可以通过设置 `replacesTitle` 选项来在视觉上隐藏标题文本。
4949
标题文本仍包含在屏幕阅读器中,以便标题保持可访问性。
5050

51-
```js
51+
```js {5}
5252
starlight({
5353
title: '带有我的 logo 的页面',
5454
logo: {
@@ -77,12 +77,12 @@ starlight({
7777

7878
2.`astro.config.mjs` 中,将 logo 变体的路径添加为 `light``dark` 选项,而不是 `src`
7979

80-
```js
80+
```diff lang="js"
8181
starlight({
8282
title: '带有我的标志的页面',
8383
logo: {
84-
light: './src/assets/light-logo.svg',
85-
dark: './src/assets/dark-logo.svg',
84+
+ light: './src/assets/light-logo.svg',
85+
+ dark: './src/assets/dark-logo.svg',
8686
},
8787
}),
8888
```
@@ -91,7 +91,7 @@ starlight({
9191

9292
Starlight 内置了生成站点地图(sitemap)的支持。通过在 `astro.config.mjs` 中把 `site` 字段设置为你的 URL 来启用站点地图生成:
9393

94-
```js
94+
```js {4}
9595
// astro.config.mjs
9696
export default defineConfig({
9797
site: 'https://stargazers.club',
@@ -106,7 +106,7 @@ export default defineConfig({
106106
你可以通过在页面的正文中设置 [`template: splash`](/zh-cn/reference/frontmatter/#template) 来应用更宽的页面布局,而去除侧边栏。
107107
这对于主页面特别有效,你可以在本站点的[主页](/zh-cn/)上看到它的效果。
108108

109-
```md
109+
```md {5}
110110
---
111111
# src/content/docs/index.md
112112

@@ -124,7 +124,7 @@ Starlight 在每个页面上显示目录,使读者更容易跳转到他们正
124124
<Tabs>
125125
<TabItem label="Frontmatter">
126126

127-
```md
127+
```md {4-6}
128128
---
129129
# src/content/docs/example.md
130130
title: 只在目录中包含 H2 的页面
@@ -137,13 +137,13 @@ tableOfContents:
137137
</TabItem>
138138
<TabItem label="全局配置">
139139

140-
```js
140+
```js {7}
141141
// astro.config.mjs
142142

143143
defineConfig({
144144
integrations: [
145145
starlight({
146-
title: '',
146+
title: '具有自定义目录配置的文档',
147147
tableOfContents: { minHeadingLevel: 2, maxHeadingLevel: 2 },
148148
}),
149149
],
@@ -158,7 +158,7 @@ defineConfig({
158158
<Tabs>
159159
<TabItem label=" frontmatter ">
160160

161-
```md
161+
```md {4}
162162
---
163163
# src/content/docs/example.md
164164
title: 没有目录的页面
@@ -169,7 +169,7 @@ tableOfContents: false
169169
</TabItem>
170170
<TabItem label="全局配置">
171171

172-
```js
172+
```js {7}
173173
// astro.config.mjs
174174

175175
defineConfig({
@@ -192,7 +192,7 @@ Starlight 内置了对通过 Starlight 集成中的 [`social`](/zh-cn/reference/
192192
你可以在 [配置参考](/zh-cn/reference/configuration/#social) 中找到完整的支持链接图标列表。
193193
如果你需要支持其他服务,请在 GitHub 或 Discord 上告诉我们!
194194

195-
```js
195+
```js {9-12}
196196
// astro.config.mjs
197197
import { defineConfig } from 'astro/config';
198198
import starlight from '@astrojs/starlight';
@@ -225,7 +225,7 @@ Starlight 可以在每个页面的页脚中显示“编辑此页”链接。这
225225

226226
下面的示例显示了为 Starlight 文档配置的编辑链接,这些文档位于 GitHub 上名为 `withastro/starlight` 的存储库的 `main` 分支的 `docs/` 子目录中:
227227

228-
```js
228+
```js {9-11}
229229
// astro.config.mjs
230230
import { defineConfig } from 'astro/config';
231231
import starlight from '@astrojs/starlight';
@@ -259,8 +259,9 @@ Starlight 网站默认显示一个简单的 404 页面。你可以通过向 `src
259259

260260
你可以在 404 页面中使用 Starlight 的所有页面布局和自定义技术。例如,默认的404页面在 frontmatter 中使用 [`splash`](#页面布局) 模板和 [`hero`](/zh-cn/reference/frontmatter/#hero) 组件:
261261

262-
```md
262+
```md {4,6-8}
263263
---
264+
# src/content/docs/404.md
264265
title: '404'
265266
template: splash
266267
editUrl: false
@@ -312,7 +313,7 @@ hero:
312313

313314
3.`font-face.css` 文件的路径添加到 Starlight 的 `astro.config.mjs` 配置文件中的 `customCss` 数组中:
314315

315-
```js
316+
```diff lang="js"
316317
// astro.config.mjs
317318
import { defineConfig } from 'astro/config';
318319
import starlight from '@astrojs/starlight';
@@ -322,8 +323,8 @@ hero:
322323
starlight({
323324
title: '使用自定义字体的页面',
324325
customCss: [
325-
// @font-face CSS文件的相对路径。
326-
'./src/fonts/font-face.css',
326+
+ // @font-face CSS文件的相对路径。
327+
+ './src/fonts/font-face.css',
327328
],
328329
}),
329330
],
@@ -368,7 +369,7 @@ hero:
368369

369370
3. 将 Fontsource 的 CSS 文件添加到 Starlight 的 `astro.config.mjs` 配置文件中的 `customCss` 数组中:
370371

371-
```js
372+
```diff lang="js"
372373
// astro.config.mjs
373374
import { defineConfig } from 'astro/config';
374375
import starlight from '@astrojs/starlight';
@@ -378,9 +379,9 @@ hero:
378379
starlight({
379380
title: '使用自定义字体的文档',
380381
customCss: [
381-
// 用于普通和半粗字重的Fontsource文件
382-
'@fontsource/ibm-plex-serif/400.css',
383-
'@fontsource/ibm-plex-serif/600.css',
382+
+ // 用于普通和半粗字重的 Fontsource 文件
383+
+ '@fontsource/ibm-plex-serif/400.css',
384+
+ '@fontsource/ibm-plex-serif/600.css',
384385
],
385386
}),
386387
],

docs/src/content/docs/zh-cn/guides/sidebar.mdx

+12-11
Original file line numberDiff line numberDiff line change
@@ -59,7 +59,7 @@ import SidebarPreview from '../../../../components/sidebar-preview.astro';
5959

6060
使用具有 `label``link` 属性的对象添加一个指向内部或外部页面的链接。
6161

62-
```js
62+
```js "label:" "link:"
6363
starlight({
6464
sidebar: [
6565
// 指向 CSS & Styling 指南的链接
@@ -88,7 +88,7 @@ starlight({
8888
`label` 将用作分组的标题。
8989
将链接或子组添加到 `items` 数组中。
9090

91-
```js
91+
```js /^\s*(label:|items:)/
9292
starlight({
9393
sidebar: [
9494
// 一个名为 "Guides" 的链接分组
@@ -140,7 +140,7 @@ Starlight 可以根据文档目录在侧边栏中自动生成一个分组。当
140140

141141
使用具有 `label``autogenerate` 属性的对象添加自动生成的分组。`autogenerate` 的配置必须指定用于侧边栏条目的 `directory` 。例如,使用以下配置:
142142

143-
```js
143+
```js "label:" "autogenerate:"
144144
starlight({
145145
sidebar: [
146146
{
@@ -193,8 +193,9 @@ starlight({
193193

194194
侧边栏 frontmatter 选项允许你设置 [自定义标签](/zh-cn/reference/frontmatter/#label) 或者为链接添加 [徽章](/zh-cn/reference/frontmatter/#badge)[隐藏](/zh-cn/reference/frontmatter/#hidden) 侧边栏中的链接,或者定义 [自定义排序权重](/zh-cn/reference/frontmatter/#order)
195195

196-
```md
196+
```md "sidebar:"
197197
---
198+
# src/content/docs/example.md
198199
title: 我的页面
199200
sidebar:
200201
# 为链接设置自定义标签
@@ -235,7 +236,7 @@ sidebar:
235236

236237
链接、分组、自动生成的分组都可以包含一个 `badge` 属性,以在它们的标签旁边显示徽章。
237238

238-
```js
239+
```js {10,17}
239240
starlight({
240241
sidebar: [
241242
{
@@ -301,7 +302,7 @@ starlight({
301302
`text` 属性表示要显示的内容(例如 "New")。
302303
通过将 `variant` 属性设置为以下值之一:`note``tip``danger``caution``success`,可以覆盖 `default` 样式,默认样式使用你的网站的强调色。
303304

304-
```js
305+
```js {10}
305306
starlight({
306307
sidebar: [
307308
{
@@ -342,7 +343,7 @@ starlight({
342343

343344
在下面的例子中,通过 `attrs` 添加了一个 `target="_blank"` 属性,使得链接在新标签页中打开,并应用了一个自定义的 `style` 属性使链接标签变为斜体:
344345

345-
```js
346+
```js {10}
346347
starlight({
347348
sidebar: [
348349
{
@@ -386,7 +387,7 @@ starlight({
386387

387388
`label` 属性将用于默认语言和没有翻译的语言。
388389

389-
```js
390+
```js {5-7,11-13,18-20}
390391
starlight({
391392
sidebar: [
392393
{
@@ -433,7 +434,7 @@ starlight({
433434

434435
链接分组可以通过将 `collapsed` 属性设置为 `true` 来默认折叠。
435436

436-
```js
437+
```js {5-6}
437438
starlight({
438439
sidebar: [
439440
{
@@ -466,7 +467,7 @@ starlight({
466467

467468
[自动生成的分组](#自动生成的分组) 遵循其父级分组的 `collapsed` 值:
468469

469-
```js
470+
```js {5-6}
470471
starlight({
471472
sidebar: [
472473
{
@@ -503,7 +504,7 @@ starlight({
503504

504505
这个行为可以通过定义 `autogenerate.collapsed` 属性来覆盖。
505506

506-
```js
507+
```js {5-7} "collapsed: true"
507508
starlight({
508509
sidebar: [
509510
{

docs/src/content/docs/zh-cn/manual-setup.mdx

+1-1
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ Starlight 集成在 `astro.config.mjs` 文件中配置。
4444

4545
添加一个 `title` 以开始:
4646

47-
```js {7-9}
47+
```js ins={8}
4848
// astro.config.mjs
4949
import { defineConfig } from 'astro/config';
5050
import starlight from '@astrojs/starlight';

0 commit comments

Comments
 (0)