@alfalab/core-components-vars 5.5.1 → 6.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.
Files changed (8) hide show
  1. package/colors-bluetint.css +169 -46
  2. package/colors-indigo.css +169 -68
  3. package/colors-x5.css +4 -0
  4. package/cssm/colors-bluetint.css +169 -46
  5. package/cssm/colors-indigo.css +169 -68
  6. package/cssm/colors-x5.css +4 -0
  7. package/cssm/index.css +169 -68
  8. package/package.json +1 -1
package/colors-bluetint.css CHANGED
@@ -3,34 +3,44 @@
3
3
  --color-dark-bg-attention-muted: #332104;
4
4
  --color-dark-bg-info: #001c3c;
5
5
  --color-dark-bg-negative-muted: #35110d;
6
- --color-dark-bg-neutral: #3a3a3c;
7
6
  --color-dark-bg-opaque: rgba(255, 255, 255, 0.8);
8
7
  --color-dark-bg-overlay: rgba(0, 0, 0, 0.8);
9
8
  --color-dark-bg-positive-muted: #042117;
10
9
  --color-dark-bg-primary: #121212;
11
10
  --color-dark-bg-primary-inverted: #fff;
11
+ --color-dark-bg-quaternary: #3a3a3c;
12
+ --color-dark-bg-quaternary-inverted: #dcdcdd;
12
13
  --color-dark-bg-secondary: #202022;
13
14
  --color-dark-bg-secondary-inverted: #f3f4f5;
14
15
  --color-dark-bg-tertiary: #2c2c2e;
15
16
  --color-dark-bg-tertiary-inverted: #e9e9eb;
16
17
  --color-dark-border-accent: #ef3124;
17
18
  --color-dark-border-key: #fff;
18
- --color-dark-border-key-inverted: #121212;
19
+ --color-dark-border-key-inverted: #000;
20
+ --color-dark-border-link: #0072ef;
19
21
  --color-dark-border-primary: #2b2b2e;
22
+ --color-dark-border-primary-inverted: #dcdcdd;
20
23
  --color-dark-border-secondary: #262629;
21
24
  --color-dark-border-secondary-inverted: #e9e9eb;
22
25
  --color-dark-border-tertiary: #1c1c1e;
23
26
  --color-dark-border-tertiary-inverted: #f3f4f5;
27
+ --color-dark-border-underline: #464649;
28
+ --color-dark-border-underline-inverted: #c5c5c7;
24
29
  --color-dark-graphic-accent: #ef3124;
25
30
  --color-dark-graphic-attention: #f6bf65;
26
31
  --color-dark-graphic-link: #0072ef;
27
32
  --color-dark-graphic-negative: #d91d0b;
28
- --color-dark-graphic-neutral: #2a2a2c;
29
33
  --color-dark-graphic-positive: #2fc26e;
30
34
  --color-dark-graphic-primary: #fff;
31
- --color-dark-graphic-primary-inverted: #121212;
35
+ --color-dark-graphic-primary-inverted: #000;
36
+ --color-dark-graphic-quaternary: #2a2a2c;
37
+ --color-dark-graphic-quaternary-inverted: #dcdcdd;
32
38
  --color-dark-graphic-secondary: #8d8d93;
39
+ --color-dark-graphic-secondary-inverted: #8a8a8e;
33
40
  --color-dark-graphic-tertiary: #464649;
41
+ --color-dark-graphic-tertiary-inverted: #c5c5c7;
42
+ --color-dark-specialbg-component: rgba(255, 255, 255, 0.1);
43
+ --color-dark-specialbg-component-inverted: rgba(0, 0, 0, 0.08);
34
44
  --color-dark-specialbg-nulled: rgba(255, 255, 255, 0);
35
45
  --color-dark-specialbg-overlay-fallback: #070707;
36
46
  --color-dark-specialbg-primary-grouped: #202022;
@@ -39,6 +49,8 @@
39
49
  --color-dark-text-accent: #ef3124;
40
50
  --color-dark-text-attention: #cb830f;
41
51
  --color-dark-text-disabled: #2a2a2c;
52
+ --color-dark-text-disabled-inverted: #dcdcdd;
53
+ --color-dark-text-disabled-inverted-transparent: rgba(60, 60, 67, 0.18);
42
54
  --color-dark-text-disabled-transparent: rgba(235, 235, 245, 0.18);
43
55
  --color-dark-text-link: #0072ef;
44
56
  --color-dark-text-negative: #f15045;
@@ -57,12 +69,13 @@
57
69
  --color-light-bg-attention-muted: #f7ebd9;
