mirror of
https://github.com/mintlify/docs.git
synced 2026-09-14 13:35:46 +08:00
dbfcd5a748
Co-authored-by: mintlify[bot] <109931778+mintlify[bot]@users.noreply.github.com>
70 lines
1.7 KiB
Plaintext
70 lines
1.7 KiB
Plaintext
---
|
||
title: "GitHub"
|
||
description: "使用 GitHub 组件在文档中嵌入仓库卡片,实时显示仓库的描述、star 数量和 fork 数量。"
|
||
keywords: ["github", "repo", "仓库", "star", "fork"]
|
||
boost: 3
|
||
tag: "New"
|
||
---
|
||
|
||
使用 `<GitHub.Repo>` 组件嵌入一张链接到公开 GitHub 仓库的卡片。页面加载时,卡片会从 GitHub 公共 API 获取仓库的描述、star 数量和 fork 数量。
|
||
|
||
<div id="basic-repository-card">
|
||
## 基础仓库卡片
|
||
</div>
|
||
|
||
以 `owner/name` slug 或完整的 GitHub URL 形式传入仓库。
|
||
|
||
<GitHub.Repo repo="mintlify/docs" />
|
||
|
||
```mdx react
|
||
<GitHub.Repo repo="mintlify/docs" />
|
||
```
|
||
|
||
<div id="variants">
|
||
## 变体
|
||
</div>
|
||
|
||
在 `inset` 和 `flat` 两种布局之间选择,以匹配周围页面的样式。
|
||
|
||
<div id="inset">
|
||
### Inset
|
||
</div>
|
||
|
||
默认变体。将仓库信息包裹在圆角的内嵌面板中。
|
||
|
||
<GitHub.Repo repo="mintlify/docs" variant="inset" />
|
||
|
||
```mdx
|
||
<GitHub.Repo repo="mintlify/docs" variant="inset" />
|
||
```
|
||
|
||
<div id="flat">
|
||
### Flat
|
||
</div>
|
||
|
||
单层布局,间距更紧凑。当你需要在其他带边框元素旁嵌入卡片时,使用 `flat`。
|
||
|
||
<GitHub.Repo repo="mintlify/docs" variant="flat" />
|
||
|
||
```mdx
|
||
<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>
|