@alessandrogiordano/stk 1.1.0
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.md +100 -0
- package/build/css/tokens.css +588 -0
- package/build/js/tokens.js +591 -0
- package/build/json/tokens.json +696 -0
- package/package.json +43 -0
- package/tokens/base/borders.json +21 -0
- package/tokens/base/colors.json +17 -0
- package/tokens/base/elevation.json +11 -0
- package/tokens/base/motion.json +16 -0
- package/tokens/base/opacity.json +14 -0
- package/tokens/base/shades.json +965 -0
- package/tokens/base/shadows.json +35 -0
- package/tokens/base/spacing.json +12 -0
- package/tokens/base/typography.json +17 -0
- package/tokens/components/badge-status.json +66 -0
- package/tokens/components/button.json +152 -0
- package/tokens/components/card.json +19 -0
- package/tokens/components/checkbox.json +34 -0
- package/tokens/components/image.json +9 -0
- package/tokens/components/list-item.json +87 -0
- package/tokens/components/radio-button.json +46 -0
- package/tokens/components/spinner.json +30 -0
- package/tokens/components/text-input.json +47 -0
- package/tokens/components/tooltip.json +39 -0
- package/tokens/semantic/borders.json +18 -0
- package/tokens/semantic/icons.json +17 -0
- package/tokens/semantic/layout.json +11 -0
- package/tokens/semantic/states.json +29 -0
- package/tokens/semantic/surfaces.json +87 -0
- package/tokens/semantic/text.json +17 -0
- package/tokens/semantic/typography.json +49 -0
|
@@ -0,0 +1,591 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Do not edit directly
|
|
3
|
+
* Generated on Sat, 16 May 2026 08:07:05 GMT
|
|
4
|
+
*/
|
|
5
|
+
|
|
6
|
+
export const stk-color-shade-palette-1-1 = "#cff6ff"; // palette-1 shade 1 — lightness 97%
|
|
7
|
+
export const stk-color-shade-palette-1-2 = "#abe1ff"; // palette-1 shade 2 — lightness 91%
|
|
8
|
+
export const stk-color-shade-palette-1-3 = "#8dcbff"; // palette-1 shade 3 — lightness 85%
|
|
9
|
+
export const stk-color-shade-palette-1-4 = "#75b7ff"; // palette-1 shade 4 — lightness 80%
|
|
10
|
+
export const stk-color-shade-palette-1-5 = "#60a3ff"; // palette-1 shade 5 — lightness 74%
|
|
11
|
+
export const stk-color-shade-palette-1-6 = "#4d8fff"; // palette-1 shade 6 — lightness 68%
|
|
12
|
+
export const stk-color-shade-palette-1-7 = "#3b7cff"; // palette-1 shade 7 — lightness 62%
|
|
13
|
+
export const stk-color-shade-palette-1-8 = "#2a69f1"; // palette-1 shade 8 — lightness 56%
|
|
14
|
+
export const stk-color-shade-palette-1-9 = "#1956dd"; // palette-1 shade 9 — lightness 51%
|
|
15
|
+
export const stk-color-shade-palette-1-10 = "#0542c9"; // palette-1 shade 10 — lightness 45%
|
|
16
|
+
export const stk-color-shade-palette-1-11 = "#002eb4"; // palette-1 shade 11 — lightness 39%
|
|
17
|
+
export const stk-color-shade-palette-1-12 = "#00169f"; // palette-1 shade 12 — lightness 33%
|
|
18
|
+
export const stk-color-shade-palette-1-13 = "#000087"; // palette-1 shade 13 — lightness 27%
|
|
19
|
+
export const stk-color-shade-palette-1-14 = "#02006c"; // palette-1 shade 14 — lightness 22%
|
|
20
|
+
export const stk-color-shade-palette-1-15 = "#03004d"; // palette-1 shade 15 — lightness 16%
|
|
21
|
+
export const stk-color-shade-palette-1-16 = "#020029"; // palette-1 shade 16 — lightness 10%
|
|
22
|
+
export const stk-color-shade-palette-2-1 = "#e1efff"; // palette-2 shade 1 — lightness 97%
|
|
23
|
+
export const stk-color-shade-palette-2-2 = "#c7d6ff"; // palette-2 shade 2 — lightness 91%
|
|
24
|
+
export const stk-color-shade-palette-2-3 = "#b0bfff"; // palette-2 shade 3 — lightness 85%
|
|
25
|
+
export const stk-color-shade-palette-2-4 = "#9da9ff"; // palette-2 shade 4 — lightness 80%
|
|
26
|
+
export const stk-color-shade-palette-2-5 = "#8b94ff"; // palette-2 shade 5 — lightness 74%
|
|
27
|
+
export const stk-color-shade-palette-2-6 = "#7a80ff"; // palette-2 shade 6 — lightness 68%
|
|
28
|
+
export const stk-color-shade-palette-2-7 = "#6b6cff"; // palette-2 shade 7 — lightness 62%
|
|
29
|
+
export const stk-color-shade-palette-2-8 = "#5c59f8"; // palette-2 shade 8 — lightness 56%
|
|
30
|
+
export const stk-color-shade-palette-2-9 = "#4e44e3"; // palette-2 shade 9 — lightness 51%
|
|
31
|
+
export const stk-color-shade-palette-2-10 = "#412ecf"; // palette-2 shade 10 — lightness 45%
|
|
32
|
+
export const stk-color-shade-palette-2-11 = "#3612ba"; // palette-2 shade 11 — lightness 39%
|
|
33
|
+
export const stk-color-shade-palette-2-12 = "#2c00a4"; // palette-2 shade 12 — lightness 33%
|
|
34
|
+
export const stk-color-shade-palette-2-13 = "#23008c"; // palette-2 shade 13 — lightness 27%
|
|
35
|
+
export const stk-color-shade-palette-2-14 = "#1a0071"; // palette-2 shade 14 — lightness 22%
|
|
36
|
+
export const stk-color-shade-palette-2-15 = "#100051"; // palette-2 shade 15 — lightness 16%
|
|
37
|
+
export const stk-color-shade-palette-2-16 = "#06002b"; // palette-2 shade 16 — lightness 10%
|
|
38
|
+
export const stk-color-shade-palette-3-1 = "#f8e6ff"; // palette-3 shade 1 — lightness 97%
|
|
39
|
+
export const stk-color-shade-palette-3-2 = "#e7c9ff"; // palette-3 shade 2 — lightness 91%
|
|
40
|
+
export const stk-color-shade-palette-3-3 = "#d6afff"; // palette-3 shade 3 — lightness 85%
|
|
41
|
+
export const stk-color-shade-palette-3-4 = "#c698ff"; // palette-3 shade 4 — lightness 80%
|
|
42
|
+
export const stk-color-shade-palette-3-5 = "#b481ff"; // palette-3 shade 5 — lightness 74%
|
|
43
|
+
export const stk-color-shade-palette-3-6 = "#a36cff"; // palette-3 shade 6 — lightness 68%
|
|
44
|
+
export const stk-color-shade-palette-3-7 = "#9358ff"; // palette-3 shade 7 — lightness 62%
|
|
45
|
+
export const stk-color-shade-palette-3-8 = "#8243f5"; // palette-3 shade 8 — lightness 56%
|
|
46
|
+
export const stk-color-shade-palette-3-9 = "#722be1"; // palette-3 shade 9 — lightness 51%
|
|
47
|
+
export const stk-color-shade-palette-3-10 = "#6305cc"; // palette-3 shade 10 — lightness 45%
|
|
48
|
+
export const stk-color-shade-palette-3-11 = "#5500b8"; // palette-3 shade 11 — lightness 39%
|
|
49
|
+
export const stk-color-shade-palette-3-12 = "#4600a2"; // palette-3 shade 12 — lightness 33%
|
|
50
|
+
export const stk-color-shade-palette-3-13 = "#39008a"; // palette-3 shade 13 — lightness 27%
|
|
51
|
+
export const stk-color-shade-palette-3-14 = "#2a006f"; // palette-3 shade 14 — lightness 22%
|
|
52
|
+
export const stk-color-shade-palette-3-15 = "#1b004f"; // palette-3 shade 15 — lightness 16%
|
|
53
|
+
export const stk-color-shade-palette-3-16 = "#0b002a"; // palette-3 shade 16 — lightness 10%
|
|
54
|
+
export const stk-color-shade-palette-4-1 = "#ffd7f1"; // palette-4 shade 1 — lightness 97%
|
|
55
|
+
export const stk-color-shade-palette-4-2 = "#ffb4dc"; // palette-4 shade 2 — lightness 91%
|
|
56
|
+
export const stk-color-shade-palette-4-3 = "#ff95c9"; // palette-4 shade 3 — lightness 85%
|
|
57
|
+
export const stk-color-shade-palette-4-4 = "#ff7bb6"; // palette-4 shade 4 — lightness 80%
|
|
58
|
+
export const stk-color-shade-palette-4-5 = "#ff63a3"; // palette-4 shade 5 — lightness 74%
|
|
59
|
+
export const stk-color-shade-palette-4-6 = "#fb4c91"; // palette-4 shade 6 — lightness 68%
|
|
60
|
+
export const stk-color-shade-palette-4-7 = "#e63580"; // palette-4 shade 7 — lightness 62%
|
|
61
|
+
export const stk-color-shade-palette-4-8 = "#d1186f"; // palette-4 shade 8 — lightness 56%
|
|
62
|
+
export const stk-color-shade-palette-4-9 = "#bc005e"; // palette-4 shade 9 — lightness 51%
|
|
63
|
+
export const stk-color-shade-palette-4-10 = "#a7004e"; // palette-4 shade 10 — lightness 45%
|
|
64
|
+
export const stk-color-shade-palette-4-11 = "#92003f"; // palette-4 shade 11 — lightness 39%
|
|
65
|
+
export const stk-color-shade-palette-4-12 = "#7d0030"; // palette-4 shade 12 — lightness 33%
|
|
66
|
+
export const stk-color-shade-palette-4-13 = "#660022"; // palette-4 shade 13 — lightness 27%
|
|
67
|
+
export const stk-color-shade-palette-4-14 = "#4e0015"; // palette-4 shade 14 — lightness 22%
|
|
68
|
+
export const stk-color-shade-palette-4-15 = "#340009"; // palette-4 shade 15 — lightness 16%
|
|
69
|
+
export const stk-color-shade-palette-4-16 = "#190002"; // palette-4 shade 16 — lightness 10%
|
|
70
|
+
export const stk-color-shade-palette-5-1 = "#ffdace"; // palette-5 shade 1 — lightness 97%
|
|
71
|
+
export const stk-color-shade-palette-5-2 = "#ffb8a9"; // palette-5 shade 2 — lightness 91%
|
|
72
|
+
export const stk-color-shade-palette-5-3 = "#ff9a8b"; // palette-5 shade 3 — lightness 85%
|
|
73
|
+
export const stk-color-shade-palette-5-4 = "#ff8072"; // palette-5 shade 4 — lightness 80%
|
|
74
|
+
export const stk-color-shade-palette-5-5 = "#ff685c"; // palette-5 shade 5 — lightness 74%
|
|
75
|
+
export const stk-color-shade-palette-5-6 = "#ff5148"; // palette-5 shade 6 — lightness 68%
|
|
76
|
+
export const stk-color-shade-palette-5-7 = "#ec3a35"; // palette-5 shade 7 — lightness 62%
|
|
77
|
+
export const stk-color-shade-palette-5-8 = "#d71f21"; // palette-5 shade 8 — lightness 56%
|
|
78
|
+
export const stk-color-shade-palette-5-9 = "#c20007"; // palette-5 shade 9 — lightness 51%
|
|
79
|
+
export const stk-color-shade-palette-5-10 = "#ad0000"; // palette-5 shade 10 — lightness 45%
|
|
80
|
+
export const stk-color-shade-palette-5-11 = "#980000"; // palette-5 shade 11 — lightness 39%
|
|
81
|
+
export const stk-color-shade-palette-5-12 = "#820000"; // palette-5 shade 12 — lightness 33%
|
|
82
|
+
export const stk-color-shade-palette-5-13 = "#6b0000"; // palette-5 shade 13 — lightness 27%
|
|
83
|
+
export const stk-color-shade-palette-5-14 = "#520000"; // palette-5 shade 14 — lightness 22%
|
|
84
|
+
export const stk-color-shade-palette-5-15 = "#380000"; // palette-5 shade 15 — lightness 16%
|
|
85
|
+
export const stk-color-shade-palette-5-16 = "#1b0000"; // palette-5 shade 16 — lightness 10%
|
|
86
|
+
export const stk-color-shade-palette-6-1 = "#ffe0c3"; // palette-6 shade 1 — lightness 97%
|
|
87
|
+
export const stk-color-shade-palette-6-2 = "#ffc298"; // palette-6 shade 2 — lightness 91%
|
|
88
|
+
export const stk-color-shade-palette-6-3 = "#ffa675"; // palette-6 shade 3 — lightness 85%
|
|
89
|
+
export const stk-color-shade-palette-6-4 = "#ff8e58"; // palette-6 shade 4 — lightness 80%
|
|
90
|
+
export const stk-color-shade-palette-6-5 = "#ff783d"; // palette-6 shade 5 — lightness 74%
|
|
91
|
+
export const stk-color-shade-palette-6-6 = "#f66422"; // palette-6 shade 6 — lightness 68%
|
|
92
|
+
export const stk-color-shade-palette-6-7 = "#e15000"; // palette-6 shade 7 — lightness 62%
|
|
93
|
+
export const stk-color-shade-palette-6-8 = "#cd3c00"; // palette-6 shade 8 — lightness 56%
|
|
94
|
+
export const stk-color-shade-palette-6-9 = "#b82500"; // palette-6 shade 9 — lightness 51%
|
|
95
|
+
export const stk-color-shade-palette-6-10 = "#a40000"; // palette-6 shade 10 — lightness 45%
|
|
96
|
+
export const stk-color-shade-palette-6-11 = "#8f0000"; // palette-6 shade 11 — lightness 39%
|
|
97
|
+
export const stk-color-shade-palette-6-12 = "#7a0000"; // palette-6 shade 12 — lightness 33%
|
|
98
|
+
export const stk-color-shade-palette-6-13 = "#640000"; // palette-6 shade 13 — lightness 27%
|
|
99
|
+
export const stk-color-shade-palette-6-14 = "#4d0000"; // palette-6 shade 14 — lightness 22%
|
|
100
|
+
export const stk-color-shade-palette-6-15 = "#340000"; // palette-6 shade 15 — lightness 16%
|
|
101
|
+
export const stk-color-shade-palette-6-16 = "#190000"; // palette-6 shade 16 — lightness 10%
|
|
102
|
+
export const stk-color-shade-palette-7-1 = "#ffe9c1"; // palette-7 shade 1 — lightness 97%
|
|
103
|
+
export const stk-color-shade-palette-7-2 = "#ffcf95"; // palette-7 shade 2 — lightness 91%
|
|
104
|
+
export const stk-color-shade-palette-7-3 = "#ffb871"; // palette-7 shade 3 — lightness 85%
|
|
105
|
+
export const stk-color-shade-palette-7-4 = "#ffa352"; // palette-7 shade 4 — lightness 80%
|
|
106
|
+
export const stk-color-shade-palette-7-5 = "#f08f36"; // palette-7 shade 5 — lightness 74%
|
|
107
|
+
export const stk-color-shade-palette-7-6 = "#dd7c16"; // palette-7 shade 6 — lightness 68%
|
|
108
|
+
export const stk-color-shade-palette-7-7 = "#ca6900"; // palette-7 shade 7 — lightness 62%
|
|
109
|
+
export const stk-color-shade-palette-7-8 = "#b75800"; // palette-7 shade 8 — lightness 56%
|
|
110
|
+
export const stk-color-shade-palette-7-9 = "#a34600"; // palette-7 shade 9 — lightness 51%
|
|
111
|
+
export const stk-color-shade-palette-7-10 = "#903400"; // palette-7 shade 10 — lightness 45%
|
|
112
|
+
export const stk-color-shade-palette-7-11 = "#7d2100"; // palette-7 shade 11 — lightness 39%
|
|
113
|
+
export const stk-color-shade-palette-7-12 = "#6a0c00"; // palette-7 shade 12 — lightness 33%
|
|
114
|
+
export const stk-color-shade-palette-7-13 = "#560000"; // palette-7 shade 13 — lightness 27%
|
|
115
|
+
export const stk-color-shade-palette-7-14 = "#410000"; // palette-7 shade 14 — lightness 22%
|
|
116
|
+
export const stk-color-shade-palette-7-15 = "#2a0000"; // palette-7 shade 15 — lightness 16%
|
|
117
|
+
export const stk-color-shade-palette-7-16 = "#130000"; // palette-7 shade 16 — lightness 10%
|
|
118
|
+
export const stk-color-shade-palette-8-1 = "#ceffd6"; // palette-8 shade 1 — lightness 97%
|
|
119
|
+
export const stk-color-shade-palette-8-2 = "#a7f9b6"; // palette-8 shade 2 — lightness 91%
|
|
120
|
+
export const stk-color-shade-palette-8-3 = "#85e99a"; // palette-8 shade 3 — lightness 85%
|
|
121
|
+
export const stk-color-shade-palette-8-4 = "#68d882"; // palette-8 shade 4 — lightness 80%
|
|
122
|
+
export const stk-color-shade-palette-8-5 = "#4ec66e"; // palette-8 shade 5 — lightness 74%
|
|
123
|
+
export const stk-color-shade-palette-8-6 = "#34b45b"; // palette-8 shade 6 — lightness 68%
|
|
124
|
+
export const stk-color-shade-palette-8-7 = "#12a149"; // palette-8 shade 7 — lightness 62%
|
|
125
|
+
export const stk-color-shade-palette-8-8 = "#008f37"; // palette-8 shade 8 — lightness 56%
|
|
126
|
+
export const stk-color-shade-palette-8-9 = "#007d24"; // palette-8 shade 9 — lightness 51%
|
|
127
|
+
export const stk-color-shade-palette-8-10 = "#006c0f"; // palette-8 shade 10 — lightness 45%
|
|
128
|
+
export const stk-color-shade-palette-8-11 = "#005a00"; // palette-8 shade 11 — lightness 39%
|
|
129
|
+
export const stk-color-shade-palette-8-12 = "#004900"; // palette-8 shade 12 — lightness 33%
|
|
130
|
+
export const stk-color-shade-palette-8-13 = "#003900"; // palette-8 shade 13 — lightness 27%
|
|
131
|
+
export const stk-color-shade-palette-8-14 = "#002800"; // palette-8 shade 14 — lightness 22%
|
|
132
|
+
export const stk-color-shade-palette-8-15 = "#001700"; // palette-8 shade 15 — lightness 16%
|
|
133
|
+
export const stk-color-shade-palette-8-16 = "#000800"; // palette-8 shade 16 — lightness 10%
|
|
134
|
+
export const stk-color-shade-palette-9-1 = "#cffff9"; // palette-9 shade 1 — lightness 97%
|
|
135
|
+
export const stk-color-shade-palette-9-2 = "#a9f3e8"; // palette-9 shade 2 — lightness 91%
|
|
136
|
+
export const stk-color-shade-palette-9-3 = "#88e2d6"; // palette-9 shade 3 — lightness 85%
|
|
137
|
+
export const stk-color-shade-palette-9-4 = "#6cd1c4"; // palette-9 shade 4 — lightness 80%
|
|
138
|
+
export const stk-color-shade-palette-9-5 = "#52bfb2"; // palette-9 shade 5 — lightness 74%
|
|
139
|
+
export const stk-color-shade-palette-9-6 = "#3aada0"; // palette-9 shade 6 — lightness 68%
|
|
140
|
+
export const stk-color-shade-palette-9-7 = "#1d9b8f"; // palette-9 shade 7 — lightness 62%
|
|
141
|
+
export const stk-color-shade-palette-9-8 = "#00897d"; // palette-9 shade 8 — lightness 56%
|
|
142
|
+
export const stk-color-shade-palette-9-9 = "#00776c"; // palette-9 shade 9 — lightness 51%
|
|
143
|
+
export const stk-color-shade-palette-9-10 = "#00665c"; // palette-9 shade 10 — lightness 45%
|
|
144
|
+
export const stk-color-shade-palette-9-11 = "#00564c"; // palette-9 shade 11 — lightness 39%
|
|
145
|
+
export const stk-color-shade-palette-9-12 = "#00453c"; // palette-9 shade 12 — lightness 33%
|
|
146
|
+
export const stk-color-shade-palette-9-13 = "#00352d"; // palette-9 shade 13 — lightness 27%
|
|
147
|
+
export const stk-color-shade-palette-9-14 = "#00251f"; // palette-9 shade 14 — lightness 22%
|
|
148
|
+
export const stk-color-shade-palette-9-15 = "#001511"; // palette-9 shade 15 — lightness 16%
|
|
149
|
+
export const stk-color-shade-palette-9-16 = "#000705"; // palette-9 shade 16 — lightness 10%
|
|
150
|
+
export const stk-color-shade-palette-10-1 = "#cdfeff"; // palette-10 shade 1 — lightness 97%
|
|
151
|
+
export const stk-color-shade-palette-10-2 = "#a6efff"; // palette-10 shade 2 — lightness 91%
|
|
152
|
+
export const stk-color-shade-palette-10-3 = "#85defb"; // palette-10 shade 3 — lightness 85%
|
|
153
|
+
export const stk-color-shade-palette-10-4 = "#68ccec"; // palette-10 shade 4 — lightness 80%
|
|
154
|
+
export const stk-color-shade-palette-10-5 = "#4eb9db"; // palette-10 shade 5 — lightness 74%
|
|
155
|
+
export const stk-color-shade-palette-10-6 = "#34a7c9"; // palette-10 shade 6 — lightness 68%
|
|
156
|
+
export const stk-color-shade-palette-10-7 = "#1595b6"; // palette-10 shade 7 — lightness 62%
|
|
157
|
+
export const stk-color-shade-palette-10-8 = "#0083a4"; // palette-10 shade 8 — lightness 56%
|
|
158
|
+
export const stk-color-shade-palette-10-9 = "#007292"; // palette-10 shade 9 — lightness 51%
|
|
159
|
+
export const stk-color-shade-palette-10-10 = "#006180"; // palette-10 shade 10 — lightness 45%
|
|
160
|
+
export const stk-color-shade-palette-10-11 = "#00506e"; // palette-10 shade 11 — lightness 39%
|
|
161
|
+
export const stk-color-shade-palette-10-12 = "#00405d"; // palette-10 shade 12 — lightness 33%
|
|
162
|
+
export const stk-color-shade-palette-10-13 = "#00304b"; // palette-10 shade 13 — lightness 27%
|
|
163
|
+
export const stk-color-shade-palette-10-14 = "#002038"; // palette-10 shade 14 — lightness 22%
|
|
164
|
+
export const stk-color-shade-palette-10-15 = "#001124"; // palette-10 shade 15 — lightness 16%
|
|
165
|
+
export const stk-color-shade-palette-10-16 = "#000510"; // palette-10 shade 16 — lightness 10%
|
|
166
|
+
export const stk-color-shade-palette-11-1 = "#f5f5f5"; // palette-11 shade 1 — lightness 97%
|
|
167
|
+
export const stk-color-shade-palette-11-2 = "#e2e2e2"; // palette-11 shade 2 — lightness 91%
|
|
168
|
+
export const stk-color-shade-palette-11-3 = "#cfcfcf"; // palette-11 shade 3 — lightness 85%
|
|
169
|
+
export const stk-color-shade-palette-11-4 = "#bcbcbc"; // palette-11 shade 4 — lightness 80%
|
|
170
|
+
export const stk-color-shade-palette-11-5 = "#aaaaaa"; // palette-11 shade 5 — lightness 74%
|
|
171
|
+
export const stk-color-shade-palette-11-6 = "#989898"; // palette-11 shade 6 — lightness 68%
|
|
172
|
+
export const stk-color-shade-palette-11-7 = "#878787"; // palette-11 shade 7 — lightness 62%
|
|
173
|
+
export const stk-color-shade-palette-11-8 = "#757575"; // palette-11 shade 8 — lightness 56%
|
|
174
|
+
export const stk-color-shade-palette-11-9 = "#656565"; // palette-11 shade 9 — lightness 51%
|
|
175
|
+
export const stk-color-shade-palette-11-10 = "#555555"; // palette-11 shade 10 — lightness 45%
|
|
176
|
+
export const stk-color-shade-palette-11-11 = "#454545"; // palette-11 shade 11 — lightness 39%
|
|
177
|
+
export const stk-color-shade-palette-11-12 = "#363636"; // palette-11 shade 12 — lightness 33%
|
|
178
|
+
export const stk-color-shade-palette-11-13 = "#272727"; // palette-11 shade 13 — lightness 27%
|
|
179
|
+
export const stk-color-shade-palette-11-14 = "#1a1a1a"; // palette-11 shade 14 — lightness 22%
|
|
180
|
+
export const stk-color-shade-palette-11-15 = "#0d0d0d"; // palette-11 shade 15 — lightness 16%
|
|
181
|
+
export const stk-color-shade-palette-11-16 = "#030303"; // palette-11 shade 16 — lightness 10%
|
|
182
|
+
export const stk-color-brand-palette-1 = "#2563eb"; // palette-1 — exact brand color
|
|
183
|
+
export const stk-color-brand-palette-2 = "#4f46e5"; // palette-2 — exact brand color
|
|
184
|
+
export const stk-color-brand-palette-3 = "#7c3aed"; // palette-3 — exact brand color
|
|
185
|
+
export const stk-color-brand-palette-4 = "#db2777"; // palette-4 — exact brand color
|
|
186
|
+
export const stk-color-brand-palette-5 = "#dc2626"; // palette-5 — exact brand color
|
|
187
|
+
export const stk-color-brand-palette-6 = "#ea580c"; // palette-6 — exact brand color
|
|
188
|
+
export const stk-color-brand-palette-7 = "#d97706"; // palette-7 — exact brand color
|
|
189
|
+
export const stk-color-brand-palette-8 = "#16a34a"; // palette-8 — exact brand color
|
|
190
|
+
export const stk-color-brand-palette-9 = "#0d9488"; // palette-9 — exact brand color
|
|
191
|
+
export const stk-color-brand-palette-10 = "#0891b2"; // palette-10 — exact brand color
|
|
192
|
+
export const stk-color-brand-palette-11 = "#525252"; // palette-11 — exact brand color
|
|
193
|
+
export const stk-spacing-xxs = "4px";
|
|
194
|
+
export const stk-spacing-xs = "8px";
|
|
195
|
+
export const stk-spacing-sm = "12px";
|
|
196
|
+
export const stk-spacing-md = "16px";
|
|
197
|
+
export const stk-spacing-lg = "24px";
|
|
198
|
+
export const stk-spacing-xl = "32px";
|
|
199
|
+
export const stk-spacing-xxl = "48px";
|
|
200
|
+
export const stk-spacing-xxxl = "64px";
|
|
201
|
+
export const stk-radius-none = "0px";
|
|
202
|
+
export const stk-radius-xs = "2px";
|
|
203
|
+
export const stk-radius-sm = "4px";
|
|
204
|
+
export const stk-radius-sm-md = "6px";
|
|
205
|
+
export const stk-radius-md = "8px";
|
|
206
|
+
export const stk-radius-lg = "16px";
|
|
207
|
+
export const stk-radius-xl = "24px";
|
|
208
|
+
export const stk-radius-circular = "100px";
|
|
209
|
+
export const stk-radius-pill = "100px";
|
|
210
|
+
export const stk-border-width-sm = "1px";
|
|
211
|
+
export const stk-border-width-md = "2px";
|
|
212
|
+
export const stk-border-width-lg = "4px";
|
|
213
|
+
export const stk-border-width-xl = "8px";
|
|
214
|
+
export const stk-border-default = "#aaaaaa";
|
|
215
|
+
export const stk-border-subtle = "#bcbcbc";
|
|
216
|
+
export const stk-border-strong = "#878787";
|
|
217
|
+
export const stk-border-inverse = "#f5f5f5";
|
|
218
|
+
export const stk-border-focus = "#2a69f1";
|
|
219
|
+
export const stk-border-brand-1 = "#2a69f1";
|
|
220
|
+
export const stk-border-brand-2 = "#5c59f8";
|
|
221
|
+
export const stk-border-brand-3 = "#8243f5";
|
|
222
|
+
export const stk-border-success = "#008f37";
|
|
223
|
+
export const stk-border-danger = "#d71f21";
|
|
224
|
+
export const stk-border-alert = "#cd3c00";
|
|
225
|
+
export const stk-border-info = "#b75800";
|
|
226
|
+
export const stk-border-news = "#008f37";
|
|
227
|
+
export const stk-border-ai = "#00897d";
|
|
228
|
+
export const stk-typography-config-base = 16;
|
|
229
|
+
export const stk-typography-config-ratio = 1.2;
|
|
230
|
+
export const stk-typography-size-xs = "11px";
|
|
231
|
+
export const stk-typography-size-sm = "13px";
|
|
232
|
+
export const stk-typography-size-md = "16px";
|
|
233
|
+
export const stk-typography-size-lg = "19px";
|
|
234
|
+
export const stk-typography-size-xl = "23px";
|
|
235
|
+
export const stk-typography-size-xxl = "28px";
|
|
236
|
+
export const stk-typography-size-xxxl = "33px";
|
|
237
|
+
export const stk-opacity-0 = "0";
|
|
238
|
+
export const stk-opacity-8 = "0.08";
|
|
239
|
+
export const stk-opacity-12 = "0.12";
|
|
240
|
+
export const stk-opacity-16 = "0.16";
|
|
241
|
+
export const stk-opacity-24 = "0.24";
|
|
242
|
+
export const stk-opacity-32 = "0.32";
|
|
243
|
+
export const stk-opacity-48 = "0.48";
|
|
244
|
+
export const stk-opacity-64 = "0.64";
|
|
245
|
+
export const stk-opacity-80 = "0.80";
|
|
246
|
+
export const stk-opacity-100 = "1";
|
|
247
|
+
export const stk-duration-instant = "0ms";
|
|
248
|
+
export const stk-duration-fast = "100ms";
|
|
249
|
+
export const stk-duration-normal = "200ms";
|
|
250
|
+
export const stk-duration-slow = "300ms";
|
|
251
|
+
export const stk-duration-slower = "500ms";
|
|
252
|
+
export const stk-easing-linear = "linear";
|
|
253
|
+
export const stk-easing-ease-in = "cubic-bezier(0.4, 0, 1, 1)";
|
|
254
|
+
export const stk-easing-ease-out = "cubic-bezier(0, 0, 0.2, 1)";
|
|
255
|
+
export const stk-easing-ease-in-out = "cubic-bezier(0.4, 0, 0.2, 1)";
|
|
256
|
+
export const stk-easing-spring = "cubic-bezier(0.34, 1.56, 0.64, 1)";
|
|
257
|
+
export const stk-elevation-base = "0";
|
|
258
|
+
export const stk-elevation-raised = "10";
|
|
259
|
+
export const stk-elevation-sticky = "100";
|
|
260
|
+
export const stk-elevation-overlay = "200";
|
|
261
|
+
export const stk-elevation-modal = "300";
|
|
262
|
+
export const stk-elevation-toast = "400";
|
|
263
|
+
export const stk-elevation-tooltip = "500";
|
|
264
|
+
export const stk-surface-brand-1-subtlest = "#cff6ff";
|
|
265
|
+
export const stk-surface-brand-1-subtle = "#abe1ff";
|
|
266
|
+
export const stk-surface-brand-1-default = "#8dcbff";
|
|
267
|
+
export const stk-surface-brand-1-bold = "#60a3ff";
|
|
268
|
+
export const stk-surface-brand-1-strong = "#1956dd";
|
|
269
|
+
export const stk-surface-brand-1-strongest = "#0542c9";
|
|
270
|
+
export const stk-surface-brand-2-subtlest = "#e1efff";
|
|
271
|
+
export const stk-surface-brand-2-subtle = "#c7d6ff";
|
|
272
|
+
export const stk-surface-brand-2-default = "#b0bfff";
|
|
273
|
+
export const stk-surface-brand-2-bold = "#8b94ff";
|
|
274
|
+
export const stk-surface-brand-2-strong = "#5c59f8";
|
|
275
|
+
export const stk-surface-brand-2-strongest = "#412ecf";
|
|
276
|
+
export const stk-surface-brand-3-subtlest = "#f8e6ff";
|
|
277
|
+
export const stk-surface-brand-3-subtle = "#e7c9ff";
|
|
278
|
+
export const stk-surface-brand-3-default = "#d6afff";
|
|
279
|
+
export const stk-surface-brand-3-bold = "#b481ff";
|
|
280
|
+
export const stk-surface-brand-3-strong = "#8243f5";
|
|
281
|
+
export const stk-surface-brand-3-strongest = "#6305cc";
|
|
282
|
+
export const stk-surface-success-subtlest = "#ceffd6";
|
|
283
|
+
export const stk-surface-success-subtle = "#a7f9b6";
|
|
284
|
+
export const stk-surface-success-default = "#85e99a";
|
|
285
|
+
export const stk-surface-success-bold = "#4ec66e";
|
|
286
|
+
export const stk-surface-success-strong = "#008f37";
|
|
287
|
+
export const stk-surface-success-strongest = "#006c0f";
|
|
288
|
+
export const stk-surface-danger-subtlest = "#ffdace";
|
|
289
|
+
export const stk-surface-danger-subtle = "#ffb8a9";
|
|
290
|
+
export const stk-surface-danger-default = "#ff9a8b";
|
|
291
|
+
export const stk-surface-danger-bold = "#ff685c";
|
|
292
|
+
export const stk-surface-danger-strong = "#d71f21";
|
|
293
|
+
export const stk-surface-danger-strongest = "#ad0000";
|
|
294
|
+
export const stk-surface-alert-subtlest = "#ffe0c3";
|
|
295
|
+
export const stk-surface-alert-subtle = "#ffc298";
|
|
296
|
+
export const stk-surface-alert-default = "#ffa675";
|
|
297
|
+
export const stk-surface-alert-bold = "#ff783d";
|
|
298
|
+
export const stk-surface-alert-strong = "#cd3c00";
|
|
299
|
+
export const stk-surface-alert-strongest = "#a40000";
|
|
300
|
+
export const stk-surface-info-subtlest = "#ffe9c1";
|
|
301
|
+
export const stk-surface-info-subtle = "#ffcf95";
|
|
302
|
+
export const stk-surface-info-default = "#ffb871";
|
|
303
|
+
export const stk-surface-info-bold = "#f08f36";
|
|
304
|
+
export const stk-surface-info-strong = "#b75800";
|
|
305
|
+
export const stk-surface-info-strongest = "#903400";
|
|
306
|
+
export const stk-surface-news-subtlest = "#ceffd6";
|
|
307
|
+
export const stk-surface-news-subtle = "#a7f9b6";
|
|
308
|
+
export const stk-surface-news-default = "#85e99a";
|
|
309
|
+
export const stk-surface-news-bold = "#4ec66e";
|
|
310
|
+
export const stk-surface-news-strong = "#008f37";
|
|
311
|
+
export const stk-surface-news-strongest = "#006c0f";
|
|
312
|
+
export const stk-surface-ai-subtlest = "#cffff9";
|
|
313
|
+
export const stk-surface-ai-subtle = "#a9f3e8";
|
|
314
|
+
export const stk-surface-ai-default = "#88e2d6";
|
|
315
|
+
export const stk-surface-ai-bold = "#52bfb2";
|
|
316
|
+
export const stk-surface-ai-strong = "#00897d";
|
|
317
|
+
export const stk-surface-ai-strongest = "#00665c";
|
|
318
|
+
export const stk-surface-neutral-white = "#ffffff";
|
|
319
|
+
export const stk-surface-neutral-subtlest = "#f5f5f5";
|
|
320
|
+
export const stk-surface-neutral-subtle = "#e2e2e2";
|
|
321
|
+
export const stk-surface-neutral-default = "#cfcfcf";
|
|
322
|
+
export const stk-surface-neutral-bold = "#aaaaaa";
|
|
323
|
+
export const stk-surface-neutral-strong = "#757575";
|
|
324
|
+
export const stk-surface-neutral-strongest = "#555555";
|
|
325
|
+
export const stk-surface-neutral-black = "#000000";
|
|
326
|
+
export const stk-surface-transparent = "transparent";
|
|
327
|
+
export const stk-text-default = "#363636";
|
|
328
|
+
export const stk-text-subtle = "#656565";
|
|
329
|
+
export const stk-text-subtlest = "#757575";
|
|
330
|
+
export const stk-text-inverse = "#f5f5f5";
|
|
331
|
+
export const stk-text-brand-1 = "#0542c9";
|
|
332
|
+
export const stk-text-brand-2 = "#412ecf";
|
|
333
|
+
export const stk-text-brand-3 = "#6305cc";
|
|
334
|
+
export const stk-text-success = "#006c0f";
|
|
335
|
+
export const stk-text-danger = "#ad0000";
|
|
336
|
+
export const stk-text-alert = "#a40000";
|
|
337
|
+
export const stk-text-info = "#903400";
|
|
338
|
+
export const stk-text-news = "#006c0f";
|
|
339
|
+
export const stk-text-ai = "#00665c";
|
|
340
|
+
export const stk-text-display-light = {"fontSize":"33px","fontWeight":"300","lineHeight":"1.1"};
|
|
341
|
+
export const stk-text-display-regular = {"fontSize":"33px","fontWeight":"400","lineHeight":"1.1"};
|
|
342
|
+
export const stk-text-display-bold = {"fontSize":"33px","fontWeight":"700","lineHeight":"1.1"};
|
|
343
|
+
export const stk-text-title-1-light = {"fontSize":"28px","fontWeight":"300","lineHeight":"1.2"};
|
|
344
|
+
export const stk-text-title-1-regular = {"fontSize":"28px","fontWeight":"400","lineHeight":"1.2"};
|
|
345
|
+
export const stk-text-title-1-bold = {"fontSize":"28px","fontWeight":"700","lineHeight":"1.2"};
|
|
346
|
+
export const stk-text-title-2-light = {"fontSize":"23px","fontWeight":"300","lineHeight":"1.25"};
|
|
347
|
+
export const stk-text-title-2-regular = {"fontSize":"23px","fontWeight":"400","lineHeight":"1.25"};
|
|
348
|
+
export const stk-text-title-2-bold = {"fontSize":"23px","fontWeight":"700","lineHeight":"1.25"};
|
|
349
|
+
export const stk-text-title-3-light = {"fontSize":"19px","fontWeight":"300","lineHeight":"1.3"};
|
|
350
|
+
export const stk-text-title-3-regular = {"fontSize":"19px","fontWeight":"400","lineHeight":"1.3"};
|
|
351
|
+
export const stk-text-title-3-bold = {"fontSize":"19px","fontWeight":"700","lineHeight":"1.3"};
|
|
352
|
+
export const stk-text-title-4-light = {"fontSize":"16px","fontWeight":"300","lineHeight":"1.35"};
|
|
353
|
+
export const stk-text-title-4-regular = {"fontSize":"16px","fontWeight":"400","lineHeight":"1.35"};
|
|
354
|
+
export const stk-text-title-4-bold = {"fontSize":"16px","fontWeight":"700","lineHeight":"1.35"};
|
|
355
|
+
export const stk-text-body-light = {"fontSize":"16px","fontWeight":"300","lineHeight":"1.5"};
|
|
356
|
+
export const stk-text-body-regular = {"fontSize":"16px","fontWeight":"400","lineHeight":"1.5"};
|
|
357
|
+
export const stk-text-body-bold = {"fontSize":"16px","fontWeight":"700","lineHeight":"1.5"};
|
|
358
|
+
export const stk-text-body-sm-light = {"fontSize":"13px","fontWeight":"300","lineHeight":"1.5"};
|
|
359
|
+
export const stk-text-body-sm-regular = {"fontSize":"13px","fontWeight":"400","lineHeight":"1.5"};
|
|
360
|
+
export const stk-text-body-sm-bold = {"fontSize":"13px","fontWeight":"700","lineHeight":"1.5"};
|
|
361
|
+
export const stk-text-label-light = {"fontSize":"13px","fontWeight":"300","lineHeight":"1.4"};
|
|
362
|
+
export const stk-text-label-regular = {"fontSize":"13px","fontWeight":"400","lineHeight":"1.4"};
|
|
363
|
+
export const stk-text-label-bold = {"fontSize":"13px","fontWeight":"700","lineHeight":"1.4"};
|
|
364
|
+
export const stk-text-label-sm-light = {"fontSize":"11px","fontWeight":"300","lineHeight":"1.4"};
|
|
365
|
+
export const stk-text-label-sm-regular = {"fontSize":"11px","fontWeight":"400","lineHeight":"1.4"};
|
|
366
|
+
export const stk-text-label-sm-bold = {"fontSize":"11px","fontWeight":"700","lineHeight":"1.4"};
|
|
367
|
+
export const stk-state-hover = "#cfcfcf";
|
|
368
|
+
export const stk-state-active = "#aaaaaa";
|
|
369
|
+
export const stk-state-selected = "0.12";
|
|
370
|
+
export const stk-state-focus = "#2a69f1";
|
|
371
|
+
export const stk-state-disabled-bg = "#e2e2e2";
|
|
372
|
+
export const stk-state-disabled-text = "#989898";
|
|
373
|
+
export const stk-state-disabled-border = "#bcbcbc";
|
|
374
|
+
export const stk-icon-default = "#363636";
|
|
375
|
+
export const stk-icon-subtle = "#656565";
|
|
376
|
+
export const stk-icon-subtlest = "#878787";
|
|
377
|
+
export const stk-icon-inverse = "#f5f5f5";
|
|
378
|
+
export const stk-icon-brand-1 = "#0542c9";
|
|
379
|
+
export const stk-icon-brand-2 = "#412ecf";
|
|
380
|
+
export const stk-icon-brand-3 = "#6305cc";
|
|
381
|
+
export const stk-icon-success = "#006c0f";
|
|
382
|
+
export const stk-icon-danger = "#ad0000";
|
|
383
|
+
export const stk-icon-alert = "#a40000";
|
|
384
|
+
export const stk-icon-info = "#903400";
|
|
385
|
+
export const stk-icon-news = "#006c0f";
|
|
386
|
+
export const stk-icon-ai = "#00665c";
|
|
387
|
+
export const stk-shadow-color = "0 0 0";
|
|
388
|
+
export const stk-shadow-opacity = "0.08";
|
|
389
|
+
export const stk-shadow-key-xs = "0px 1px 4px 0px";
|
|
390
|
+
export const stk-shadow-key-sm = "0px 2px 8px 0px";
|
|
391
|
+
export const stk-shadow-key-md = "0px 3px 12px 0px";
|
|
392
|
+
export const stk-shadow-key-lg = "0px 4px 16px 0px";
|
|
393
|
+
export const stk-shadow-key-xl = "0px 2px 8px 0px";
|
|
394
|
+
export const stk-shadow-ambient-xs = "0px 2px 8px 0px";
|
|
395
|
+
export const stk-shadow-ambient-sm = "0px 3px 12px 0px";
|
|
396
|
+
export const stk-shadow-ambient-md = "0px 4px 16px 0px";
|
|
397
|
+
export const stk-shadow-ambient-lg = "0px 5px 20px 0px";
|
|
398
|
+
export const stk-shadow-ambient-xl = "0px 6px 24px 0px";
|
|
399
|
+
export const stk-shadow-preset-xs = "surface";
|
|
400
|
+
export const stk-shadow-preset-sm = "non-modal";
|
|
401
|
+
export const stk-shadow-preset-md = "sticky";
|
|
402
|
+
export const stk-shadow-preset-lg = "non-modal-sticky";
|
|
403
|
+
export const stk-shadow-preset-xl = "modal";
|
|
404
|
+
export const stk-layout-container-max-width-sm = "560px";
|
|
405
|
+
export const stk-layout-container-max-width-md = "800px";
|
|
406
|
+
export const stk-layout-container-max-width-lg = "1280px";
|
|
407
|
+
export const stk-layout-container-padding-x = "32px";
|
|
408
|
+
export const stk-layout-container-padding-x-narrow = "16px";
|
|
409
|
+
export const stk-tooltip-bg = "#555555";
|
|
410
|
+
export const stk-tooltip-text = "#f5f5f5";
|
|
411
|
+
export const stk-tooltip-arrow = "#555555";
|
|
412
|
+
export const stk-tooltip-radius = "8px";
|
|
413
|
+
export const stk-tooltip-padding-x = "12px";
|
|
414
|
+
export const stk-tooltip-padding-y = "8px";
|
|
415
|
+
export const stk-tooltip-max-width = "250";
|
|
416
|
+
export const stk-button-sm-spacing-horizontal = "12px";
|
|
417
|
+
export const stk-button-sm-spacing-vertical = "8px";
|
|
418
|
+
export const stk-button-sm-spacing-gap = "8px";
|
|
419
|
+
export const stk-button-sm-radius = "4px";
|
|
420
|
+
export const stk-button-md-spacing-horizontal = "16px";
|
|
421
|
+
export const stk-button-md-spacing-vertical = "8px";
|
|
422
|
+
export const stk-button-md-spacing-gap = "8px";
|
|
423
|
+
export const stk-button-md-radius = "8px";
|
|
424
|
+
export const stk-button-lg-spacing-horizontal = "24px";
|
|
425
|
+
export const stk-button-lg-spacing-vertical = "16px";
|
|
426
|
+
export const stk-button-lg-spacing-gap = "12px";
|
|
427
|
+
export const stk-button-lg-radius = "8px";
|
|
428
|
+
export const stk-button-primary-background-color = "#1956dd";
|
|
429
|
+
export const stk-button-primary-text-color = "#f5f5f5";
|
|
430
|
+
export const stk-button-primary-icon-color = "#f5f5f5";
|
|
431
|
+
export const stk-button-primary-active-background-color = "#0542c9";
|
|
432
|
+
export const stk-button-primary-disabled-background-color = "#e2e2e2";
|
|
433
|
+
export const stk-button-primary-disabled-text-color = "#989898";
|
|
434
|
+
export const stk-button-primary-disabled-icon-color = "#989898";
|
|
435
|
+
export const stk-button-primary-loading-background-color = "#1956dd";
|
|
436
|
+
export const stk-button-ghost-background-color = "#f5f5f5";
|
|
437
|
+
export const stk-button-ghost-text-color = "#363636";
|
|
438
|
+
export const stk-button-ghost-icon-color = "#363636";
|
|
439
|
+
export const stk-button-ghost-active-background-color = "#cfcfcf";
|
|
440
|
+
export const stk-button-ghost-active-press-text-color = "#363636";
|
|
441
|
+
export const stk-button-ghost-active-press-icon-color = "#363636";
|
|
442
|
+
export const stk-button-ghost-disabled-background-color = "#e2e2e2";
|
|
443
|
+
export const stk-button-ghost-disabled-text-color = "#989898";
|
|
444
|
+
export const stk-button-ghost-disabled-icon-color = "#989898";
|
|
445
|
+
export const stk-button-ghost-loading-background-color = "transparent";
|
|
446
|
+
export const stk-button-danger-background-color = "#d71f21";
|
|
447
|
+
export const stk-button-danger-text-color = "#f5f5f5";
|
|
448
|
+
export const stk-button-danger-icon-color = "#f5f5f5";
|
|
449
|
+
export const stk-button-danger-active-background-color = "#ad0000";
|
|
450
|
+
export const stk-button-danger-disabled-background-color = "#e2e2e2";
|
|
451
|
+
export const stk-button-danger-disabled-text-color = "#989898";
|
|
452
|
+
export const stk-button-danger-disabled-icon-color = "#989898";
|
|
453
|
+
export const stk-button-danger-loading-background-color = "#d71f21";
|
|
454
|
+
export const stk-button-hover-overlay-color = "#cfcfcf";
|
|
455
|
+
export const stk-button-press-overlay-color = "#aaaaaa";
|
|
456
|
+
export const stk-button-active-hover-overlay-color = "#cfcfcf";
|
|
457
|
+
export const stk-button-active-press-overlay-color = "#aaaaaa";
|
|
458
|
+
export const stk-radio-button-size = "16px";
|
|
459
|
+
export const stk-radio-button-dot-size = "6";
|
|
460
|
+
export const stk-radio-button-dot-color = "#f5f5f5";
|
|
461
|
+
export const stk-radio-button-border-width = "1.5";
|
|
462
|
+
export const stk-radio-button-border-color-default = "#aaaaaa";
|
|
463
|
+
export const stk-radio-button-border-color-hover = "#878787";
|
|
464
|
+
export const stk-radio-button-bg-default = "#f5f5f5";
|
|
465
|
+
export const stk-radio-button-bg-hover = "#e2e2e2";
|
|
466
|
+
export const stk-radio-button-bg-press = "#cfcfcf";
|
|
467
|
+
export const stk-radio-button-bg-selected = "#1956dd";
|
|
468
|
+
export const stk-radio-button-bg-selected-hover = "#60a3ff";
|
|
469
|
+
export const stk-radio-button-bg-selected-press = "#0542c9";
|
|
470
|
+
export const stk-radio-button-bg-disabled = "#e2e2e2";
|
|
471
|
+
export const stk-radio-button-focus-ring-color = "#2a69f1";
|
|
472
|
+
export const stk-radio-button-label-color = "#363636";
|
|
473
|
+
export const stk-radio-button-label-disabled-color = "#989898";
|
|
474
|
+
export const stk-radio-button-required-color = "#656565";
|
|
475
|
+
export const stk-radio-button-spacing-gap = "8px";
|
|
476
|
+
export const stk-radio-group-spacing-gap = "12px";
|
|
477
|
+
export const stk-radio-group-spacing-item-gap = "8px";
|
|
478
|
+
export const stk-radio-group-spacing-header-gap = "4px";
|
|
479
|
+
export const stk-radio-group-label-color = "#363636";
|
|
480
|
+
export const stk-radio-group-hint-color = "#656565";
|
|
481
|
+
export const stk-radio-group-required-color = "#656565";
|
|
482
|
+
export const stk-text-input-spacing-padding-x = "12px";
|
|
483
|
+
export const stk-text-input-spacing-padding-y = "8px";
|
|
484
|
+
export const stk-text-input-spacing-gap = "4px";
|
|
485
|
+
export const stk-text-input-spacing-label-gap = "4px";
|
|
486
|
+
export const stk-text-input-spacing-inner-gap = "8px";
|
|
487
|
+
export const stk-text-input-spacing-error-gap = "4px";
|
|
488
|
+
export const stk-text-input-border-radius = "8px";
|
|
489
|
+
export const stk-text-input-border-width = "1px";
|
|
490
|
+
export const stk-text-input-border-width-hover = "2px";
|
|
491
|
+
export const stk-text-input-border-width-focus = "2px";
|
|
492
|
+
export const stk-text-input-border-color-default = "#aaaaaa";
|
|
493
|
+
export const stk-text-input-border-color-hover = "#878787";
|
|
494
|
+
export const stk-text-input-border-color-focus = "#2a69f1";
|
|
495
|
+
export const stk-text-input-border-color-error = "#d71f21";
|
|
496
|
+
export const stk-text-input-border-color-disabled = "#bcbcbc";
|
|
497
|
+
export const stk-text-input-bg-default = "#ffffff";
|
|
498
|
+
export const stk-text-input-bg-disabled = "#e2e2e2";
|
|
499
|
+
export const stk-text-input-label-color = "#656565";
|
|
500
|
+
export const stk-text-input-label-disabled-color = "#989898";
|
|
501
|
+
export const stk-text-input-required-color = "#757575";
|
|
502
|
+
export const stk-text-input-text-color = "#363636";
|
|
503
|
+
export const stk-text-input-text-disabled-color = "#989898";
|
|
504
|
+
export const stk-text-input-error-color = "#ad0000";
|
|
505
|
+
export const stk-text-input-error-disabled-color = "#989898";
|
|
506
|
+
export const stk-text-input-icon-color = "#656565";
|
|
507
|
+
export const stk-text-input-icon-disabled-color = "#989898";
|
|
508
|
+
export const stk-text-input-icon-size = "20";
|
|
509
|
+
export const stk-checkbox-size = "16px";
|
|
510
|
+
export const stk-checkbox-check-size = "10";
|
|
511
|
+
export const stk-checkbox-check-color = "#f5f5f5";
|
|
512
|
+
export const stk-checkbox-border-width = "1px";
|
|
513
|
+
export const stk-checkbox-border-color-default = "#aaaaaa";
|
|
514
|
+
export const stk-checkbox-border-color-hover = "#878787";
|
|
515
|
+
export const stk-checkbox-border-color-error = "#d71f21";
|
|
516
|
+
export const stk-checkbox-radius = "2px";
|
|
517
|
+
export const stk-checkbox-bg-default = "#f5f5f5";
|
|
518
|
+
export const stk-checkbox-bg-hover = "#e2e2e2";
|
|
519
|
+
export const stk-checkbox-bg-press = "#cfcfcf";
|
|
520
|
+
export const stk-checkbox-bg-checked = "#1956dd";
|
|
521
|
+
export const stk-checkbox-bg-checked-hover = "#60a3ff";
|
|
522
|
+
export const stk-checkbox-bg-checked-press = "#0542c9";
|
|
523
|
+
export const stk-checkbox-bg-disabled = "#e2e2e2";
|
|
524
|
+
export const stk-checkbox-focus-ring-color = "#2a69f1";
|
|
525
|
+
export const stk-checkbox-label-color = "#363636";
|
|
526
|
+
export const stk-checkbox-label-disabled-color = "#989898";
|
|
527
|
+
export const stk-checkbox-gap = "8px";
|
|
528
|
+
export const stk-checkbox-required-color = "#656565";
|
|
529
|
+
export const stk-badge-status-bg-neutral = "#e2e2e2";
|
|
530
|
+
export const stk-badge-status-bg-brand-1 = "#cff6ff";
|
|
531
|
+
export const stk-badge-status-bg-brand-2 = "#e1efff";
|
|
532
|
+
export const stk-badge-status-bg-brand-3 = "#f8e6ff";
|
|
533
|
+
export const stk-badge-status-bg-success = "#ceffd6";
|
|
534
|
+
export const stk-badge-status-bg-danger = "#ffdace";
|
|
535
|
+
export const stk-badge-status-bg-alert = "#ffe0c3";
|
|
536
|
+
export const stk-badge-status-bg-info = "#ffe9c1";
|
|
537
|
+
export const stk-badge-status-bg-ai = "#cffff9";
|
|
538
|
+
export const stk-badge-status-text-neutral = "#363636";
|
|
539
|
+
export const stk-badge-status-text-brand-1 = "#0542c9";
|
|
540
|
+
export const stk-badge-status-text-brand-2 = "#412ecf";
|
|
541
|
+
export const stk-badge-status-text-brand-3 = "#6305cc";
|
|
542
|
+
export const stk-badge-status-text-success = "#006c0f";
|
|
543
|
+
export const stk-badge-status-text-danger = "#ad0000";
|
|
544
|
+
export const stk-badge-status-text-alert = "#a40000";
|
|
545
|
+
export const stk-badge-status-text-info = "#903400";
|
|
546
|
+
export const stk-badge-status-text-ai = "#00665c";
|
|
547
|
+
export const stk-badge-status-border-color = "#aaaaaa";
|
|
548
|
+
export const stk-badge-status-border-width = "1px";
|
|
549
|
+
export const stk-badge-status-radius = "8px";
|
|
550
|
+
export const stk-badge-status-font-size = "11px";
|
|
551
|
+
export const stk-badge-status-spacing-h = "8px";
|
|
552
|
+
export const stk-badge-status-spacing-v = "4px";
|
|
553
|
+
export const stk-badge-status-spacing-gap = "4px";
|
|
554
|
+
export const stk-badge-status-dot-size = "8px";
|
|
555
|
+
export const stk-spinner-sm-size = "16px";
|
|
556
|
+
export const stk-spinner-sm-stroke-width = "1px";
|
|
557
|
+
export const stk-spinner-md-size = "20";
|
|
558
|
+
export const stk-spinner-md-stroke-width = "2px";
|
|
559
|
+
export const stk-spinner-lg-size = "24px";
|
|
560
|
+
export const stk-spinner-lg-stroke-width = "2px";
|
|
561
|
+
export const stk-spinner-xl-size = "32px";
|
|
562
|
+
export const stk-spinner-xl-stroke-width = "2px";
|
|
563
|
+
export const stk-spinner-track-opacity = "0.2";
|
|
564
|
+
export const stk-spinner-color-default = "#aaaaaa";
|
|
565
|
+
export const stk-spinner-color-brand = "#2a69f1";
|
|
566
|
+
export const stk-spinner-color-success = "#008f37";
|
|
567
|
+
export const stk-spinner-color-danger = "#d71f21";
|
|
568
|
+
export const stk-spinner-color-inverse = "#f5f5f5";
|
|
569
|
+
export const stk-spinner-duration = "500ms";
|
|
570
|
+
export const stk-spinner-easing = "linear";
|
|
571
|
+
export const stk-image-bg = "#f5f5f5";
|
|
572
|
+
export const stk-image-radius = "8px";
|
|
573
|
+
export const stk-image-selection-bg = "#ffffff";
|
|
574
|
+
export const stk-card-bg = "#ffffff";
|
|
575
|
+
export const stk-card-border = "#bcbcbc";
|
|
576
|
+
export const stk-card-radius = "16px";
|
|
577
|
+
export const stk-list-item-bg-default = "#ffffff";
|
|
578
|
+
export const stk-list-item-bg-hover = "#cfcfcf";
|
|
579
|
+
export const stk-list-item-bg-press = "#aaaaaa";
|
|
580
|
+
export const stk-list-item-bg-selected = "0.12";
|
|
581
|
+
export const stk-list-item-bg-disabled = "#e2e2e2";
|
|
582
|
+
export const stk-list-item-text-title = "#363636";
|
|
583
|
+
export const stk-list-item-text-description = "#656565";
|
|
584
|
+
export const stk-list-item-text-disabled = "#989898";
|
|
585
|
+
export const stk-list-item-icon-color = "#363636";
|
|
586
|
+
export const stk-list-item-icon-size = "16px";
|
|
587
|
+
export const stk-list-item-spacing-padding-x = "12px";
|
|
588
|
+
export const stk-list-item-spacing-padding-y = "8px";
|
|
589
|
+
export const stk-list-item-spacing-gap = "8px";
|
|
590
|
+
export const stk-list-item-radius = "4px";
|
|
591
|
+
export const stk-list-item-min-height = "40px";
|