Files
aurora-admin/site/tokens/tokens.css
T
aurora-admin f1fbfc2ddb
Regression / regression (push) Canceled after 0s
feat(品牌标识): 几何 K 图标(favicon/顶栏标记/theme-color) + 并行会话成果入库
## 品牌标识(本次会话)

起因:品牌此前没有任何图形标识 —— 唯一 favicon 是内联 data-URI 里的字母「A」,
那是 v2.0.0「Aurora Admin → Kole UI」改名漏掉的一处(PC 顶栏也是「A」,
移动端站已是「K」;移动端文档站则完全没有 favicon)。

- 几何:24 网格三个互不接触的笔画(竖 + 两斜),圆头描边;
  描边 2.25 → 16px 标签页尺寸下正好 1.5px = 规范原文「描边1.5px」
- 取色分两套(刻意):favicon 硬编码品牌蓝/白(渲染在浏览器标签栏,不继承 kole-dark);
  顶栏标记走 currentColor(实测暗色下自动转 rgb(20,22,28))
- 新增 theme-color 双条(light #FFFFFF / dark #1C1F26,取 --kole-color-card-bg)
- 修 site/app.js hero 标语 KOLE ADMIN → KOLE UI(改名变形残留)
- 移动端 7 个模板补 favicon(此前计数 0)

验收:门禁 9 条全 OK(site-routing/site-routes/mobile-docs/mobile-site/isolation/
theme/nav/i18n/icons);PC 回归 1464/1464 · 移动端 807/807,各连跑 8 次一致;
两端 favicon 405 字节逐字节一致;PC 站控制台错误 1→0。

## 并行会话成果(本次一并入库)

- 图标系统:2576 图标(TDesign/Element Plus,MIT)+ 11 端注入 + 5 个构建门禁工具
  + IconPreview 预览页 + ICON-SPEC.md 冻结规格
- 移动端平台:47 组件 × 6 端 + 文档站 53 页 + 隔离门禁
- PC 组件:103 个大后台组件 / 组件11 批次
- uni-app:PC 端试点 + 移动端端实现 + 真实编译验证

## 工程

- .gitignore 补 .scratch/ 与 .zcode-preexisting-*.txt(会话中间产物,实测 9.1MB,不入库)
- CHANGELOG 补品牌标识条目
- ROADMAP 登 S8-P4(品牌标识任务包 + og:image/apple-touch-icon 未做部分)
2026-09-21 10:05:48 +08:00

110 lines
5.7 KiB
CSS
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
/* Kole UI design tokens - generated by build-site.ps1 */
:root {
--kole-color-brand: #2F54EB; /* 品牌主色:主按钮、选中态、链接 */
--kole-color-brand-hover: #1D39C4; /* 品牌主色悬停 */
--kole-color-brand-active: #10239E; /* 品牌主色点击 */
--kole-color-brand-bg: #F0F5FF; /* 品牌浅色背景:选中背景、标签背景、表格悬停 */
--kole-color-secondary: #13C2C2; /* 辅助色 */
--kole-color-page-bg: #F5F7FA; /* 页面背景 */
--kole-color-card-bg: #FFFFFF; /* 卡片背景 */
--kole-color-table-header-bg: #FAFAFA; /* 表头背景 */
--kole-color-disabled-bg: #F5F5F5; /* 禁用背景(按钮禁用态) */
--kole-color-tag-green-bg: #F6FFED; /* 标签绿底 */
--kole-color-tooltip-bg: #1F2329; /* Tooltip 深色背景 */
--kole-color-text-title: #1F2329; /* 标题文字 · 15.4:1 */
--kole-color-text-body: #262626; /* 正文文字 · 14.0:1 */
--kole-color-text-secondary: #6E6E6E; /* 次要文字 · 5.10:1(原 #8C8C8C 仅 3.36:1) */
--kole-color-text-tertiary: #595959; /* 三级文字/描述 · 7.00:1(规范未定义,实现补齐) */
--kole-color-text-placeholder: #767676; /* 占位文字 · 4.54:1(原 #BFBFBF 仅 1.84:1) */
--kole-color-text-inverse: #FFFFFF; /* 反色文字(品牌色背景上的白字) */
--kole-color-text-disabled: #BFBFBF; /* 禁用态文字 · WCAG 1.4.3 对禁用控件豁免(规范定义于组件1/2.txt) */
--kole-color-border: #E8ECF1; /* 分割线/边框 */
--kole-color-border-strong: #F0F0F0; /* 更强的实线边框(规范未定义,实现补齐) */
--kole-color-icon-inactive: #8F8F8F;
--kole-color-success: #2E7D0A; /* 成功色 · 5.18:1(原 #52C41A 仅 2.27:1) */
--kole-color-warning: #8C5A00; /* 警告色 · 5.87:1(原 #FAAD14 仅 1.90:1) */
--kole-color-error: #CF1322; /* 错误色 · 5.57:1(原 #F5222D 仅 4.08:1) */
--kole-color-info: #096DD9; /* 信息色 · 5.00:1(原 #1890FF 仅 3.24:1) */
--kole-color-mask: rgba(0, 0, 0, 0.45); /* 弹窗遮罩 */
--kole-color-mask-strong: rgba(0, 0, 0, 0.85); /* 图片遮罩 */
--kole-color-focus-ring: rgba(47, 84, 235, 0.2); /* 输入框聚焦外发光 */
--kole-font-family: "PingFang SC", "Source Han Sans SC", "Source Han Sans", "Microsoft YaHei", "Inter", "DIN", -apple-system, "Segoe UI", sans-serif;
--kole-font-family-cn: "PingFang SC", "Source Han Sans SC", "Source Han Sans", "Microsoft YaHei", sans-serif;
--kole-font-family-num: "Inter", "DIN", "Segoe UI", sans-serif;
--kole-type-display-size: 24px;
--kole-type-display-height: 32px;
--kole-type-display-weight: 600; /* Semibold:页面大标题 */
--kole-type-h1-size: 20px;
--kole-type-h1-height: 28px;
--kole-type-h1-weight: 600; /* Semibold:卡片标题、弹窗标题 */
--kole-type-h2-size: 16px;
--kole-type-h2-height: 24px;
--kole-type-h2-weight: 500; /* Medium:区块标题 */
--kole-type-body-size: 14px;
--kole-type-body-height: 22px;
--kole-type-body-weight: 400; /* Regular:正文、表格、表单 */
--kole-type-caption-size: 12px;
--kole-type-caption-height: 20px;
--kole-type-caption-weight: 400; /* Regular:辅助说明、时间戳 */
--kole-space-4: 4px;
--kole-space-8: 8px;
--kole-space-12: 12px;
--kole-space-16: 16px;
--kole-space-20: 20px;
--kole-space-24: 24px;
--kole-space-32: 32px;
--kole-space-40: 40px;
--kole-space-48: 48px;
--kole-space-64: 64px;
--kole-radius-small: 2px; /* 标签、徽章、复选框 */
--kole-radius-base: 4px; /* 按钮、输入框、选择器 */
--kole-radius-medium: 6px; /* 表格、卡片内部元素、Popover、日期面板 */
--kole-radius-large: 8px; /* 卡片、弹窗、抽屉 */
--kole-shadow-low: 0 1px 4px rgba(0, 0, 0, 0.06); /* 卡片默认 */
--kole-shadow-medium: 0 4px 12px rgba(0, 0, 0, 0.08); /* 卡片悬停、下拉菜单、Popover */
--kole-shadow-high: 0 8px 24px rgba(0, 0, 0, 0.12); /* 弹窗、抽屉 */
--kole-duration-fast: 0.2s;
--kole-duration-base: 0.3s;
--kole-duration-slow: 0.4s;
--kole-ease-standard: ease;
--kole-ease-out: ease-out;
--kole-ease-in-out: ease-in-out;
--kole-icon-size-16: 16px;
--kole-icon-size-20: 20px;
--kole-icon-size-24: 24px;
--kole-control-height-small: 24px;
--kole-control-height-default: 32px;
--kole-control-height-large: 40px;
--kole-color-page-bg: #14161C;
--kole-color-card-bg: #1C1F26;
--kole-color-table-header-bg: #22262E;
--kole-color-disabled-bg: #262A33;
--kole-color-tag-green-bg: #16261A;
--kole-color-tooltip-bg: #E8EAED; /* 文字四层 */
--kole-color-text-title: #E8EAED;
--kole-color-text-body: #C9CDD4;
--kole-color-text-secondary: #9CA3AF;
--kole-color-text-tertiary: #B6BCC7;
--kole-color-text-placeholder: #9CA3AF;
--kole-color-text-inverse: #14161C;
--kole-color-text-disabled: #6B7280; /* 边框 */
--kole-color-border: #2A2F38;
--kole-color-border-strong: #363B45;
--kole-color-icon-inactive: #9CA3AF; /* 品牌色向白提亮(深底对比度不足,原 #2F54EB 卡片底仅 ~3.9:1) */
--kole-color-brand: #6B8CFF;
--kole-color-brand-hover: #84A0FF;
--kole-color-brand-active: #5570D8;
--kole-color-brand-bg: rgba(107, 140, 255, 0.18);
--kole-color-secondary: #3FD4D4; /* 语义色提亮 */
--kole-color-success: #4CAF50;
--kole-color-warning: #E5A300;
--kole-color-error: #F26D6D;
--kole-color-info: #4C9AFF; /* 遮罩与阴影 */
--kole-color-mask: rgba(0, 0, 0, 0.6);
--kole-color-mask-strong: rgba(0, 0, 0, 0.75);
--kole-color-focus-ring: rgba(107, 140, 255, 0.5);
--kole-shadow-low: 0 1px 4px rgba(0, 0, 0, 0.5);
--kole-shadow-medium: 0 4px 12px rgba(0, 0, 0, 0.55);
--kole-shadow-high: 0 8px 24px rgba(0, 0, 0, 0.65);
}