> ## Documentation Index
> Fetch the complete documentation index at: https://www.mintlify.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# GitHub

> 使用 GitHub 组件在文档中嵌入仓库卡片，实时显示仓库的描述、star 数量和 fork 数量。

使用 `<GitHub.Repo>` 组件嵌入一张链接到公开 GitHub 仓库的卡片。页面加载时，卡片会从 GitHub 公共 API 获取仓库的描述、star 数量和 fork 数量。

<div id="basic-repository-card">
  ## 基础仓库卡片
</div>

以 `owner/name` slug 或完整的 GitHub URL 形式传入仓库。

<GitHub.Repo repo="mintlify/docs" />

```mdx theme={null}
<GitHub.Repo repo="mintlify/docs" />
```

<div id="variants">
  ## 变体
</div>

在 `inset` 和 `flat` 两种布局之间选择，以匹配周围页面的样式。

<div id="inset">
  ### Inset
</div>

默认变体。将仓库信息包裹在圆角的内嵌面板中。

<GitHub.Repo repo="mintlify/docs" variant="inset" />

```mdx theme={null}
<GitHub.Repo repo="mintlify/docs" variant="inset" />
```

<div id="flat">
  ### Flat
</div>

单层布局，间距更紧凑。当你需要在其他带边框元素旁嵌入卡片时，使用 `flat`。

<GitHub.Repo repo="mintlify/docs" variant="flat" />

```mdx theme={null}
<GitHub.Repo repo="mintlify/docs" variant="flat" />
```

<div id="properties">
  ## 属性
</div>

<ResponseField name="repo" type="string">
  要显示的 GitHub 仓库。接受 `owner/name` slug（例如 `mintlify/docs`）或完整的 GitHub URL（例如 `https://github.com/mintlify/docs`）。
</ResponseField>

<ResponseField name="variant" type="string" default="inset">
  卡片布局。

  可选值：`inset`、`flat`。
</ResponseField>

<ResponseField name="className" type="string">
  应用于卡片的额外 CSS 类。
</ResponseField>


## Related topics

- [GitHub](/docs/zh/deploy/github.md)
- [自托管](/docs/zh/deploy/self-host.md)
- [GitHub Enterprise Server](/docs/zh/deploy/ghes.md)