diff options
Diffstat (limited to 'docs/src')
| -rw-r--r-- | docs/src/config.ts | 1 | ||||
| -rw-r--r-- | docs/src/pages/zh-TW/themes.astro | 52 |
2 files changed, 53 insertions, 0 deletions
diff --git a/docs/src/config.ts b/docs/src/config.ts index 50132d16d..3cd88714a 100644 --- a/docs/src/config.ts +++ b/docs/src/config.ts @@ -135,6 +135,7 @@ export const SIDEBAR = { { text: '新手上路', link: 'zh-TW/getting-started' }, { text: '快速開始', link: 'zh-TW/quick-start' }, { text: '安裝', link: 'zh-TW/installation' }, + { text: '佈景主題', link: 'zh-TW/themes' }, ], bg: [ { text: 'Главни', header: true }, diff --git a/docs/src/pages/zh-TW/themes.astro b/docs/src/pages/zh-TW/themes.astro new file mode 100644 index 000000000..b305a0c6d --- /dev/null +++ b/docs/src/pages/zh-TW/themes.astro @@ -0,0 +1,52 @@ +--- +import Layout from '../../layouts/MainLayout.astro'; +import Card from '../../components/Card.astro'; +import {Markdown} from 'astro/components'; +import themes from '../../data/themes.json'; +import components from '../../data/components.json'; +--- +<style> + .card-grid { + display: grid; + grid-column-gap: 15px; + grid-row-gap: 15px; + grid-auto-flow: dense; + grid-template-columns: repeat(auto-fit,minmax(300px,1fr)) + } +</style> +<Layout content={{title: 'Themes'}} hideRightSidebar> + <Markdown> + ## 精選佈景主題 + </Markdown> + <div class="card-grid"> + {themes.featured.map((item)=>(<Card data={item} />))} + </div> + <Markdown> + ## 官方佈景主題 + + Astro 維護的文件網站、作品集⋯等官方佈景主題。 + </Markdown> + <div class="card-grid"> + {themes.official.map((item)=>(<Card data={item} />))} + </div> + <Markdown> + ## 社群佈景主題 + + 趕緊來看看社群開發的佈景主題！ + </Markdown> + <div class="card-grid"> + {themes.community.map((item)=>(<Card data={item} />))} + </div> + <Markdown> + ## 精選套件 + + 我們的套件生態持續成長！所有精選社群套件都可以在 [npm](https://www.npmjs.com/search?q=keywords%3Aastro-component) 發掘。 + </Markdown> + <div class="card-grid"> + {components.community.map((item)=>(<Card data={item} />))} + </div> + <Markdown> + > 想要讓自己的作品成為精選嗎？[在 Discord 分享！](https://astro.build/chat) + 我們常在 `#showcase` 頻道取材，把深受喜愛的在這裡發布。 + </Markdown> +</Layout> |