58
70
  --color-light-bg-info: #d6e8fc;
59
71
  --color-light-bg-negative-muted: #fbe8e7;
60
- --color-light-bg-neutral: #dcdcdd;
61
72
  --color-light-bg-opaque: rgba(255, 255, 255, 0.8);
62
73
  --color-light-bg-overlay: rgba(0, 0, 0, 0.6);
63
74
  --color-light-bg-positive-muted: #e7f6ef;
64
75
  --color-light-bg-primary: #fff;
65
76
  --color-light-bg-primary-inverted: #121212;
77
+ --color-light-bg-quaternary: #dcdcdd;
78
+ --color-light-bg-quaternary-inverted: #3a3a3c;
66
79
  --color-light-bg-secondary: #f3f4f5;
67
80
  --color-light-bg-secondary-inverted: #202022;
68
81
  --color-light-bg-tertiary: #e9e9eb;
@@ -70,21 +83,30 @@
70
83
  --color-light-border-accent: #ef3124;
71
84
  --color-light-border-key: #000;
72
85
  --color-light-border-key-inverted: #fff;
86
+ --color-light-border-link: #0072ef;
73
87
  --color-light-border-primary: #dcdcdd;
88
+ --color-light-border-primary-inverted: #2b2b2e;
74
89
  --color-light-border-secondary: #e9e9eb;
75
90
  --color-light-border-secondary-inverted: #262629;
76
91
  --color-light-border-tertiary: #f3f4f5;
77
92
  --color-light-border-tertiary-inverted: #1c1c1e;
93
+ --color-light-border-underline: #c5c5c7;
94
+ --color-light-border-underline-inverted: #464649;
78
95
  --color-light-graphic-accent: #ef3124;
79
96
  --color-light-graphic-attention: #f6bf65;
80
97
  --color-light-graphic-link: #0072ef;
81
98
  --color-light-graphic-negative: #f15045;
82
- --color-light-graphic-neutral: #dcdcdd;
83
99
  --color-light-graphic-positive: #2fc26e;
84
100
  --color-light-graphic-primary: #000;
85
101
  --color-light-graphic-primary-inverted: #fff;
102
+ --color-light-graphic-quaternary: #dcdcdd;
103
+ --color-light-graphic-quaternary-inverted: #2a2a2c;
86
104
  --color-light-graphic-secondary: #8a8a8e;
105
+ --color-light-graphic-secondary-inverted: #8d8d93;
87
106
  --color-light-graphic-tertiary: #c5c5c7;
107
+ --color-light-graphic-tertiary-inverted: #464649;
108
+ --color-light-specialbg-component: rgba(0, 0, 0, 0.08);
109
+ --color-light-specialbg-component-inverted: rgba(255, 255, 255, 0.1);
88
110
  --color-light-specialbg-nulled: rgba(255, 255, 255, 0);
89
111
  --color-light-specialbg-overlay-fallback: #5c5c5c;
90
112
  --color-light-specialbg-primary-grouped: #f3f4f5;
@@ -93,6 +115,8 @@
93
115
  --color-light-text-accent: #ef3124;
94
116
  --color-light-text-attention: #cb830f;
95
117
  --color-light-text-disabled: #dcdcdd;
118
+ --color-light-text-disabled-inverted: #2a2a2c;
119
+ --color-light-text-disabled-inverted-transparent: rgba(235, 235, 245, 0.18);
96
120
  --color-light-text-disabled-transparent: rgba(60, 60, 67, 0.18);
97
121
  --color-light-text-link: #0072ef;
98
122
  --color-light-text-negative: #d91d0b;
@@ -108,12 +132,14 @@
108
132
  --color-light-text-tertiary-inverted-transparent: rgba(235, 235, 245, 0.3);
109
133
  --color-light-text-tertiary-transparent: rgba(60, 60, 67, 0.3);
110
134
  --color-static-bg-accent: #ef3124;
111
- --color-static-bg-neutral-dark: #3a3a3c;
112
- --color-static-bg-neutral-light: #dcdcdd;
113
135
  --color-static-bg-primary-dark: #121212;
114
136
  --color-static-bg-primary-light: #fff;
137
+ --color-static-bg-quaternary-dark: #3a3a3c;
138
+ --color-static-bg-quaternary-light: #dcdcdd;
115
139
  --color-static-bg-secondary-dark: #202022;
116
140
  --color-static-bg-secondary-light: #f3f4f5;
141
+ --color-static-bg-tertiary-dark: #2c2c2e;
142
+ --color-static-bg-tertiary-light: #e9e9eb;
117
143
  --color-static-border-accent: #ef3124;
