编号要点 <NumberedColumns />
3–4 列等权要点,每列一个等宽标签、标题和说明,列底是巨大的衬线编号,悬停时编号点亮。
Template and style descriptions are currently available in Chinese only.
- Group
- 要点 · 并列特性
- Component
NumberedColumns·#numbered-columns- Interaction
- 悬停整列:编号变为强调色并上浮,标签换成强调底色。
Good for
- 3–4 个同等重要的特性、原则或发现
- 每个要点都能用一个关键词标签概括
Avoid when
- 要点有先后顺序:用 StepTrack
- 要点有轻重之分:用 SpotlightList 或 Bento
- 超过 4 个:拆页
Content limits
| 1 | items 正好 3 或 4 个 |
| 2 | title ≤ 10 字(一行) |
| 3 | body 24–40 字:太短列会显得空,太长会压到底部的大编号 |
| 4 | 长的英文标识符(组件名、包名)放进 tag,不要堆在 body 里,它们不能在中间断行 |
| 5 | tag ≤ 20 个字符 |
| 6 | 各列 body 长度尽量接近 |
Fields
| Field | Type | |
|---|---|---|
kicker · required | string | 标题上方的小节名,2–8 字 |
title · required | string | string[] | 页面标题;传数组可手动断行,每项一行 |
lead | string | 一到两句导语,≤ 60 字 |
source | string | 事实出处;页面上有任何数据或事实时必填 |
hint | ReactNode | 页眉中间的操作提示,可用 <kbd> |
items · required | { tag, title, body }[] | 要点 |
Example
<NumberedColumns
kicker="安全与可验证"
title="更安全,也更容易验证"
items={[
{ tag: 'PAC · BTI', title: 'arm64 硬件加固', body: '在硬件支持时自动启用 PAC 与 BTI。' },
{ tag: 'lumen-repro-status', title: '可复现构建', body: '新增 lumen-repro-status 软件包。' },
{ tag: 'UEFI · U-Boot', title: 'HTTP Boot', body: '安装器可以通过 HTTP 启动。' },
]}
source="aurora 发行说明 §2"
/>