@qilin-agent/client-ui-theme-brand 3.1.7 → 3.1.8
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/README.i18n.yaml +2 -2
- package/README.md +1 -0
- package/README.zh.md +1 -0
- package/lib/client.js +130 -0
- package/lib/index.js +130 -0
- package/lib/types/packs/blush.d.ts +18 -0
- package/package.json +5 -5
package/README.i18n.yaml
CHANGED
|
@@ -18,8 +18,8 @@
|
|
|
18
18
|
en: 1f7a36b5e15a4999
|
|
19
19
|
zh: cd513bacec0f488f
|
|
20
20
|
/qilin-agent-client-ui-theme-brand/use-this-package/shipped-packs:
|
|
21
|
-
en:
|
|
22
|
-
zh:
|
|
21
|
+
en: 177307a20be095c4
|
|
22
|
+
zh: d48d855384c451ae
|
|
23
23
|
/qilin-agent-client-ui-theme-brand/dev-note:
|
|
24
24
|
en: f3c698886ef928a7
|
|
25
25
|
zh: eaac63c14c20b932
|
package/README.md
CHANGED
|
@@ -30,6 +30,7 @@ The `qilin` profile mounts this package through its bundle patch, so no configur
|
|
|
30
30
|
| Id | Label | Light canvas | Dark canvas | Accent (light / dark) |
|
|
31
31
|
|---|---|---|---|---|
|
|
32
32
|
| `qilin` | 玄金 / Xuanjin | `#f8f5ee` | `#0d0b09` | `#8f6f2e` / `#c9a24a` |
|
|
33
|
+
| `blush` | 浅樱 / Blush | `#fbf6f4` | `#141010` | `#b25b74` / `#f2bccb` |
|
|
33
34
|
| `mono` | 黑白 / Mono | `#f4f4f4` | `#000000` | `#1a1a1a` / `#f2f2f2` |
|
|
34
35
|
| `verdant` | 墨绿 / Verdant | `#f1f6f2` | `#0a120e` | `#2f6b4b` / `#8fd0a8` |
|
|
35
36
|
|
package/README.zh.md
CHANGED
|
@@ -32,6 +32,7 @@ kind: "package-reference"
|
|
|
32
32
|
| `qilin` | 玄金 / Xuanjin | `#f8f5ee` | `#0d0b09` | `#8f6f2e` / `#c9a24a` |
|
|
33
33
|
| `mono` | 黑白 / Mono | `#f4f4f4` | `#000000` | `#1a1a1a` / `#f2f2f2` |
|
|
34
34
|
| `verdant` | 墨绿 / Verdant | `#f1f6f2` | `#0a120e` | `#2f6b4b` / `#8fd0a8` |
|
|
35
|
+
| `blush` | 浅樱 / Blush | `#fbf6f4` | `#141010` | `#b25b74` / `#f2bccb` |
|
|
35
36
|
|
|
36
37
|
每个包在两套 scheme 下覆盖同一组语义家族——强调色、链接、画布与层级表面、侧栏、组件填充、墨阶文字、细线与悬停、次级按钮族、代码与滚动条阅读面——因此切换包不会让任何组件停在上一套调色上。包里未声明的令牌留在基础配色。
|
|
37
38
|
|
package/lib/client.js
CHANGED
|
@@ -4,6 +4,135 @@ window.__ModuleLoader__.load({
|
|
|
4
4
|
var module = { exports: {} };
|
|
5
5
|
var exports = module.exports;
|
|
6
6
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
7
|
+
//#region lib/types/packs/blush.js
|
|
8
|
+
/**
|
|
9
|
+
* The blush color pack: warm pink-paper surfaces with a deep rose accent in the
|
|
10
|
+
* light scheme, and a dim rose canvas with a pale pink accent in the dark one.
|
|
11
|
+
*
|
|
12
|
+
* The identity tint is 浅樱 (#e8a0b4); WCAG AA governs where text sits on it,
|
|
13
|
+
* so fills and links deepen to #b25b74 (white on it clears 4.9:1, and it clears
|
|
14
|
+
* 4.9:1 on the #fbf6f4 paper) while the pale tint stays for selection and
|
|
15
|
+
* decoration only. State colors, masks, and the ongoing blue stay with the base
|
|
16
|
+
* palettes, the same omission rule as every pack. Hover darkens the light accent
|
|
17
|
+
* and brightens the dark one, matching each platform's convention.
|
|
18
|
+
*/
|
|
19
|
+
/** Blush tokens over the platform palettes. Every value states both schemes. */
|
|
20
|
+
const BLUSH_TOKENS = Object.freeze({
|
|
21
|
+
"--qilin-alias-brand-primary": {
|
|
22
|
+
light: "#b25b74",
|
|
23
|
+
dark: "#f2bccb"
|
|
24
|
+
},
|
|
25
|
+
"--qilin-alias-button-primary-hover": {
|
|
26
|
+
light: "#9d4e66",
|
|
27
|
+
dark: "#ffd6e0"
|
|
28
|
+
},
|
|
29
|
+
"--qilin-alias-link": {
|
|
30
|
+
light: "#a04f66",
|
|
31
|
+
dark: "#f6cdd9"
|
|
32
|
+
},
|
|
33
|
+
"--qilin-alias-bg-base": {
|
|
34
|
+
light: "#fbf6f4",
|
|
35
|
+
dark: "#141010"
|
|
36
|
+
},
|
|
37
|
+
"--qilin-alias-bg-layer-1": {
|
|
38
|
+
light: "#fffdfc",
|
|
39
|
+
dark: "#1b1616"
|
|
40
|
+
},
|
|
41
|
+
"--qilin-alias-bg-layer-2": {
|
|
42
|
+
light: "#fdf8f6",
|
|
43
|
+
dark: "#221b1b"
|
|
44
|
+
},
|
|
45
|
+
"--qilin-alias-bg-layer-3": {
|
|
46
|
+
light: "#f8f1ef",
|
|
47
|
+
dark: "#291f1f"
|
|
48
|
+
},
|
|
49
|
+
"--qilin-alias-bg-overlay": {
|
|
50
|
+
light: "#f5e9e7",
|
|
51
|
+
dark: "#3a2a2e"
|
|
52
|
+
},
|
|
53
|
+
"--qilin-alias-bg-skeleton": {
|
|
54
|
+
light: "rgba(120, 60, 76, 0.06)",
|
|
55
|
+
dark: "rgba(242, 188, 203, 0.08)"
|
|
56
|
+
},
|
|
57
|
+
"--qilin-specific-sidebar-fill": {
|
|
58
|
+
light: "#f8f1ef",
|
|
59
|
+
dark: "#141010"
|
|
60
|
+
},
|
|
61
|
+
"--qilin-specific-sidebar-nav-item-hover": {
|
|
62
|
+
light: "#f4e8e6",
|
|
63
|
+
dark: "#241b1d"
|
|
64
|
+
},
|
|
65
|
+
"--qilin-specific-sidebar-nav-item-active": {
|
|
66
|
+
light: "#f0e0df",
|
|
67
|
+
dark: "#2e2024"
|
|
68
|
+
},
|
|
69
|
+
"--qilin-specific-sidebar-nav-item-active-accent": {
|
|
70
|
+
light: "#b25b74",
|
|
71
|
+
dark: "#f2bccb"
|
|
72
|
+
},
|
|
73
|
+
"--qilin-specific-bubble": {
|
|
74
|
+
light: "#fbeef0",
|
|
75
|
+
dark: "#241a1c"
|
|
76
|
+
},
|
|
77
|
+
"--qilin-specific-input-major": {
|
|
78
|
+
light: "#fffdfc",
|
|
79
|
+
dark: "#1c1617"
|
|
80
|
+
},
|
|
81
|
+
"--qilin-specific-selector": {
|
|
82
|
+
light: "#f9efee",
|
|
83
|
+
dark: "#2e2024"
|
|
84
|
+
},
|
|
85
|
+
"--qilin-specific-tip": {
|
|
86
|
+
light: "#f9efee",
|
|
87
|
+
dark: "#2e2024"
|
|
88
|
+
},
|
|
89
|
+
"--qilin-alias-toast-bg": {
|
|
90
|
+
light: "#2b1f23",
|
|
91
|
+
dark: "#2b2124"
|
|
92
|
+
},
|
|
93
|
+
"--qilin-alias-tooltip-bg": {
|
|
94
|
+
light: "#261b1f",
|
|
95
|
+
dark: "#2b2124"
|
|
96
|
+
},
|
|
97
|
+
"--qilin-alias-label-primary": {
|
|
98
|
+
light: "#23191c",
|
|
99
|
+
dark: "#f0e6e8"
|
|
100
|
+
},
|
|
101
|
+
"--qilin-alias-label-secondary": {
|
|
102
|
+
light: "#6d5b61",
|
|
103
|
+
dark: "#b9a6ac"
|
|
104
|
+
},
|
|
105
|
+
"--qilin-alias-label-tertiary": {
|
|
106
|
+
light: "#8c7a80",
|
|
107
|
+
dark: "#93838a"
|
|
108
|
+
},
|
|
109
|
+
"--qilin-alias-border-l1": {
|
|
110
|
+
light: "rgba(120, 60, 76, 0.08)",
|
|
111
|
+
dark: "rgba(242, 188, 203, 0.08)"
|
|
112
|
+
},
|
|
113
|
+
"--qilin-alias-border-l2": {
|
|
114
|
+
light: "rgba(120, 60, 76, 0.12)",
|
|
115
|
+
dark: "rgba(242, 188, 203, 0.14)"
|
|
116
|
+
},
|
|
117
|
+
"--qilin-alias-border-l3": {
|
|
118
|
+
light: "rgba(120, 60, 76, 0.16)",
|
|
119
|
+
dark: "rgba(242, 188, 203, 0.18)"
|
|
120
|
+
}
|
|
121
|
+
});
|
|
122
|
+
/** The blush pack as the appearance row consumes it. */
|
|
123
|
+
const BLUSH_PACK = Object.freeze({
|
|
124
|
+
id: "blush",
|
|
125
|
+
label: Object.freeze({
|
|
126
|
+
en: "Blush",
|
|
127
|
+
zh: "浅樱"
|
|
128
|
+
}),
|
|
129
|
+
boot: Object.freeze({
|
|
130
|
+
light: "#fbf6f4",
|
|
131
|
+
dark: "#141010"
|
|
132
|
+
}),
|
|
133
|
+
tokens: BLUSH_TOKENS
|
|
134
|
+
});
|
|
135
|
+
//#endregion
|
|
7
136
|
//#region lib/types/packs/qilin.js
|
|
8
137
|
/**
|
|
9
138
|
* The dark-gold color pack: the "玄金" landing VI extended to both schemes.
|
|
@@ -784,6 +913,7 @@ window.__ModuleLoader__.load({
|
|
|
784
913
|
/** Every shipped pack, in appearance-row order. */
|
|
785
914
|
const SKIN_PACKS = Object.freeze([
|
|
786
915
|
QILIN_PACK,
|
|
916
|
+
BLUSH_PACK,
|
|
787
917
|
MONO_PACK,
|
|
788
918
|
VERDANT_PACK
|
|
789
919
|
]);
|
package/lib/index.js
CHANGED
|
@@ -1,3 +1,132 @@
|
|
|
1
|
+
//#region lib/types/packs/blush.js
|
|
2
|
+
/**
|
|
3
|
+
* The blush color pack: warm pink-paper surfaces with a deep rose accent in the
|
|
4
|
+
* light scheme, and a dim rose canvas with a pale pink accent in the dark one.
|
|
5
|
+
*
|
|
6
|
+
* The identity tint is 浅樱 (#e8a0b4); WCAG AA governs where text sits on it,
|
|
7
|
+
* so fills and links deepen to #b25b74 (white on it clears 4.9:1, and it clears
|
|
8
|
+
* 4.9:1 on the #fbf6f4 paper) while the pale tint stays for selection and
|
|
9
|
+
* decoration only. State colors, masks, and the ongoing blue stay with the base
|
|
10
|
+
* palettes, the same omission rule as every pack. Hover darkens the light accent
|
|
11
|
+
* and brightens the dark one, matching each platform's convention.
|
|
12
|
+
*/
|
|
13
|
+
/** Blush tokens over the platform palettes. Every value states both schemes. */
|
|
14
|
+
const BLUSH_TOKENS = Object.freeze({
|
|
15
|
+
"--qilin-alias-brand-primary": {
|
|
16
|
+
light: "#b25b74",
|
|
17
|
+
dark: "#f2bccb"
|
|
18
|
+
},
|
|
19
|
+
"--qilin-alias-button-primary-hover": {
|
|
20
|
+
light: "#9d4e66",
|
|
21
|
+
dark: "#ffd6e0"
|
|
22
|
+
},
|
|
23
|
+
"--qilin-alias-link": {
|
|
24
|
+
light: "#a04f66",
|
|
25
|
+
dark: "#f6cdd9"
|
|
26
|
+
},
|
|
27
|
+
"--qilin-alias-bg-base": {
|
|
28
|
+
light: "#fbf6f4",
|
|
29
|
+
dark: "#141010"
|
|
30
|
+
},
|
|
31
|
+
"--qilin-alias-bg-layer-1": {
|
|
32
|
+
light: "#fffdfc",
|
|
33
|
+
dark: "#1b1616"
|
|
34
|
+
},
|
|
35
|
+
"--qilin-alias-bg-layer-2": {
|
|
36
|
+
light: "#fdf8f6",
|
|
37
|
+
dark: "#221b1b"
|
|
38
|
+
},
|
|
39
|
+
"--qilin-alias-bg-layer-3": {
|
|
40
|
+
light: "#f8f1ef",
|
|
41
|
+
dark: "#291f1f"
|
|
42
|
+
},
|
|
43
|
+
"--qilin-alias-bg-overlay": {
|
|
44
|
+
light: "#f5e9e7",
|
|
45
|
+
dark: "#3a2a2e"
|
|
46
|
+
},
|
|
47
|
+
"--qilin-alias-bg-skeleton": {
|
|
48
|
+
light: "rgba(120, 60, 76, 0.06)",
|
|
49
|
+
dark: "rgba(242, 188, 203, 0.08)"
|
|
50
|
+
},
|
|
51
|
+
"--qilin-specific-sidebar-fill": {
|
|
52
|
+
light: "#f8f1ef",
|
|
53
|
+
dark: "#141010"
|
|
54
|
+
},
|
|
55
|
+
"--qilin-specific-sidebar-nav-item-hover": {
|
|
56
|
+
light: "#f4e8e6",
|
|
57
|
+
dark: "#241b1d"
|
|
58
|
+
},
|
|
59
|
+
"--qilin-specific-sidebar-nav-item-active": {
|
|
60
|
+
light: "#f0e0df",
|
|
61
|
+
dark: "#2e2024"
|
|
62
|
+
},
|
|
63
|
+
"--qilin-specific-sidebar-nav-item-active-accent": {
|
|
64
|
+
light: "#b25b74",
|
|
65
|
+
dark: "#f2bccb"
|
|
66
|
+
},
|
|
67
|
+
"--qilin-specific-bubble": {
|
|
68
|
+
light: "#fbeef0",
|
|
69
|
+
dark: "#241a1c"
|
|
70
|
+
},
|
|
71
|
+
"--qilin-specific-input-major": {
|
|
72
|
+
light: "#fffdfc",
|
|
73
|
+
dark: "#1c1617"
|
|
74
|
+
},
|
|
75
|
+
"--qilin-specific-selector": {
|
|
76
|
+
light: "#f9efee",
|
|
77
|
+
dark: "#2e2024"
|
|
78
|
+
},
|
|
79
|
+
"--qilin-specific-tip": {
|
|
80
|
+
light: "#f9efee",
|
|
81
|
+
dark: "#2e2024"
|
|
82
|
+
},
|
|
83
|
+
"--qilin-alias-toast-bg": {
|
|
84
|
+
light: "#2b1f23",
|
|
85
|
+
dark: "#2b2124"
|
|
86
|
+
},
|
|
87
|
+
"--qilin-alias-tooltip-bg": {
|
|
88
|
+
light: "#261b1f",
|
|
89
|
+
dark: "#2b2124"
|
|
90
|
+
},
|
|
91
|
+
"--qilin-alias-label-primary": {
|
|
92
|
+
light: "#23191c",
|
|
93
|
+
dark: "#f0e6e8"
|
|
94
|
+
},
|
|
95
|
+
"--qilin-alias-label-secondary": {
|
|
96
|
+
light: "#6d5b61",
|
|
97
|
+
dark: "#b9a6ac"
|
|
98
|
+
},
|
|
99
|
+
"--qilin-alias-label-tertiary": {
|
|
100
|
+
light: "#8c7a80",
|
|
101
|
+
dark: "#93838a"
|
|
102
|
+
},
|
|
103
|
+
"--qilin-alias-border-l1": {
|
|
104
|
+
light: "rgba(120, 60, 76, 0.08)",
|
|
105
|
+
dark: "rgba(242, 188, 203, 0.08)"
|
|
106
|
+
},
|
|
107
|
+
"--qilin-alias-border-l2": {
|
|
108
|
+
light: "rgba(120, 60, 76, 0.12)",
|
|
109
|
+
dark: "rgba(242, 188, 203, 0.14)"
|
|
110
|
+
},
|
|
111
|
+
"--qilin-alias-border-l3": {
|
|
112
|
+
light: "rgba(120, 60, 76, 0.16)",
|
|
113
|
+
dark: "rgba(242, 188, 203, 0.18)"
|
|
114
|
+
}
|
|
115
|
+
});
|
|
116
|
+
/** The blush pack as the appearance row consumes it. */
|
|
117
|
+
const BLUSH_PACK = Object.freeze({
|
|
118
|
+
id: "blush",
|
|
119
|
+
label: Object.freeze({
|
|
120
|
+
en: "Blush",
|
|
121
|
+
zh: "浅樱"
|
|
122
|
+
}),
|
|
123
|
+
boot: Object.freeze({
|
|
124
|
+
light: "#fbf6f4",
|
|
125
|
+
dark: "#141010"
|
|
126
|
+
}),
|
|
127
|
+
tokens: BLUSH_TOKENS
|
|
128
|
+
});
|
|
129
|
+
//#endregion
|
|
1
130
|
//#region lib/types/packs/qilin.js
|
|
2
131
|
/**
|
|
3
132
|
* The dark-gold color pack: the "玄金" landing VI extended to both schemes.
|
|
@@ -778,6 +907,7 @@ const VERDANT_PACK = Object.freeze({
|
|
|
778
907
|
/** Every shipped pack, in appearance-row order. */
|
|
779
908
|
const SKIN_PACKS = Object.freeze([
|
|
780
909
|
QILIN_PACK,
|
|
910
|
+
BLUSH_PACK,
|
|
781
911
|
MONO_PACK,
|
|
782
912
|
VERDANT_PACK
|
|
783
913
|
]);
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* The blush color pack: warm pink-paper surfaces with a deep rose accent in the
|
|
3
|
+
* light scheme, and a dim rose canvas with a pale pink accent in the dark one.
|
|
4
|
+
*
|
|
5
|
+
* The identity tint is 浅樱 (#e8a0b4); WCAG AA governs where text sits on it,
|
|
6
|
+
* so fills and links deepen to #b25b74 (white on it clears 4.9:1, and it clears
|
|
7
|
+
* 4.9:1 on the #fbf6f4 paper) while the pale tint stays for selection and
|
|
8
|
+
* decoration only. State colors, masks, and the ongoing blue stay with the base
|
|
9
|
+
* palettes, the same omission rule as every pack. Hover darkens the light accent
|
|
10
|
+
* and brightens the dark one, matching each platform's convention.
|
|
11
|
+
*/
|
|
12
|
+
import type { ThemeTokenOverrides } from '@qilin-agent/client-ui-theme/client';
|
|
13
|
+
import type { SkinPack } from '../skin.ts';
|
|
14
|
+
/** Blush tokens over the platform palettes. Every value states both schemes. */
|
|
15
|
+
export declare const BLUSH_TOKENS: ThemeTokenOverrides;
|
|
16
|
+
/** The blush pack as the appearance row consumes it. */
|
|
17
|
+
export declare const BLUSH_PACK: SkinPack;
|
|
18
|
+
//# sourceMappingURL=blush.d.ts.map
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@qilin-agent/client-ui-theme-brand",
|
|
3
3
|
"description": "QiLin brand color layer for the Web client theme: alias-token overrides stacked over the user's active palette",
|
|
4
|
-
"version": "3.1.
|
|
4
|
+
"version": "3.1.8",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
7
7
|
},
|
|
@@ -38,12 +38,12 @@
|
|
|
38
38
|
},
|
|
39
39
|
"license": "MIT",
|
|
40
40
|
"peerDependencies": {
|
|
41
|
-
"@qilin-agent/kylin": "~4.0.
|
|
41
|
+
"@qilin-agent/kylin": "~4.0.6-alpha.2"
|
|
42
42
|
},
|
|
43
43
|
"devDependencies": {
|
|
44
|
-
"@qilin-agent/kylin": "~4.0.
|
|
45
|
-
"@qilin-agent/client-
|
|
46
|
-
"@qilin-agent/client-
|
|
44
|
+
"@qilin-agent/kylin": "~4.0.6-alpha.2",
|
|
45
|
+
"@qilin-agent/client-test-runtime": "3.1.8",
|
|
46
|
+
"@qilin-agent/client-ui-theme": "3.1.8"
|
|
47
47
|
},
|
|
48
48
|
"files": [
|
|
49
49
|
"lib/index.js",
|