118
144
  --color-static-graphic-accent: #ef3124;
119
145
  --color-static-graphic-dark: #000;
@@ -130,19 +156,18 @@
130
156
  --color-static-text-tertiary-light: #464649;
131
157
  --color-static-text-tertiary-light-transparent: rgba(235, 235, 245, 0.3);
132
158
  --color-dark-bg-accent-alpha-30: rgba(239, 49, 36, 0.3);
159
+ --color-dark-bg-accent-shade-15: rgb(203, 42, 31);
160
+ --color-dark-bg-accent-shade-20: rgb(191, 39, 29);
133
161
  --color-dark-bg-accent-tint-7: rgb(240, 63, 51);
134
162
  --color-dark-bg-accent-tint-10: rgb(241, 70, 58);
135
163
  --color-dark-bg-accent-tint-15: rgb(241, 80, 69);
136
164
  --color-dark-bg-accent-tint-30: rgb(244, 111, 102);
137
- --color-dark-bg-neutral-alpha-30: rgba(58, 58, 60, 0.3);
138
- --color-dark-bg-neutral-tint-7: rgb(72, 72, 74);
139
- --color-dark-bg-neutral-tint-10: rgb(78, 78, 80);
140
- --color-dark-bg-neutral-tint-15: rgb(88, 88, 89);
141
- --color-dark-bg-neutral-tint-30: rgb(117, 117, 119);
142
- --color-dark-bg-neutral-shade-15: rgb(49, 49, 51);
143
165
  --color-dark-bg-primary-alpha-8: rgba(18, 18, 18, 0.08);
166
+ --color-dark-bg-primary-alpha-15: rgba(18, 18, 18, 0.15);
167
+ --color-dark-bg-primary-alpha-20: rgba(18, 18, 18, 0.2);
144
168
  --color-dark-bg-primary-alpha-40: rgba(18, 18, 18, 0.4);
145
169
  --color-dark-bg-primary-inverted-alpha-3: rgba(255, 255, 255, 0.03);
170
+ --color-dark-bg-primary-inverted-alpha-5: rgba(255, 255, 255, 0.05);
146
171
  --color-dark-bg-primary-inverted-alpha-7: rgba(255, 255, 255, 0.07);
147
172
  --color-dark-bg-primary-inverted-alpha-10: rgba(255, 255, 255, 0.1);
148
173
  --color-dark-bg-primary-inverted-alpha-15: rgba(255, 255, 255, 0.15);
@@ -150,42 +175,86 @@
150
175
  --color-dark-bg-primary-inverted-alpha-30: rgba(255, 255, 255, 0.3);
151
176
  --color-dark-bg-primary-inverted-alpha-40: rgba(255, 255, 255, 0.4);
152
177
  --color-dark-bg-primary-inverted-alpha-50: rgba(255, 255, 255, 0.5);
153
- --color-dark-bg-primary-inverted-alpha-60: rgba(255, 255, 255, 0.6);
154
- --color-dark-bg-primary-inverted-alpha-80: rgba(255, 255, 255, 0.8);
155
- --color-dark-bg-primary-inverted-shade-7: rgb(237, 237, 237);
156
178
  --color-dark-bg-primary-inverted-shade-15: rgb(217, 217, 217);
157
179
  --color-dark-bg-primary-inverted-shade-20: rgb(204, 204, 204);
180
+ --color-dark-bg-quaternary-alpha-30: rgba(58, 58, 60, 0.3);
181
+ --color-dark-bg-quaternary-tint-7: rgb(72, 72, 74);
182
+ --color-dark-bg-quaternary-tint-10: rgb(78, 78, 80);
183
+ --color-dark-bg-quaternary-tint-15: rgb(88, 88, 89);
184
+ --color-dark-bg-quaternary-tint-30: rgb(117, 117, 119);
185
+ --color-dark-bg-quaternary-inverted-alpha-30: rgba(220, 220, 221, 0.3);
186
+ --color-dark-bg-quaternary-inverted-shade-15: rgb(187, 187, 188);
187
+ --color-dark-bg-quaternary-inverted-shade-20: rgb(176, 176, 177);
158
188
  --color-dark-bg-secondary-alpha-30: rgba(32, 32, 34, 0.3);
189
+ --color-dark-bg-secondary-shade-15: rgb(27, 27, 29);
190
+ --color-dark-bg-secondary-shade-20: rgb(26, 26, 27);
159
191
  --color-dark-bg-secondary-tint-7: rgb(48, 48, 49);
160
192
  --color-dark-bg-secondary-tint-15: rgb(65, 65, 67);
