组件

下面每个组件都由主题全局注册，无需 import，也无需注册。

布局组件

组件	全局	用途
`GithubNavbar`	否	吸顶头部：品牌、导航链接、仓库按钮、配色切换
`GithubSidebar`	是	多级侧边栏，或移动端抽屉
`GithubToc`	是	右侧页内目录，嵌套并跟随滚动位置
`GithubPageNav`	否	上一页/下一页，按侧边栏顺序
`GithubPageMeta`	否	编辑链接、更新时间、贡献者头像
`GithubFooter`	否	站点页脚，由 `footer` 选项驱动

这些组件由布局组合而成，很少需要手工使用。侧边栏与页内目录仍然注册为全局，因为自己写布局的站点通常需要它们。

内容组件

组件	用途
`WCard`	内容卡片，可选图片、图标与链接
`WCardList`	排布卡片的网格容器
`WSteps` / `WStep`	带编号的走查
`Badge`	行内状态徽章
`FriendLinks`	友链网格
`WNote`	info / tip / warning / danger 提示块
`WDetails`	可折叠区块
`WRepoCard`	GitHub 风格仓库卡片
`WMark`	行内高亮文字

用 import 代替全局使用

主题注册了上面的内容组件。而布局所依赖的块 —— 外壳、博客视图、首页视图 —— 不是全局的，这样站点可以自己组合布局而不与它们冲突：

<script setup>
import { GithubSidebar, GithubToc, GithubPostList } from 'vuepress-theme-github/client'
</script>

GithubPostList 还接受 posts prop，所以自定义列表可以只渲染一部分：

<script setup>
import { GithubPostList, usePosts } from 'vuepress-theme-github/client'

const posts = usePosts()
</script>

<template>
  <GithubPostList :posts="posts.slice(0, 5)" />
</template>

导出分组	是否全局注册
内容组件（`WCard`、`WNote` …）	是
`GithubSidebar`、`GithubToc`	是 —— 自定义布局会组合它们
页面块（`GithubNavbar`、`GithubPage` …）	否 —— 需要 import
博客视图（`GithubPostListLayout` …）	否 —— 由 `blogView` frontmatter 选择
首页块（`GithubHome` …）	否 —— 由 `home: true` 选择

Markdown 排版

markdown 能产生的一切都按 GitHub 的风格排版：标题带下划线、条纹表格、围栏代码块、任务列表与 <kbd>。

行内 code 使用中性的弱化背景，围栏代码块使用更淡的画布背景 —— 代码块样式重置了行内内边距，两者不会打架。

Ctrl + C 由 <kbd> 渲染而来。