@manohub/theme 0.9.0 → 0.10.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/default/colors.css +17 -10
- package/dist/default/typography.css +1 -1
- package/dist/farris/colors.css +13 -4
- package/package.json +1 -1
package/dist/default/colors.css
CHANGED
|
@@ -5,19 +5,26 @@
|
|
|
5
5
|
* **四个品牌页**（`00.1 管理员配置` / `01.1 技能权限分配` / `01.2 技能权限分配-初始状态` /
|
|
6
6
|
* `02.1 技能准入列表`）为唯一事实源。
|
|
7
7
|
*
|
|
8
|
-
* **三个向导页（`02.2.1/2/3`）判定为旧稿**：它们用 Farris 规范色（`#2a87ff` 主色、
|
|
9
|
-
* `#5fc875` 成功、`#cdd2de` 连接线、`#a8adb8` 弱字、`#f0f3f7` 面），一律**不予采纳** ——
|
|
10
|
-
* 否则 default 主题会与 farris 主题同值，两套主题失去区分意义。
|
|
11
|
-
*
|
|
12
8
|
* 锚定 `[data-manohub-ui]` 而非 `:root`：micro-app 的 scopecss 不作用域化 `:root`，
|
|
13
9
|
* 定义在 `:root` 的变量会泄漏到宿主全局（多子应用互染、卸载残留）。
|
|
14
|
-
* 局部换主题 = 在更深的容器上重设变量，如 `.
|
|
10
|
+
* 局部换主题 = 在更深的容器上重设变量，如 `.demo-panle { --ui-primary: #7C3AED; }`。
|
|
15
11
|
*
|
|
16
12
|
* ## 三条口径（改值前先读，别绕过）
|
|
17
13
|
*
|
|
18
|
-
* 1.
|
|
19
|
-
* `base-
|
|
20
|
-
*
|
|
14
|
+
* 1. **中性阶是五个「槽位」，不是一条刻度**：`base-50`（比内容底更轻一档的底）/
|
|
15
|
+
* `base-100`（内容底）/ `base-200`（中性面：表头底 / hover 底 / 禁用底 / 斑马行）/
|
|
16
|
+
* `base-300`（线框）/ `base-400`（仅勾选类小控件框体）。
|
|
17
|
+
* **数字只是槽位标号**（借 daisyUI 的命名壳），**不承诺等差 / 等比** —— 取值是设计稿的
|
|
18
|
+
* **实测采样 + 近似合并**，不是从数列推出来的：别按数字补 `base-500`，也别把数字当
|
|
19
|
+
* 「浅一档 / 深一档」的通用梯度使（要更轻的底就 `base-50`、要「面」就 `base-200`，语义各归各）。
|
|
20
|
+
* 实测事实：设计稿内容区**从未出现 `#F5F7FA`**；中性面只有 `#F2F2F2`（中性 hover / 禁用底）
|
|
21
|
+
* 与 `#F1F2F5`（表头底），二者差 3/255，故合并为 `base-200` —— **合并取的是后者**，
|
|
22
|
+
* 所以本套的 `base-200` 带一点冷调，而 `base-300` / `base-400` 是纯灰：这是实测取舍，不是刻度走样。
|
|
23
|
+
* 量级参考（按 L* 估算的相邻差）：`100→200` −4.5 / `200→300` −4.2 / `300→400` −3.5，
|
|
24
|
+
* 大致是每档 4 上下的**感知步长**；而 `base-50` 只比 `base-100` 低 **1.7**，
|
|
25
|
+
* 它**不是刻度上的一格**，是「比内容底更轻一档的底」这一语义槽位 —— 但它的可见度本来就不够，
|
|
26
|
+
* 故**库内已无消费**（`Tag` 悬停底与 `Badge --soft` 默认底 2026-09-30 起改取 `base-200`），
|
|
27
|
+
* 留着是给应用侧的浅底；**别拿它当「浅灰面」的通用档**。
|
|
21
28
|
* 2. **`base-300` 是全库唯一的「线 / 框」色**：输入框、按钮、表格、分页项、卡片、面板、分隔线
|
|
22
29
|
* 一律取它。`base-400` 只留给 **14×14 这类小尺寸勾选框体**（设计稿让复选框比容器线深一档，
|
|
23
30
|
* 否则小方块在浅底上看不见）。
|
|
@@ -41,8 +48,8 @@
|
|
|
41
48
|
补这一枚是为了让主色族与四个语义族槽位等形（base / content / weak / border）。 */
|
|
42
49
|
--ui-primary-border: #B7CAFF;
|
|
43
50
|
|
|
44
|
-
/* =====
|
|
45
|
-
--ui-base-50: #FAFAFA;
|
|
51
|
+
/* ===== 中性阶（五个槽位 + 三级字；禁止再自由取值 —— 数字是槽位标号，不是色阶） ===== */
|
|
52
|
+
--ui-base-50: #FAFAFA; /* 比内容底更轻一档的底；不是刻度上的一格 */
|
|
46
53
|
--ui-base-100: #FFFFFF;
|
|
47
54
|
--ui-base-200: #F1F2F5; /* 中性面：表头底 / hover 底 / 禁用底 / 斑马行 */
|
|
48
55
|
--ui-base-300: #E6E6E6; /* 全库唯一的「线 / 框」色 */
|
package/dist/farris/colors.css
CHANGED
|
@@ -7,6 +7,12 @@
|
|
|
7
7
|
* 锚 `[data-manohub-ui][data-theme='farris']`：加上属性即整包换皮（见 `default/index.css` 的换主题约定）。
|
|
8
8
|
* **本主题必须全量覆盖 default 的令牌**（否则会与 default 混成半套主题；护栏在
|
|
9
9
|
* `__tests__/contract-tokens.spec.ts` 的「主题覆盖度」用例）。
|
|
10
|
+
*
|
|
11
|
+
* **中性阶的语义槽位与 default 逐条对齐**（见 `../default/colors.css` 的「三条口径」）：`base-300`
|
|
12
|
+
* 是全库唯一的「线 / 框」色 —— 输入框、按钮、表格、分页项、卡片、面板、分隔线一律取它；`base-400`
|
|
13
|
+
* 只服务小尺寸勾选类框体。本套的值取自规范色板（`Ne08` / `Ne04`），**行尾括注是「值出处」**：
|
|
14
|
+
* 规范原文把 `Ne04` 记作「输入框默认边框」，本仓按上面的统一口径把它归给 `base-300` ——
|
|
15
|
+
* 故 `base-400` 的括注不再写「输入框」，否则读者会以为输入框该取它（`Input` 取的是 `base-300`）。
|
|
10
16
|
*/
|
|
11
17
|
[data-manohub-ui][data-theme='farris'] {
|
|
12
18
|
/* ===== 品牌主色（科技蓝 Th 族） ===== */
|
|
@@ -20,12 +26,15 @@
|
|
|
20
26
|
/* 浅主色描边：规范 Au01「表格选中行下划线」（规范里唯一一枚浅主色描边档） */
|
|
21
27
|
--ui-primary-border: #c9e0ff;
|
|
22
28
|
|
|
23
|
-
/* ===== 中性阶 =====
|
|
24
|
-
|
|
29
|
+
/* ===== 中性阶 =====
|
|
30
|
+
* 数字是**槽位标号**（口径见 `../default/colors.css` 的「三条口径」第 1 条），不承诺色阶等差 ——
|
|
31
|
+
* 本套的五枚值同样取自规范色板，除 `base-100` 为纯白外**都带同向冷调**（B−R 随深度递增：
|
|
32
|
+
* 2 / 4 / 10 / 14），这是规范色板的事实，不是刻度走样。 */
|
|
33
|
+
--ui-base-50: #fafafc; /* Ne14 表格/树表禁用行（**库内已无消费**，保留给应用侧；见 default 口径第 1 条） */
|
|
25
34
|
--ui-base-100: #ffffff; /* Ne12 卡片与输入框背景 */
|
|
26
35
|
--ui-base-200: #f5f6f9; /* Ne10 选择器选中行 / 输入框禁用背景 */
|
|
27
|
-
--ui-base-300: #e8ebf2; /* Ne08
|
|
28
|
-
--ui-base-400: #d9dee7; /* Ne04
|
|
36
|
+
--ui-base-300: #e8ebf2; /* Ne08 弱边框（全库唯一的「线 / 框」色，含输入框描边） */
|
|
37
|
+
--ui-base-400: #d9dee7; /* Ne04 仅勾选类小控件框体（checkbox / radio / switch 未选） */
|
|
29
38
|
--ui-base-content: #2d2f33; /* Te01/Te02 标题与通用正文 */
|
|
30
39
|
--ui-base-content-muted: #5a5e66; /* Te04 标签文字 / 表头 */
|
|
31
40
|
--ui-base-content-subtle: #747b8b; /* Te06 辅助说明 */
|