161
- --color-dark-bg-secondary-inverted-alpha-7: rgba(243, 244, 245, 0.07);
162
- --color-dark-bg-secondary-inverted-alpha-15: rgba(243, 244, 245, 0.15);
163
193
  --color-dark-bg-secondary-inverted-alpha-30: rgba(243, 244, 245, 0.3);
164
- --color-dark-bg-secondary-inverted-shade-7: rgb(226, 227, 228);
165
194
  --color-dark-bg-secondary-inverted-shade-15: rgb(207, 207, 208);
166
195
  --color-dark-bg-secondary-inverted-shade-20: rgb(194, 195, 196);
196
+ --color-dark-bg-secondary-inverted-tint-7: rgb(244, 245, 246);
197
+ --color-dark-bg-secondary-inverted-tint-15: rgb(245, 246, 246);
167
198
  --color-dark-bg-tertiary-tint-7: rgb(59, 59, 61);
168
- --color-dark-border-tertiary-inverted-alpha-30: rgba(243, 244, 245, 0.3);
199
+ --color-dark-border-underline-alpha-30: rgba(70, 70, 73, 0.3);
200
+ --color-dark-border-underline-inverted-alpha-30: rgba(197, 197, 199, 0.3);
169
201
  --color-dark-graphic-accent-alpha-30: rgba(239, 49, 36, 0.3);
170
202
  --color-dark-graphic-accent-shade-15: rgb(203, 42, 31);
171
203
  --color-dark-graphic-accent-tint-10: rgb(241, 70, 58);
172
204
  --color-dark-graphic-accent-tint-30: rgb(244, 111, 102);
205
+ --color-dark-graphic-negative-alpha-30: rgba(217, 29, 11, 0.3);
206
+ --color-dark-graphic-negative-shade-20: rgb(174, 23, 9);
173
207
  --color-dark-graphic-negative-shade-30: rgb(152, 20, 8);
174
- --color-dark-graphic-negative-shade-50: rgb(109, 15, 6);
175
- --color-dark-graphic-neutral-tint-10: rgb(63, 63, 65);
208
+ --color-dark-graphic-negative-tint-7: rgb(220, 45, 28);
209
+ --color-dark-graphic-negative-tint-15: rgb(223, 63, 48);
210
+ --color-dark-graphic-negative-tint-30: rgb(228, 97, 84);
176
211
  --color-dark-graphic-positive-tint-10: rgb(68, 200, 125);
177
212
  --color-dark-graphic-positive-tint-30: rgb(109, 212, 154);
178
213
  --color-dark-graphic-primary-alpha-30: rgba(255, 255, 255, 0.3);
179
214
  --color-dark-graphic-primary-alpha-40: rgba(255, 255, 255, 0.4);
180
215
  --color-dark-graphic-primary-alpha-50: rgba(255, 255, 255, 0.5);
216
+ --color-dark-graphic-primary-alpha-60: rgba(255, 255, 255, 0.6);
181
217
  --color-dark-graphic-primary-shade-15: rgb(217, 217, 217);
218
+ --color-dark-graphic-primary-shade-20: rgb(204, 204, 204);
182
219
  --color-dark-graphic-primary-shade-30: rgb(179, 179, 179);
183
- --color-dark-graphic-primary-shade-50: rgb(128, 128, 128);
184
220
  --color-dark-graphic-primary-tint-10: rgb(255, 255, 255);
185
221
  --color-dark-graphic-primary-tint-30: rgb(255, 255, 255);
222
+ --color-dark-graphic-primary-inverted-alpha-30: rgba(0, 0, 0, 0.3);
223
+ --color-dark-graphic-primary-inverted-alpha-40: rgba(0, 0, 0, 0.4);
224
+ --color-dark-graphic-primary-inverted-alpha-50: rgba(0, 0, 0, 0.5);
225
+ --color-dark-graphic-primary-inverted-alpha-60: rgba(0, 0, 0, 0.6);
226
+ --color-dark-graphic-primary-inverted-tint-7: rgb(18, 18, 18);
227
+ --color-dark-graphic-primary-inverted-tint-10: rgb(26, 26, 26);
228
+ --color-dark-graphic-primary-inverted-tint-15: rgb(38, 38, 38);
229
+ --color-dark-graphic-primary-inverted-tint-30: rgb(77, 77, 77);
230
+ --color-dark-graphic-quaternary-tint-10: rgb(63, 63, 65);
186
231
  --color-dark-graphic-secondary-alpha-30: rgba(141, 141, 147, 0.3);
