@v1nt1248/3nclient-lib 0.1.3 → 0.1.5

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 (2) hide show
  1. package/dist/variables.css +744 -0
  2. package/package.json +9 -6
@@ -0,0 +1,744 @@
1
+ :root {
2
+ --spacing-xs: 4px;
3
+ --spacing-s: 8px;
4
+ --spacing-m: 16px;
5
+ --spacing-ml: 24px;
6
+ --spacing-l: 32px;
7
+ --spacing-xl: 40px;
8
+ --spacing-xxl: 48px;
9
+ --white-0: #fff;
10
+ --white-inf: rgba(255, 255, 255, 0);
11
+ --red-0: #feeeed;
12
+ --red-5: #fcd9d6;
13
+ --red-10: #fbc3bf;
14
+ --red-15: #f9aea8;
15
+ --red-20: #f89891;
16
+ --red-30: #f56d64;
17
+ --red-40: #f24236;
18
+ --red-50: #ef2008;
19
+ --red-60: #c01a06;
20
+ --red-70: #901305;
21
+ --red-80: #710f04;
22
+ --red-85: #550502;
23
+ --red-90: #410301;
24
+ --red-95: #320201;
25
+ --red-100: #240100;
26
+ --orange-0: #fffefe;
27
+ --orange-5: #ffefe9;
28
+ --orange-10: #ffdfd3;
29
+ --orange-15: #ffd0be;
30
+ --orange-20: #ffc0a8;
31
+ --orange-30: #ffa27e;
32
+ --orange-40: #ff8353;
33
+ --orange-50: #ff6428;
34
+ --orange-60: #dc5520;
35
+ --orange-70: #b94518;
36
+ --orenge-80: #973610;
37
+ --orange-85: #852e0c;
38
+ --orange-90: #742608;
39
+ --orange-95: #621f04;
40
+ --orange-100: #511700;
41
+ --blue-0: #fafcff;
42
+ --blue-5: #e3edfd;
43
+ --blue-10: #ccdefb;
44
+ --blue-15: #b7d0f7;
45
+ --blue-20: #a2c2f3;
46
+ --blue-30: #7aa6e9;
47
+ --blue-40: #578bda;
48
+ --blue-50: #3771c8;
49
+ --blue-60: #2651a6;
50
+ --blue-70: #153a84;
51
+ --blue-80: #0f337b;
52
+ --blue-85: #0c2964;
53
+ --blue-90: #081e49;
54
+ --blue-95: #05183d;
55
+ --blue-100: #040f25;
56
+ --emerald-0: #f7fdfc;
57
+ --emerald-5: #e3f4f1;
58
+ --emerald-10: #ceeae5;
59
+ --emerald-15: #bae1d9;
60
+ --emerald-20: #a6d8ce;
61
+ --emerald-30: #7dc5b7;
62
+ --emerald-40: #55b3a0;
63
+ --emerald-50: #2ca089;
64
+ --emerald-60: #23806e;
65
+ --emerald-70: #1a6052;
66
+ --emerald-80: #124037;
67
+ --emerald-85: #0d3029;
68
+ --emerald-90: #042520;
69
+ --emerald-95: #031c18;
70
+ --emerald-100: #021714;
71
+ --grey-0: #fcfcfd;
72
+ --grey-5: #eff0f1;
73
+ --grey-10: #e1e3e6;
74
+ --grey-15: #d4d6da;
75
+ --grey-20: #c6cacf;
76
+ --grey-30: #abb0b8;
77
+ --grey-40: #9197a0;
78
+ --grey-50: #777e88;
79
+ --grey-60: #5f646d;
80
+ --grey-70: #464a53;
81
+ --grey-80: #3f434a;
82
+ --grey-85: #35373b;
83
+ --grey-90: #27282b;
84
+ --grey-95: #1f2023;
85
+ --grey-100: #131415;
86
+ --files-darker: rgba(0, 0, 0, 0.5);
87
+ --files-darker-light: rgba(0, 0, 0, 0.3);
88
+ --files-word-primary: #0078d4;
89
+ --files-word-secondary: #a7d7f9;
90
+ --files-excel-primary: #107c41;
91
+ --files-excel-secondary: #86e4b8;
92
+ --files-pdf-primary: #f20f00;
93
+ --files-pdf-secondary: #fdc7c3;
94
+ --files-image-primary: #4744e4;
95
+ --files-image-secondary: #c9c8ff;
96
+ --font-6: 6px;
97
+ --font-8: 8px;
98
+ --font-9: 9px;
99
+ --font-10: 10px;
100
+ --font-11: 11px;
101
+ --font-12: 12px;
102
+ --font-13: 13px;
103
+ --font-14: 14px;
104
+ --font-16: 16px;
105
+ --font-18: 18px;
106
+ --font-20: 20px;
107
+ --font-24: 24px;
108
+ --font-32: 32px;
109
+ }
110
+
111
+ .default-theme {
112
+ --default-fill-default: var(--white-0);
113
+ --default-fill-hover: var(--grey-10);
114
+ --default-fill-focused: var(--white-0);
115
+ --default-fill-pressed: var(--grey-20);
116
+ --default-fill-disabled: var(--white-0);
117
+ --default-content-default: var(--grey-95);
118
+ --default-content-hover: var(--grey-95);
119
+ --default-content-focused: var(--grey-95);
120
+ --default-content-pressed: var(--grey-95);
121
+ --default-content-disabled: var(--grey-30);
122
+ --default-hint-default: var(--grey-30);
123
+ --default-hint-hover: var(--grey-30);
124
+ --default-hint-focused: var(--grey-30);
125
+ --default-hint-pressed: var(--grey-30);
126
+ --default-hint-disabled: var(--grey-15);
127
+ --default-outline-default: var(--grey-5);
128
+ --default-outline-hover: var(--grey-10);
129
+ --default-outline-focused: var(--grey-50);
130
+ --default-outline-pressed: var(--grey-10);
131
+ --default-outline-disabled: var(--grey-5);
132
+ --default-outline-ghost: var(--white-0);
133
+ --s-default-fill-default: var(--grey-5);
134
+ --s-default-fill-hover: var(--grey-15);
135
+ --s-default-fill-focused: var(--grey-0);
136
+ --s-default-fill-pressed: var(--grey-30);
137
+ --s-default-fill-disabled: var(--grey-5);
138
+ --s-default-content-default: var(--grey-95);
139
+ --s-default-content-hover: var(--grey-95);
140
+ --s-default-content-focused: var(--grey-95);
141
+ --s-default-content-pressed: var(--grey-95);
142
+ --s-default-content-disabled: var(--grey-30);
143
+ --s-default-outline-default: var(--grey-10);
144
+ --s-default-outline-hover: var(--grey-15);
145
+ --s-default-outline-focused: var(--grey-50);
146
+ --s-default-outline-pressed: var(--grey-15);
147
+ --s-default-outline-disabled: var(--grey-10);
148
+ --accent-fill-default: var(--blue-50);
149
+ --accent-fill-hover: var(--blue-60);
150
+ --accent-fill-focused: var(--blue-50);
151
+ --accent-fill-pressed: var(--blue-70);
152
+ --accent-fill-disabled: var(--blue-30);
153
+ --accent-fill-selected: var(--blue-50);
154
+ --accent-fill-unselected: var(--blue-30);
155
+ --accent-doublefill-default: var(--blue-60);
156
+ --accent-doublefill-hover: var(--blue-70);
157
+ --accent-doublefill-focused: var(--blue-60);
158
+ --accent-doublefill-pressed: var(--blue-80);
159
+ --accent-doublefill-disabled: var(--blue-40);
160
+ --accent-doublefill-selected: var(--blue-60);
161
+ --accent-doublefill-unselected: var(--blue-40);
162
+ --accent-content-default: var(--blue-0);
163
+ --accent-content-hover: var(--blue-0);
164
+ --accent-content-focused: var(--blue-0);
165
+ --accent-content-pressed: var(--blue-5);
166
+ --accent-content-disabled: var(--blue-0);
167
+ --accent-content-selected: var(--blue-0);
168
+ --accent-content-unselected: var(--blue-0);
169
+ --accent-outline-default: var(--blue-50);
170
+ --accent-outline-hover: var(--blue-60);
171
+ --accent-outline-focused: var(--blue-70);
172
+ --accent-outline-pressed: var(--blue-70);
173
+ --accent-outline-disabled: var(--blue-10);
174
+ --accent-outline-ghost: var(--white-inf);
175
+ --s-accent-fill-default: var(--white-0);
176
+ --s-accent-fill-hover: var(--blue-10);
177
+ --s-accent-fill-focused: var(--white-0);
178
+ --s-accent-fill-pressed: var(--blue-20);
179
+ --s-accent-fill-disabled: var(--blue-0);
180
+ --s-accent-content-default: var(--blue-50);
181
+ --s-accent-content-hover: var(--blue-50);
182
+ --s-accent-content-focused: var(--blue-50);
183
+ --s-accent-content-pressed: var(--blue-60);
184
+ --s-accent-content-disabled: var(--blue-20);
185
+ --s-accent-content-selected: var(--blue-50);
186
+ --s-accent-content-unselected: var(--blue-30);
187
+ --s-accent-outline-default: var(--blue-5);
188
+ --s-accent-outline-hover: var(--blue-10);
189
+ --s-accent-outline-focused: var(--blue-10);
190
+ --s-accent-outline-pressed: var(--blue-15);
191
+ --s-accent-outline-disabled: var(--blue-0);
192
+ --warning-fill-default: var(--orange-5);
193
+ --warning-fill-hover: var(--orange-15);
194
+ --warning-fill-focused: var(--orange-5);
195
+ --warning-fill-pressed: var(--orange-20);
196
+ --warning-fill-disabled: var(--orange-0);
197
+ --warning-content-default: var(--orange-50);
198
+ --warning-content-hover: var(--orange-50);
199
+ --warning-content-focused: var(--orange-50);
200
+ --warning-content-pressed: var(--orange-60);
201
+ --warning-content-disabled: var(--orange-30);
202
+ --warning-outline-default: var(--orange-5);
203
+ --warning-outline-hover: var(--orange-10);
204
+ --warning-outline-focused: var(--orange-50);
205
+ --warning-outline-pressed: var(--orange-10);
206
+ --warning-outline-disabled: var(--orange-5);
207
+ --success-fill-default: var(--emerald-5);
208
+ --success-fill-hover: var(--emerald-10);
209
+ --success-fill-focused: var(--emerald-5);
210
+ --success-fill-pressed: var(--emerald-20);
211
+ --success-fill-disabled: var(--emerald-0);
212
+ --success-content-default: var(--emerald-50);
213
+ --success-content-hover: var(--emerald-50);
214
+ --success-content-focused: var(--emerald-50);
215
+ --success-content-pressed: var(--emerald-60);
216
+ --success-content-disabled: var(--emerald-30);
217
+ --success-outline-default: var(--emerald-5);
218
+ --success-outline-hover: var(--emerald-10);
219
+ --success-outline-focused: var(--emerald-50);
220
+ --success-outline-pressed: var(--emerald-10);
221
+ --success-outline-disabled: var(--emerald-5);
222
+ --error-fill-default: var(--red-5);
223
+ --error-fill-hover: var(--red-10);
224
+ --error-fill-focused: var(--red-5);
225
+ --error-fill-pressed: var(--red-20);
226
+ --error-fill-disabled: var(--red-0);
227
+ --error-content-default: var(--red-50);
228
+ --error-content-hover: var(--red-50);
229
+ --error-content-focused: var(--red-50);
230
+ --error-content-pressed: var(--red-60);
231
+ --error-content-disabled: var(--red-30);
232
+ --error-outline-default: var(--red-5);
233
+ --error-outline-hover: var(--red-10);
234
+ --error-outline-focused: var(--red-50);
235
+ --error-outline-pressed: var(--red-10);
236
+ --error-outline-disabled: var(--red-5);
237
+ --info-fill-default: var(--blue-5);
238
+ --info-fill-hover: var(--blue-15);
239
+ --info-fill-focused: var(--blue-5);
240
+ --info-fill-pressed: var(--blue-20);
241
+ --info-fill-disabled: var(--blue-0);
242
+ --info-content-default: var(--blue-50);
243
+ --info-content-hover: var(--blue-60);
244
+ --info-content-focused: var(--blue-60);
245
+ --info-content-pressed: var(--blue-70);
246
+ --info-content-disabled: var(--blue-30);
247
+ --info-outline-default: var(--blue-50);
248
+ --info-outline-hover: var(--blue-10);
249
+ --info-outline-focused: var(--blue-50);
250
+ --info-outline-pressed: var(--blue-10);
251
+ --info-outline-disabled: var(--blue-5);
252
+ }
253
+
254
+ .dark-theme {
255
+ --default-fill-default: var(--blue-100);
256
+ --default-fill-hover: var(--blue-85);
257
+ --default-fill-focused: var(--blue-100);
258
+ --default-fill-pressed: var(--grey-70);
259
+ --default-fill-disabled: var(--blue-100);
260
+ --default-content-default: var(--grey-0);
261
+ --default-content-hover: var(--grey-0);
262
+ --default-content-focused: var(--grey-0);
263
+ --default-content-pressed: var(--grey-0);
264
+ --default-content-disabled: var(--grey-20);
265
+ --default-hint-default: var(--grey-40);
266
+ --default-hint-hover: var(--grey-40);
267
+ --default-hint-focused: var(--grey-40);
268
+ --default-hint-pressed: var(--grey-40);
269
+ --default-hint-disabled: var(--grey-50);
270
+ --default-outline-default: var(--blue-85);
271
+ --default-outline-hover: var(--blue-80);
272
+ --default-outline-focused: var(--blue-40);
273
+ --default-outline-pressed: var(--blue-80);
274
+ --default-outline-disabled: var(--blue-90);
275
+ --default-outline-ghost: var(--white-inf);
276
+ --s-default-fill-default: var(--grey-80);
277
+ --s-default-fill-hover: var(--grey-70);
278
+ --s-default-fill-focused: var(--grey-100);
279
+ --s-default-fill-pressed: var(--grey-50);
280
+ --s-default-fill-disabled: var(--grey-80);
281
+ --s-default-content-default: var(--blue-0);
282
+ --s-default-content-hover: var(--blue-0);
283
+ --s-default-content-focused: var(--blue-0);
284
+ --s-default-content-pressed: var(--blue-0);
285
+ --s-default-content-disabled: var(--blue-20);
286
+ --s-default-outline-default: var(--grey-70);
287
+ --s-default-outline-hover: var(--grey-60);
288
+ --s-default-outline-focused: var(--grey-30);
289
+ --s-default-outline-pressed: var(--grey-60);
290
+ --s-default-outline-disabled: var(--grey-70);
291
+ --accent-fill-default: var(--blue-50);
292
+ --accent-fill-hover: var(--blue-60);
293
+ --accent-fill-focused: var(--blue-50);
294
+ --accent-fill-pressed: var(--blue-70);
295
+ --accent-fill-disabled: var(--blue-30);
296
+ --accent-fill-selected: var(--blue-50);
297
+ --accent-fill-unselected: var(--blue-30);
298
+ --accent-doublefill-default: var(--blue-60);
299
+ --accent-doublefill-hover: var(--blue-70);
300
+ --accent-doublefill-focused: var(--blue-60);
301
+ --accent-doublefill-pressed: var(--blue-80);
302
+ --accent-doublefill-disabled: var(--blue-40);
303
+ --accent-doublefill-selected: var(--blue-60);
304
+ --accent-doublefill-unselected: var(--blue-40);
305
+ --accent-content-default: var(--blue-0);
306
+ --accent-content-hover: var(--blue-0);
307
+ --accent-content-focused: var(--blue-0);
308
+ --accent-content-pressed: var(--blue-5);
309
+ --accent-content-disabled: var(--blue-0);
310
+ --accent-content-selected: var(--blue-85);
311
+ --accent-content-unselected: var(--blue-80);
312
+ --accent-outline-default: var(--blue-50);
313
+ --accent-outline-hover: var(--blue-60);
314
+ --accent-outline-focused: var(--blue-70);
315
+ --accent-outline-pressed: var(--blue-70);
316
+ --accent-outline-disabled: var(--blue-10);
317
+ --accent-outline-ghost: var(--white-inf);
318
+ --s-accent-fill-default: var(--blue-100);
319
+ --s-accent-fill-hover: var(--blue-70);
320
+ --s-accent-fill-focused: var(--blue-100);
321
+ --s-accent-fill-pressed: var(--blue-60);
322
+ --s-accent-fill-disabled: var(--blue-100);
323
+ --s-accent-content-default: var(--blue-50);
324
+ --s-accent-content-hover: var(--blue-50);
325
+ --s-accent-content-focused: var(--blue-50);
326
+ --s-accent-content-pressed: var(--blue-60);
327
+ --s-accent-content-disabled: var(--blue-20);
328
+ --s-accent-content-selected: var(--blue-50);
329
+ --s-accent-content-unselected: var(--blue-30);
330
+ --s-accent-outline-default: var(--blue-0);
331
+ --s-accent-outline-hover: var(--blue-5);
332
+ --s-accent-outline-focused: var(--blue-5);
333
+ --s-accent-outline-pressed: var(--blue-10);
334
+ --s-accent-outline-disabled: var(--blue-0);
335
+ --warning-fill-default: var(--orange-5);
336
+ --warning-fill-hover: var(--orange-15);
337
+ --warning-fill-focused: var(--orange-5);
338
+ --warning-fill-pressed: var(--orange-20);
339
+ --warning-fill-disabled: var(--orange-0);
340
+ --warning-content-default: var(--orange-50);
341
+ --warning-content-hover: var(--orange-50);
342
+ --warning-content-focused: var(--orange-50);
343
+ --warning-content-pressed: var(--orange-60);
344
+ --warning-content-disabled: var(--orange-30);
345
+ --warning-outline-default: var(--orange-5);
346
+ --warning-outline-hover: var(--orange-10);
347
+ --warning-outline-focused: var(--orange-50);
348
+ --warning-outline-pressed: var(--orange-10);
349
+ --warning-outline-disabled: var(--orange-5);
350
+ --success-fill-default: var(--emerald-5);
351
+ --success-fill-hover: var(--emerald-10);
352
+ --success-fill-focused: var(--emerald-5);
353
+ --success-fill-pressed: var(--emerald-20);
354
+ --success-fill-disabled: var(--emerald-0);
355
+ --success-content-default: var(--emerald-50);
356
+ --success-content-hover: var(--emerald-50);
357
+ --success-content-focused: var(--emerald-50);
358
+ --success-content-pressed: var(--emerald-60);
359
+ --success-content-disabled: var(--emerald-30);
360
+ --success-outline-default: var(--emerald-5);
361
+ --success-outline-hover: var(--emerald-10);
362
+ --success-outline-focused: var(--emerald-50);
363
+ --success-outline-pressed: var(--emerald-10);
364
+ --success-outline-disabled: var(--emerald-5);
365
+ --error-fill-default: var(--red-5);
366
+ --error-fill-hover: var(--red-10);
367
+ --error-fill-focused: var(--red-5);
368
+ --error-fill-pressed: var(--red-20);
369
+ --error-fill-disabled: var(--red-0);
370
+ --error-content-default: var(--red-50);
371
+ --error-content-hover: var(--red-50);
372
+ --error-content-focused: var(--red-50);
373
+ --error-content-pressed: var(--red-60);
374
+ --error-content-disabled: var(--red-30);
375
+ --error-outline-default: var(--red-5);
376
+ --error-outline-hover: var(--red-10);
377
+ --error-outline-focused: var(--red-50);
378
+ --error-outline-pressed: var(--red-10);
379
+ --error-outline-disabled: var(--red-5);
380
+ --info-fill-default: var(--blue-5);
381
+ --info-fill-hover: var(--blue-15);
382
+ --info-fill-focused: var(--blue-5);
383
+ --info-fill-pressed: var(--blue-20);
384
+ --info-fill-disabled: var(--blue-0);
385
+ --info-content-default: var(--blue-50);
386
+ --info-content-hover: var(--blue-60);
387
+ --info-content-focused: var(--blue-60);
388
+ --info-content-pressed: var(--blue-70);
389
+ --info-content-disabled: var(--blue-30);
390
+ --info-outline-default: var(--blue-50);
391
+ --info-outline-hover: var(--blue-10);
392
+ --info-outline-focused: var(--blue-50);
393
+ --info-outline-pressed: var(--blue-10);
394
+ --info-outline-disabled: var(--blue-5);
395
+ }
396
+
397
+ .colors {
398
+ --color-bg-button-primary-default: var(--accent-fill-default);
399
+ --color-bg-button-primary-hover: var(--accent-fill-hover);
400
+ --color-bg-button-primary-focused: var(--accent-fill-focused);
401
+ --color-bg-button-primary-pressed: var(--accent-fill-pressed);
402
+ --color-bg-button-primary-disabled: var(--accent-fill-disabled);
403
+ --color-bg-button-secondary-default: var(--s-accent-fill-default);
404
+ --color-bg-button-secondary-hover: var(--s-accent-fill-hover);
405
+ --color-bg-button-secondary-focused: var(--s-accent-fill-focused);
406
+ --color-bg-button-secondary-pressed: var(--s-accent-fill-pressed);
407
+ --color-bg-button-secondary-disabled: var(--s-accent-fill-disabled);
408
+ --color-bg-button-tritery-default: var(--s-default-fill-default);
409
+ --color-bg-button-tritery-hover: var(--s-default-fill-hover);
410
+ --color-bg-button-tritery-focused: var(--s-default-fill-focused);
411
+ --color-bg-button-tritery-pressed: var(--s-default-fill-pressed);
412
+ --color-bg-button-tritery-disabled: var(--s-default-fill-disabled);
413
+ --color-bg-block-primary-default: var(--default-fill-default);
414
+ --color-bg-block-primary-hover: var(--default-fill-hover);
415
+ --color-bg-block-primary-focused: var(--default-fill-focused);
416
+ --color-bg-block-primary-pressed: var(--default-fill-pressed);
417
+ --color-bg-block-primary-disabled: var(--default-fill-disabled);
418
+ --color-bg-block-tritery-default: var(--default-content-default);
419
+ --color-bg-block-tritery-hover: var(--default-content-hover);
420
+ --color-bg-block-tritery-focused: var(--default-content-focused);
421
+ --color-bg-block-tritery-pressed: var(--default-content-pressed);
422
+ --color-bg-block-tritery-disabled: var(--default-content-disabled);
423
+ --color-bg-control-accent-default: var(--accent-fill-default);
424
+ --color-bg-control-accent-hover: var(--accent-fill-hover);
425
+ --color-bg-control-accent-focused: var(--accent-fill-focused);
426
+ --color-bg-control-accent-pressed: var(--accent-fill-pressed);
427
+ --color-bg-control-accent-disabled: var(--accent-fill-disabled);
428
+ --color-bg-control-primary-default: var(--s-accent-fill-default);
429
+ --color-bg-control-primary-hover: var(--s-accent-fill-hover);
430
+ --color-bg-control-primary-focused: var(--s-accent-fill-focused);
431
+ --color-bg-control-primary-pressed: var(--s-accent-fill-pressed);
432
+ --color-bg-control-primary-disabled: var(--s-accent-fill-disabled);
433
+ --color-bg-control-secondary-default: var(--s-default-fill-default);
434
+ --color-bg-control-secondary-hover: var(--s-default-fill-hover);
435
+ --color-bg-control-secondary-focused: var(--s-default-fill-focused);
436
+ --color-bg-control-secondary-pressed: var(--s-default-fill-pressed);
437
+ --color-bg-control-secondary-disabled: var(--s-default-fill-disabled);
438
+ --color-bg-table-cell-default: var(--default-fill-default);
439
+ --color-bg-table-cell-hover: var(--default-fill-hover);
440
+ --color-bg-table-cell-focused: var(--default-fill-focused);
441
+ --color-bg-table-cell-pressed: var(--default-fill-pressed);
442
+ --color-bg-table-cell-disabled: var(--default-fill-disabled);
443
+ --color-bg-table-cell-selected: var(--s-accent-fill-hover);
444
+ --color-bg-table-cell-unselected: var(--s-accent-fill-hover);
445
+ --color-bg-table-d-cell-default: var(--s-default-fill-default);
446
+ --color-bg-table-d-cell-hover: var(--s-default-fill-hover);
447
+ --color-bg-table-d-cell-focused: var(--s-default-fill-focused);
448
+ --color-bg-table-d-cell-pressed: var(--s-default-fill-pressed);
449
+ --color-bg-table-d-cell-disabled: var(--s-default-fill-disabled);
450
+ --color-bg-table-d-cell-selected: var(--s-accent-fill-hover);
451
+ --color-bg-table-d-cell-unselected: var(--s-default-fill-default);
452
+ --color-bg-table-header-default: var(--s-default-fill-default);
453
+ --color-bg-table-header-hover: var(--s-default-fill-hover);
454
+ --color-bg-table-header-focused: var(--s-default-fill-focused);
455
+ --color-bg-table-header-pressed: var(--s-default-fill-pressed);
456
+ --color-bg-table-header-disabled: var(--s-default-fill-disabled);
457
+ --color-bg-table-header-selected: var(--s-accent-fill-hover);
458
+ --color-bg-table-header-unselected: var(--s-accent-fill-hover);
459
+ --color-bg-chat-bubble-general-bg: var(--accent-content-pressed);
460
+ --color-bg-chat-bubble-user-default: var(--s-accent-fill-hover);
461
+ --color-bg-chat-bubble-user-quote: var(--s-accent-fill-hover);
462
+ --color-bg-chat-bubble-user-selected: var(--accent-fill-pressed);
463
+ --color-bg-chat-bubble-user-quote-selected: var(--accent-fill-default);
464
+ --color-bg-chat-bubble-other-default: var(--default-fill-default);
465
+ --color-bg-chat-bubble-other-quote: var(--s-default-fill-hover);
466
+ --color-bg-chat-bubble-other-selected: var(--accent-fill-pressed);
467
+ --color-bg-chat-bubble-other-quote-selected: var(--accent-fill-default);
468
+ --color-text-button-primary-default: var(--accent-content-default);
469
+ --color-text-button-primary-hover: var(--accent-content-hover);
470
+ --color-text-button-primary-focused: var(--accent-content-focused);
471
+ --color-text-button-primary-pressed: var(--accent-content-pressed);
472
+ --color-text-button-primary-disabled: var(--accent-content-disabled);
473
+ --color-text-button-secondary-default: var(--s-accent-content-default);
474
+ --color-text-button-secondary-hover: var(--s-accent-content-hover);
475
+ --color-text-button-secondary-focused: var(--s-accent-content-focused);
476
+ --color-text-button-secondary-pressed: var(--s-accent-content-pressed);
477
+ --color-text-button-secondary-disabled: var(--s-accent-content-disabled);
478
+ --color-text-button-tritery-default: var(--s-default-content-default);
479
+ --color-text-button-tritery-hover: var(--s-default-content-hover);
480
+ --color-text-button-tritery-focused: var(--s-default-content-focused);
481
+ --color-text-button-tritery-pressed: var(--s-default-content-pressed);
482
+ --color-text-button-tritery-disabled: var(--s-default-content-disabled);
483
+ --color-text-control-accent-default: var(--s-accent-content-default);
484
+ --color-text-control-accent-hover: var(--s-accent-content-hover);
485
+ --color-text-control-accent-focused: var(--s-accent-content-focused);
486
+ --color-text-control-accent-pressed: var(--s-accent-content-pressed);
487
+ --color-text-control-accent-disabled: var(--s-accent-content-disabled);
488
+ --color-text-control-primary-default: var(--default-content-default);
489
+ --color-text-control-primary-hover: var(--default-content-hover);
490
+ --color-text-control-primary-focused: var(--default-content-focused);
491
+ --color-text-control-primary-pressed: var(--default-content-pressed);
492
+ --color-text-control-primary-disabled: var(--default-content-disabled);
493
+ --color-text-control-secondary-default: var(--default-hint-default);
494
+ --color-text-control-secondary-hover: var(--default-hint-hover);
495
+ --color-text-control-secondary-focused: var(--default-hint-focused);
496
+ --color-text-control-secondary-pressed: var(--default-hint-pressed);
497
+ --color-text-control-secondary-disabled: var(--default-hint-disabled);
498
+ --color-text-control-tritery-default: var(--accent-content-default);
499
+ --color-text-control-tritery-hover: var(--accent-content-hover);
500
+ --color-text-control-tritery-focused: var(--accent-content-focused);
501
+ --color-text-control-tritery-pressed: var(--accent-content-pressed);
502
+ --color-text-control-tritery-disabled: var(--accent-content-disabled);
503
+ --color-text-control-warning-default: var(--warning-content-default);
504
+ --color-text-control-warning-hover: var(--warning-content-hover);
505
+ --color-text-control-warning-focused: var(--warning-content-focused);
506
+ --color-text-control-warning-pressed: var(--warning-content-pressed);
507
+ --color-text-control-warning-disabled: var(--warning-content-disabled);
508
+ --color-text-avatar-primary-default: var(--accent-content-default);
509
+ --color-text-avatar-primary-hover: var(--accent-content-hover);
510
+ --color-text-avatar-primary-focused: var(--accent-content-focused);
511
+ --color-text-avatar-primary-pressed: var(--accent-content-pressed);
512
+ --color-text-avatar-primary-disabled: var(--accent-content-disabled);
513
+ --color-text-table-accent-default: var(--s-accent-content-default);
514
+ --color-text-table-accent-hover: var(--s-accent-content-hover);
515
+ --color-text-table-accent-focused: var(--s-accent-content-focused);
516
+ --color-text-table-accent-pressed: var(--s-accent-content-pressed);
517
+ --color-text-table-accent-disabled: var(--s-accent-content-disabled);
518
+ --color-text-table-primary-default: var(--default-content-default);
519
+ --color-text-table-primary-hover: var(--default-content-hover);
520
+ --color-text-table-primary-focused: var(--default-content-focused);
521
+ --color-text-table-primary-pressed: var(--default-content-pressed);
522
+ --color-text-table-primary-disabled: var(--default-content-disabled);
523
+ --color-text-table-secondary-default: var(--default-hint-default);
524
+ --color-text-table-secondary-hover: var(--default-hint-hover);
525
+ --color-text-table-secondary-focused: var(--default-hint-focused);
526
+ --color-text-table-secondary-pressed: var(--default-hint-pressed);
527
+ --color-text-table-secondary-disabled: var(--default-hint-disabled);
528
+ --color-text-table-warning-default: var(--warning-content-default);
529
+ --color-text-table-warning-hover: var(--warning-content-hover);
530
+ --color-text-table-warning-focused: var(--warning-content-focused);
531
+ --color-text-table-warning-pressed: var(--warning-content-pressed);
532
+ --color-text-table-warning-disabled: var(--warning-content-disabled);
533
+ --color-text-block-accent-default: var(--s-accent-content-default);
534
+ --color-text-block-accent-hover: var(--s-accent-content-hover);
535
+ --color-text-block-accent-focused: var(--s-accent-content-focused);
536
+ --color-text-block-accent-pressed: var(--s-accent-content-pressed);
537
+ --color-text-block-accent-disabled: var(--s-accent-content-disabled);
538
+ --color-text-block-primary-default: var(--default-content-default);
539
+ --color-text-block-primary-hover: var(--default-content-hover);
540
+ --color-text-block-primary-focused: var(--default-content-focused);
541
+ --color-text-block-primary-pressed: var(--default-content-pressed);
542
+ --color-text-block-primary-disabled: var(--default-content-disabled);
543
+ --color-text-block-secondary-default: var(--default-hint-default);
544
+ --color-text-block-secondary-hover: var(--default-hint-hover);
545
+ --color-text-block-secondary-focused: var(--default-hint-focused);
546
+ --color-text-block-secondary-pressed: var(--default-hint-pressed);
547
+ --color-text-block-secondary-disabled: var(--default-hint-disabled);
548
+ --color-text-block-warning-default: var(--warning-content-default);
549
+ --color-text-block-warning-hover: var(--warning-content-hover);
550
+ --color-text-block-warning-focused: var(--warning-content-focused);
551
+ --color-text-block-warning-pressed: var(--warning-content-pressed);
552
+ --color-text-block-warning-disabled: var(--warning-content-disabled);
553
+ --color-text-chat-bubble-user-default: var(--default-content-default);
554
+ --color-text-chat-bubble-user-selected: var(--accent-content-default);
555
+ --color-text-chat-bubble-user-quote: var(--default-content-default);
556
+ --color-text-chat-bubble-user-quote-header: var(--s-accent-content-default);
557
+ --color-text-chat-bubble-user-quote-selected: var(--accent-content-default);
558
+ --color-text-chat-bubble-user-sub: var(--s-accent-content-unselected);
559
+ --color-text-chat-bubble-user-sub-selected: var(--accent-content-default);
560
+ --color-text-chat-bubble-user-sub-quote: var(--s-accent-content-unselected);
561
+ --color-text-chat-bubble-other-default: var(--default-content-default);
562
+ --color-text-chat-bubble-other-selected: var(--accent-content-default);
563
+ --color-text-chat-bubble-other-quote: var(--default-content-default);
564
+ --color-text-chat-bubble-other-quote-header: var(--s-accent-content-default);
565
+ --color-text-chat-bubble-other-quote-selected: var(--accent-content-default);
566
+ --color-text-chat-bubble-other-sub: var(--default-hint-default);
567
+ --color-text-chat-bubble-other-sub-selected: var(--accent-content-default);
568
+ --color-text-chat-bubble-other-sub-quote: var(--default-hint-default);
569
+ --color-border-block-primary-default: var(--default-outline-default);
570
+ --color-border-block-primary-hover: var(--default-outline-hover);
571
+ --color-border-block-primary-focused: var(--default-outline-focused);
572
+ --color-border-block-primary-pressed: var(--default-outline-pressed);
573
+ --color-border-block-primary-disabled: var(--default-outline-disabled);
574
+ --color-border-table-primary-default: var(--default-outline-default);
575
+ --color-border-table-primary-hover: var(--default-outline-hover);
576
+ --color-border-table-primary-focused: var(--default-outline-focused);
577
+ --color-border-table-primary-pressed: var(--default-outline-pressed);
578
+ --color-border-table-primary-disabled: var(--default-outline-disabled);
579
+ --color-border-table-accent-default: var(--accent-outline-default);
580
+ --color-border-table-accent-hover: var(--accent-outline-hover);
581
+ --color-border-table-accent-focused: var(--accent-outline-focused);
582
+ --color-border-table-accent-pressed: var(--accent-outline-pressed);
583
+ --color-border-table-accent-disabled: var(--accent-outline-disabled);
584
+ --color-border-control-accent-default: var(--s-accent-content-default);
585
+ --color-border-control-accent-hover: var(--s-accent-content-hover);
586
+ --color-border-control-accent-focused: var(--s-accent-content-focused);
587
+ --color-border-control-accent-pressed: var(--s-accent-content-pressed);
588
+ --color-border-control-accent-disabled: var(--s-accent-content-disabled);
589
+ --color-border-control-accent-selected: var(--accent-fill-selected);
590
+ --color-border-control-accent-unselected: var(--accent-fill-unselected);
591
+ --color-border-control-primary-default: var(--default-content-default);
592
+ --color-border-control-primary-hover: var(--default-content-hover);
593
+ --color-border-control-primary-focused: var(--default-content-focused);
594
+ --color-border-control-primary-pressed: var(--default-content-pressed);
595
+ --color-border-control-primary-disabled: var(--default-content-disabled);
596
+ --color-border-control-secondary-default: var(--default-hint-default);
597
+ --color-border-control-secondary-hover: var(--default-hint-hover);
598
+ --color-border-control-secondary-focused: var(--default-hint-focused);
599
+ --color-border-control-secondary-pressed: var(--default-hint-pressed);
600
+ --color-border-control-secondary-disabled: var(--default-hint-disabled);
601
+ --color-border-control-tritery-default: var(--accent-content-default);
602
+ --color-border-control-tritery-hover: var(--accent-content-hover);
603
+ --color-border-control-tritery-focused: var(--accent-content-focused);
604
+ --color-border-control-tritery-pressed: var(--accent-content-pressed);
605
+ --color-border-control-tritery-disabled: var(--accent-content-disabled);
606
+ --color-icon-button-primary-default: var(--accent-content-default);
607
+ --color-icon-button-primary-hover: var(--accent-content-hover);
608
+ --color-icon-button-primary-focused: var(--accent-content-focused);
609
+ --color-icon-button-primary-pressed: var(--accent-content-pressed);
610
+ --color-icon-button-primary-disabled: var(--accent-content-disabled);
611
+ --color-icon-button-secondary-default: var(--s-accent-content-default);
612
+ --color-icon-button-secondary-hover: var(--s-accent-content-hover);
613
+ --color-icon-button-secondary-focused: var(--s-accent-content-focused);
614
+ --color-icon-button-secondary-pressed: var(--s-accent-content-pressed);
615
+ --color-icon-button-secondary-disabled: var(--s-accent-content-disabled);
616
+ --color-icon-button-tritery-default: var(--s-default-content-default);
617
+ --color-icon-button-tritery-hover: var(--s-default-content-hover);
618
+ --color-icon-button-tritery-focused: var(--s-default-content-focused);
619
+ --color-icon-button-tritery-pressed: var(--s-default-content-pressed);
620
+ --color-icon-button-tritery-disabled: var(--s-default-content-disabled);
621
+ --color-icon-control-accent-default: var(--s-accent-content-default);
622
+ --color-icon-control-accent-hover: var(--s-accent-content-hover);
623
+ --color-icon-control-accent-focused: var(--s-accent-content-focused);
624
+ --color-icon-control-accent-pressed: var(--s-accent-content-pressed);
625
+ --color-icon-control-accent-disabled: var(--s-accent-content-disabled);
626
+ --color-icon-control-accent-selected: var(--accent-fill-selected);
627
+ --color-icon-control-accent-unselected: var(--accent-fill-unselected);
628
+ --color-icon-control-primary-default: var(--default-content-default);
629
+ --color-icon-control-primary-hover: var(--default-content-hover);
630
+ --color-icon-control-primary-focused: var(--default-content-focused);
631
+ --color-icon-control-primary-pressed: var(--default-content-pressed);
632
+ --color-icon-control-primary-disabled: var(--default-content-disabled);
633
+ --color-icon-control-secondary-default: var(--default-hint-default);
634
+ --color-icon-control-secondary-hover: var(--default-hint-hover);
635
+ --color-icon-control-secondary-focused: var(--default-hint-focused);
636
+ --color-icon-control-secondary-pressed: var(--default-hint-pressed);
637
+ --color-icon-control-secondary-disabled: var(--default-hint-disabled);
638
+ --color-icon-control-warning-default: var(--warning-content-default);
639
+ --color-icon-control-warning-hover: var(--warning-content-hover);
640
+ --color-icon-control-warning-focused: var(--warning-content-focused);
641
+ --color-icon-control-warning-pressed: var(--warning-content-pressed);
642
+ --color-icon-control-warning-disabled: var(--warning-content-disabled);
643
+ --color-icon-table-primary-default: var(--s-default-content-default);
644
+ --color-icon-table-primary-hover: var(--s-default-content-hover);
645
+ --color-icon-table-primary-focused: var(--s-default-content-focused);
646
+ --color-icon-table-primary-pressed: var(--s-default-content-pressed);
647
+ --color-icon-table-primary-disabled: var(--s-default-content-disabled);
648
+ --color-icon-table-secondary-default: var(--default-hint-default);
649
+ --color-icon-table-secondary-hover: var(--default-hint-hover);
650
+ --color-icon-table-secondary-focused: var(--default-hint-focused);
651
+ --color-icon-table-secondary-pressed: var(--default-hint-pressed);
652
+ --color-icon-table-secondary-disabled: var(--default-hint-disabled);
653
+ --color-icon-table-accent-default: var(--s-accent-content-default);
654
+ --color-icon-table-accent-hover: var(--s-accent-content-hover);
655
+ --color-icon-table-accent-focused: var(--s-accent-content-focused);
656
+ --color-icon-table-accent-pressed: var(--s-accent-content-pressed);
657
+ --color-icon-table-accent-disabled: var(--s-accent-content-disabled);
658
+ --color-icon-table-accent-selected: var(--s-accent-content-selected);
659
+ --color-icon-table-accent-unselected: var(--s-accent-content-unselected);
660
+ --color-icon-block-accent-default: var(--s-accent-content-default);
661
+ --color-icon-block-accent-hover: var(--s-accent-content-hover);
662
+ --color-icon-block-accent-focused: var(--s-accent-content-focused);
663
+ --color-icon-block-accent-pressed: var(--s-accent-content-pressed);
664
+ --color-icon-block-accent-disabled: var(--s-accent-content-disabled);
665
+ --color-icon-block-accent-selected: var(--accent-fill-selected);
666
+ --color-icon-block-accent-unselected: var(--accent-fill-unselected);
667
+ --color-icon-block-primary-default: var(--default-content-default);
668
+ --color-icon-block-primary-hover: var(--default-content-hover);
669
+ --color-icon-block-primary-focused: var(--default-content-focused);
670
+ --color-icon-block-primary-pressed: var(--default-content-pressed);
671
+ --color-icon-block-primary-disabled: var(--default-content-disabled);
672
+ --color-icon-block-secondary-default: var(--default-hint-default);
673
+ --color-icon-block-secondary-hover: var(--default-hint-hover);
674
+ --color-icon-block-secondary-focused: var(--default-hint-focused);
675
+ --color-icon-block-secondary-pressed: var(--default-hint-pressed);
676
+ --color-icon-block-secondary-disabled: var(--default-hint-disabled);
677
+ --color-icon-block-warning-default: var(--warning-content-default);
678
+ --color-icon-block-warning-hover: var(--warning-content-hover);
679
+ --color-icon-block-warning-focused: var(--warning-content-focused);
680
+ --color-icon-block-warning-pressed: var(--warning-content-pressed);
681
+ --color-icon-block-warning-disabled: var(--warning-content-disabled);
682
+ --color-icon-chat-bubble-user-default: var(--default-content-default);
683
+ --color-icon-chat-bubble-user-quote: var(--s-accent-content-default);
684
+ --color-icon-chat-bubble-user-selected: var(--accent-content-default);
685
+ --color-icon-chat-bubble-other-default: var(--default-content-default);
686
+ --color-icon-chat-bubble-other-selected: var(--accent-content-selected);
687
+ }
688
+
689
+ html {
690
+ --shadow-key-umbra-opacity: rgba(0, 0, 0, 0.2);
691
+ --shadow-key-penumbra-opacity: rgba(0, 0, 0, 0.14);
692
+ --shadow-key-ambient-opacity: rgba(0, 0, 0, 0.12);
693
+
694
+ overflow: hidden;
695
+ font-family: Manrope, sans-serif;
696
+ }
697
+
698
+ section,
699
+ div {
700
+ box-sizing: border-box;
701
+ }
702
+
703
+ ::-webkit-scrollbar-button {
704
+ background-image: url("");
705
+ background-repeat: no-repeat;
706
+ width: var(--spacing-xs);
707
+ height: 0;
708
+ }
709
+
710
+ ::-webkit-scrollbar-track {
711
+ background-color: var(--grey-30);
712
+ }
713
+
714
+ ::-webkit-scrollbar-thumb {
715
+ border-radius: 2px;
716
+ height: 50px;
717
+ background-color: var(--grey-70);
718
+ }
719
+
720
+ ::-webkit-scrollbar-thumb:hover {
721
+ background-color: var(--grey-90);
722
+ }
723
+
724
+ ::-webkit-resizer {
725
+ background-image: url("");
726
+ background-repeat: no-repeat;
727
+ width: var(--spacing-xs);
728
+ height: 0;
729
+ }
730
+
731
+ ::-webkit-scrollbar {
732
+ width: 5px;
733
+ }
734
+
735
+ /* other CSS style classes */
736
+ .fade-enter-active,
737
+ .fade-leave-active {
738
+ transition: opacity 0.15s ease;
739
+ }
740
+
741
+ .fade-enter,
742
+ .fade-leave-active {
743
+ opacity: 0;
744
+ }
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@v1nt1248/3nclient-lib",
3
3
  "license": "AGPL-3.0-or-later",
