style(web): 统一生产界面圆角为6px

2026-08-10 16:58:16 +08:00
parent 7f99ac5027
commit 3ce186f977
23 changed files with 83 additions and 81 deletions
@@ -32,6 +32,12 @@ export function Button({
 - 复杂页面用 `Card`、`CardHeader`、`CardContent` 等 composition primitive，而不是复制一套容器样式。
 - 新建 shared primitive 前先搜索是否已有 `Button`、`Badge`、`Card` 或 `cn`。

+### 统一圆角
+
+- 生产前端所有有圆角的页面布局和组件统一使用 6px；`src/styles/globals.css` 中的 `--radius`、`--radius-sm`、`--radius-md`、`--radius-lg` 和 `--radius-xl` 必须最终解析为 6px。
+- 组件 class 优先使用 `rounded-md` 及其方向变体；只有结构性边缘可以使用 `rounded-none`。不要新增 `rounded-full`、不同 named radius 或 arbitrary radius，以免组件之间重新出现圆角漂移。
+- 该约定同样适用于 Badge、Avatar、Progress 和滚动条等 shared primitive，不因原有胶囊或圆形语义保留例外。
+
 ## 页面状态

 页面应把加载、错误、成功状态转成用户可见的语义文本。`SystemStatusPage` 根据 query 状态显示“正在连接”“连接异常”“运行正常”，没有数据时使用安全的默认服务名。