187
232
  --color-dark-graphic-secondary-tint-30: rgb(175, 175, 179);
188
233
  --color-dark-graphic-secondary-tint-50: rgb(198, 198, 201);
234
+ --color-dark-graphic-secondary-inverted-alpha-30: rgba(138, 138, 142, 0.3);
235
+ --color-dark-graphic-secondary-inverted-shade-15: rgb(117, 117, 121);
236
+ --color-dark-graphic-secondary-inverted-shade-20: rgb(110, 110, 114);
237
+ --color-dark-graphic-secondary-inverted-tint-10: rgb(150, 150, 153);
238
+ --color-dark-graphic-secondary-inverted-tint-30: rgb(173, 173, 176);
239
+ --color-dark-graphic-tertiary-alpha-30: rgba(70, 70, 73, 0.3);
240
+ --color-dark-graphic-tertiary-shade-15: rgb(60, 60, 62);
241
+ --color-dark-graphic-tertiary-shade-20: rgb(56, 56, 58);
242
+ --color-dark-graphic-tertiary-tint-7: rgb(83, 83, 86);
243
+ --color-dark-graphic-tertiary-tint-15: rgb(98, 98, 100);
244
+ --color-dark-graphic-tertiary-inverted-alpha-30: rgba(197, 197, 199, 0.3);
245
+ --color-dark-graphic-tertiary-inverted-shade-15: rgb(167, 167, 169);
246
+ --color-dark-graphic-tertiary-inverted-shade-20: rgb(158, 158, 159);
247
+ --color-dark-specialbg-component-tint-7: rgba(255, 255, 255, 0.163);
248
+ --color-dark-specialbg-component-tint-10: rgba(255, 255, 255, 0.19);
249
+ --color-dark-specialbg-component-tint-15: rgba(255, 255, 255, 0.235);
250
+ --color-dark-specialbg-component-tint-30: rgba(255, 255, 255, 0.37);
251
+ --color-dark-specialbg-component-alpha-2: rgba(255, 255, 255, 0.02);
252
+ --color-dark-specialbg-component-alpha-14: rgba(255, 255, 255, 0.14);
253
+ --color-dark-specialbg-component-alpha-23: rgba(255, 255, 255, 0.23);
254
+ --color-dark-specialbg-component-alpha-30: rgba(255, 255, 255, 0.3);
255
+ --color-dark-specialbg-component-inverted-alpha-30: rgba(0, 0, 0, 0.3);
256
+ --color-dark-specialbg-component-inverted-shade-15: rgba(0, 0, 0, 0.218);
257
+ --color-dark-specialbg-component-inverted-shade-20: rgba(0, 0, 0, 0.264);
189
258
  --color-dark-text-link-shade-30: rgb(0, 80, 167);
190
259
  --color-dark-text-link-shade-50: rgb(0, 57, 120);
191
260
  --color-dark-text-link-tint-20: rgb(51, 142, 242);
@@ -195,29 +264,33 @@
195
264
  --color-dark-text-primary-shade-50: rgb(128, 128, 128);
196
265
  --color-dark-text-primary-tint-20: rgb(255, 255, 255);
197
266
  --color-dark-text-primary-tint-40: rgb(255, 255, 255);
267
+ --color-dark-text-primary-inverted-alpha-30: rgba(0, 0, 0, 0.3);
198
268
  --color-dark-text-primary-inverted-alpha-40: rgba(0, 0, 0, 0.4);
269
+ --color-dark-text-primary-inverted-shade-20: rgb(0, 0, 0);
199
270
  --color-dark-text-primary-inverted-shade-30: rgb(0, 0, 0);
200
- --color-dark-text-primary-inverted-shade-50: rgb(0, 0, 0);
271
+ --color-dark-text-primary-inverted-tint-7: rgb(18, 18, 18);
272
+ --color-dark-text-primary-inverted-tint-15: rgb(38, 38, 38);
273
+ --color-dark-text-primary-inverted-tint-30: rgb(77, 77, 77);
274
+ --color-dark-text-primary-inverted-tint-50: rgb(128, 128, 128);
275
+ --color-dark-text-secondary-shade-20: rgb(113, 113, 118);
201
276
  --color-dark-text-secondary-shade-30: rgb(99, 99, 103);
202
- --color-dark-text-secondary-shade-50: rgb(71, 71, 74);
203
277
  --color-dark-text-secondary-tint-20: rgb(164, 164, 169);
204
278
  --color-dark-text-secondary-tint-40: rgb(187, 187, 190);
279
+ --color-dark-text-secondary-inverted-shade-20: rgb(110, 110, 114);
205
280
  --color-dark-text-secondary-inverted-shade-30: rgb(97, 97, 99);