4
4
  "author": "v1nt1248",
5
- "version": "0.1.3",
5
+ "version": "0.1.5",
6
6
  "description": "Library for 3NWeb clients",
7
7
  "type": "module",
8
8
  "files": [
@@ -13,22 +13,25 @@
13
13
  "types": "./dist/index.d.ts",
14
14
  "exports": {
15
15
  ".": {
16
- "import": "./dist/ui-3n-lib.js"
16
+ "import": "./dist/ui-3n-lib.js",
17
+ "types": "./dist/index.d.ts"
17
18
  },
18
- "./style.css": "./dist/style.css"
19
+ "./style.css": "./dist/style.css",
20
+ "./variables.css": "./dist/variables.css"
19
21
  },
20
22
  "scripts": {
21
23
  "dev": "vite",
22
24
  "generate:types": "vue-tsc --declaration --emitDeclarationOnly --outdir ./dist",
23
25
  "copy:dts": "cp ./src/types.d.ts ./dist",
24
- "build": "vite build",
26
+ "copy:css": "cp ./src/assets/styles/variables.css ./dist",
27
+ "build": "vite build && pnpm run copy:css",
25
28
  "preview": "vite preview",
26
29
  "stylelint": "stylelint --config .stylelint.config.cjs 'src/**/*.{vue,scss}'",
27
30
  "stylelint:fix": "stylelint --config .stylelint.config.cjs --fix 'src/**/*.{vue,scss}'",
28
31
  "linter": "eslint -c .eslintrc.cjs --ext .js,.vue,.ts, src",
29
32
  "linter:fix": "eslint -c .eslintrc.cjs --fix --ext .js,.vue,.ts, src",
30
- "lint": "yarn linter && yarn stylelint",
31
- "lint:fix": "yarn linter:fix && yarn stylelint:fix",
33
+ "lint": "pnpm run linter && pnpm run stylelint",
34
+ "lint:fix": "pnpm run linter:fix && pnpm run stylelint:fix",
32
35
  "docs:dev": "vitepress dev docs",
33
36
  "docs:build": "vitepress build docs",
34
37
  "docs:preview": "vitepress preview docs"