206
- --color-dark-text-secondary-inverted-shade-50: rgb(69, 69, 71);
207
281
  --color-light-bg-accent-alpha-30: rgba(239, 49, 36, 0.3);
282
+ --color-light-bg-accent-tint-15: rgb(241, 80, 69);
283
+ --color-light-bg-accent-tint-20: rgb(242, 90, 80);
208
284
  --color-light-bg-accent-shade-7: rgb(222, 46, 33);
209
285
  --color-light-bg-accent-shade-10: rgb(215, 44, 32);
210
286
  --color-light-bg-accent-shade-15: rgb(203, 42, 31);
211
287
  --color-light-bg-accent-shade-30: rgb(167, 34, 25);
212
- --color-light-bg-neutral-alpha-30: rgba(220, 220, 221, 0.3);
213
- --color-light-bg-neutral-shade-7: rgb(205, 205, 206);
214
- --color-light-bg-neutral-shade-10: rgb(198, 198, 199);
215
- --color-light-bg-neutral-shade-15: rgb(187, 187, 188);
216
- --color-light-bg-neutral-shade-30: rgb(154, 154, 155);
217
- --color-light-bg-neutral-tint-15: rgb(225, 225, 226);
218
288
  --color-light-bg-primary-alpha-8: rgba(255, 255, 255, 0.08);
289
+ --color-light-bg-primary-alpha-15: rgba(255, 255, 255, 0.15);
290
+ --color-light-bg-primary-alpha-20: rgba(255, 255, 255, 0.2);
219
291
  --color-light-bg-primary-alpha-40: rgba(255, 255, 255, 0.4);
220
292
  --color-light-bg-primary-inverted-alpha-3: rgba(18, 18, 18, 0.03);
293
+ --color-light-bg-primary-inverted-alpha-5: rgba(18, 18, 18, 0.05);
221
294
  --color-light-bg-primary-inverted-alpha-7: rgba(18, 18, 18, 0.07);
222
295
  --color-light-bg-primary-inverted-alpha-10: rgba(18, 18, 18, 0.1);
223
296
  --color-light-bg-primary-inverted-alpha-15: rgba(18, 18, 18, 0.15);
@@ -225,42 +298,86 @@
225
298
  --color-light-bg-primary-inverted-alpha-30: rgba(18, 18, 18, 0.3);
226
299
  --color-light-bg-primary-inverted-alpha-40: rgba(18, 18, 18, 0.4);
227
300
  --color-light-bg-primary-inverted-alpha-50: rgba(18, 18, 18, 0.5);
228
- --color-light-bg-primary-inverted-alpha-60: rgba(18, 18, 18, 0.6);
229
- --color-light-bg-primary-inverted-alpha-80: rgba(18, 18, 18, 0.8);
230
- --color-light-bg-primary-inverted-tint-7: rgb(35, 35, 35);
231
301
  --color-light-bg-primary-inverted-tint-15: rgb(54, 54, 54);
232
302
  --color-light-bg-primary-inverted-tint-20: rgb(65, 65, 65);
303
+ --color-light-bg-quaternary-alpha-30: rgba(220, 220, 221, 0.3);
304
+ --color-light-bg-quaternary-shade-7: rgb(205, 205, 206);
305
+ --color-light-bg-quaternary-shade-10: rgb(198, 198, 199);
306
+ --color-light-bg-quaternary-shade-15: rgb(187, 187, 188);
307
+ --color-light-bg-quaternary-shade-30: rgb(154, 154, 155);
308
+ --color-light-bg-quaternary-inverted-alpha-30: rgba(58, 58, 60, 0.3);
309
+ --color-light-bg-quaternary-inverted-tint-15: rgb(88, 88, 89);
310
+ --color-light-bg-quaternary-inverted-tint-20: rgb(97, 97, 99);
233
311
  --color-light-bg-secondary-alpha-30: rgba(243, 244, 245, 0.3);
312
+ --color-light-bg-secondary-tint-15: rgb(245, 246, 246);
313
+ --color-light-bg-secondary-tint-20: rgb(245, 246, 247);
234
314
  --color-light-bg-secondary-shade-7: rgb(226, 227, 228);
235
315
  --color-light-bg-secondary-shade-15: rgb(207, 207, 208);
236
- --color-light-bg-secondary-inverted-alpha-7: rgba(32, 32, 34, 0.07);
237
- --color-light-bg-secondary-inverted-alpha-15: rgba(32, 32, 34, 0.15);
238
316
  --color-light-bg-secondary-inverted-alpha-30: rgba(32, 32, 34, 0.3);
239
- --color-light-bg-secondary-inverted-tint-7: rgb(48, 48, 49);
240
317
  --color-light-bg-secondary-inverted-tint-15: rgb(65, 65, 67);
241
318
  --color-light-bg-secondary-inverted-tint-20: rgb(77, 77, 78);
319
+ --color-light-bg-secondary-inverted-shade-7: rgb(30, 30, 32);
320
+ --color-light-bg-secondary-inverted-shade-15: rgb(27, 27, 29);
242
321
  --color-light-bg-tertiary-shade-7: rgb(217, 217, 219);
243
- --color-light-border-tertiary-inverted-alpha-30: rgba(28, 28, 30, 0.3);
322
+ --color-light-border-underline-alpha-30: rgba(197, 197, 199, 0.3);
323
+ --color-light-border-underline-inverted-alpha-30: rgba(70, 70, 73, 0.3);
244
324
  --color-light-graphic-accent-alpha-30: rgba(239, 49, 36, 0.3);
245
325
  --color-light-graphic-accent-tint-15: rgb(241, 80, 69);
246
326
  --color-light-graphic-accent-shade-10: rgb(215, 44, 32);
247
327
  --color-light-graphic-accent-shade-30: rgb(167, 34, 25);
328
+ --color-light-graphic-negative-alpha-30: rgba(241, 80, 69, 0.3);
329
+ --color-light-graphic-negative-tint-20: rgb(244, 115, 106);
248
330
  --color-light-graphic-negative-tint-30: rgb(245, 133, 125);
249
- --color-light-graphic-negative-tint-50: rgb(248, 168, 162);
250
- --color-light-graphic-neutral-shade-10: rgb(198, 198, 199);
331
+ --color-light-graphic-negative-shade-7: rgb(224, 74, 64);
332
+ --color-light-graphic-negative-shade-15: rgb(205, 68, 59);
333
+ --color-light-graphic-negative-shade-30: rgb(169, 56, 48);
251
334
  --color-light-graphic-positive-shade-10: rgb(42, 175, 99);
252
335
  --color-light-graphic-positive-shade-30: rgb(33, 136, 77);
253
336
  --color-light-graphic-primary-alpha-30: rgba(0, 0, 0, 0.3);
254
337
  --color-light-graphic-primary-alpha-40: rgba(0, 0, 0, 0.4);
255
338
  --color-light-graphic-primary-alpha-50: rgba(0, 0, 0, 0.5);
339
+ --color-light-graphic-primary-alpha-60: rgba(0, 0, 0, 0.6);
256
340
  --color-light-graphic-primary-tint-15: rgb(38, 38, 38);
341
+ --color-light-graphic-primary-tint-20: rgb(51, 51, 51);
257
342
  --color-light-graphic-primary-tint-30: rgb(77, 77, 77);
258
- --color-light-graphic-primary-tint-50: rgb(128, 128, 128);
259
343
  --color-light-graphic-primary-shade-10: rgb(0, 0, 0);
260
344
  --color-light-graphic-primary-shade-30: rgb(0, 0, 0);
345
+ --color-light-graphic-primary-inverted-alpha-30: rgba(255, 255, 255, 0.3);
346
+ --color-light-graphic-primary-inverted-alpha-40: rgba(255, 255, 255, 0.4);
347
+ --color-light-graphic-primary-inverted-alpha-50: rgba(255, 255, 255, 0.5);
348
+ --color-light-graphic-primary-inverted-alpha-60: rgba(255, 255, 255, 0.6);
349
+ --color-light-graphic-primary-inverted-shade-7: rgb(237, 237, 237);
350
+ --color-light-graphic-primary-inverted-shade-10: rgb(230, 230, 230);
351
+ --color-light-graphic-primary-inverted-shade-15: rgb(217, 217, 217);
352
+ --color-light-graphic-primary-inverted-shade-30: rgb(179, 179, 179);
353
+ --color-light-graphic-quaternary-shade-10: rgb(198, 198, 199);
261
354
  --color-light-graphic-secondary-alpha-30: rgba(138, 138, 142, 0.3);
262
355
  --color-light-graphic-secondary-shade-30: rgb(97, 97, 99);
263
356
  --color-light-graphic-secondary-shade-50: rgb(69, 69, 71);
357
+ --color-light-graphic-secondary-inverted-alpha-30: rgba(141, 141, 147, 0.3);
358
+ --color-light-graphic-secondary-inverted-tint-15: rgb(158, 158, 163);
359
+ --color-light-graphic-secondary-inverted-tint-20: rgb(164, 164, 169);
360
+ --color-light-graphic-secondary-inverted-shade-10: rgb(127, 127, 132);
361
+ --color-light-graphic-secondary-inverted-shade-30: rgb(99, 99, 103);
362
+ --color-light-graphic-tertiary-alpha-30: rgba(197, 197, 199, 0.3);
363
+ --color-light-graphic-tertiary-tint-15: rgb(206, 206, 207);
364
+ --color-light-graphic-tertiary-tint-20: rgb(209, 209, 210);
365
+ --color-light-graphic-tertiary-shade-7: rgb(183, 183, 185);
366
+ --color-light-graphic-tertiary-shade-15: rgb(167, 167, 169);
367
+ --color-light-graphic-tertiary-inverted-alpha-30: rgba(70, 70, 73, 0.3);
368
+ --color-light-graphic-tertiary-inverted-tint-15: rgb(98, 98, 100);
369
+ --color-light-graphic-tertiary-inverted-tint-20: rgb(107, 107, 109);
370
+ --color-light-specialbg-component-shade-7: rgba(0, 0, 0, 0.1444);
371
+ --color-light-specialbg-component-shade-10: rgba(0, 0, 0, 0.172);
372
+ --color-light-specialbg-component-shade-15: rgba(0, 0, 0, 0.218);
373
+ --color-light-specialbg-component-shade-30: rgba(0, 0, 0, 0.356);
374
+ --color-light-specialbg-component-alpha-2: rgba(0, 0, 0, 0.02);
375
+ --color-light-specialbg-component-alpha-14: rgba(0, 0, 0, 0.14);
376
+ --color-light-specialbg-component-alpha-23: rgba(0, 0, 0, 0.23);
377
+ --color-light-specialbg-component-alpha-30: rgba(0, 0, 0, 0.3);
378
+ --color-light-specialbg-component-inverted-alpha-30: rgba(255, 255, 255, 0.3);
379
+ --color-light-specialbg-component-inverted-tint-15: rgba(255, 255, 255, 0.235);
380
+ --color-light-specialbg-component-inverted-tint-20: rgba(255, 255, 255, 0.28);
264
381
  --color-light-text-link-tint-30: rgb(77, 156, 244);
265
382
  --color-light-text-link-tint-50: rgb(128, 185, 247);
266
383
  --color-light-text-link-shade-20: rgb(0, 91, 191);
@@ -270,15 +387,21 @@
270
387
  --color-light-text-primary-tint-50: rgb(128, 128, 128);
271
388
  --color-light-text-primary-shade-20: rgb(0, 0, 0);
272
389
  --color-light-text-primary-shade-40: rgb(0, 0, 0);
390
+ --color-light-text-primary-inverted-alpha-30: rgba(255, 255, 255, 0.3);
273
391
  --color-light-text-primary-inverted-alpha-40: rgba(255, 255, 255, 0.4);
392
+ --color-light-text-primary-inverted-tint-20: rgb(255, 255, 255);
274
393
  --color-light-text-primary-inverted-tint-30: rgb(255, 255, 255);
275
- --color-light-text-primary-inverted-tint-50: rgb(255, 255, 255);
394
+ --color-light-text-primary-inverted-shade-7: rgb(237, 237, 237);
395
+ --color-light-text-primary-inverted-shade-15: rgb(217, 217, 217);
396
+ --color-light-text-primary-inverted-shade-30: rgb(179, 179, 179);
397
+ --color-light-text-primary-inverted-shade-50: rgb(128, 128, 128);
398
+ --color-light-text-secondary-tint-20: rgb(161, 161, 165);
276
399
  --color-light-text-secondary-tint-30: rgb(173, 173, 176);
277
- --color-light-text-secondary-tint-50: rgb(197, 197, 199);
278
400
  --color-light-text-secondary-shade-20: rgb(110, 110, 114);
279
401
  --color-light-text-secondary-shade-40: rgb(83, 83, 85);
402
+ --color-light-text-secondary-inverted-tint-20: rgb(164, 164, 169);
280
403
  --color-light-text-secondary-inverted-tint-30: rgb(175, 175, 179);
281
- --color-light-text-secondary-inverted-tint-50: rgb(198, 198, 201);
282
404
  --color-static-bg-primary-dark-alpha-10: rgba(18, 18, 18, 0.1);
283
405
  --color-static-bg-primary-dark-alpha-20: rgba(18, 18, 18, 0.2);
406
+ --color-static-text-primary-light-alpha-30: rgba(255, 255, 255, 0.3);
284
407
  }