@gitlab/ui 98.1.0 → 98.1.2

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 (23) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/components/base/breadcrumb/breadcrumb.js +1 -1
  3. package/dist/index.css +1 -1
  4. package/dist/index.css.map +1 -1
  5. package/dist/tokens/build/js/tokens.dark.js +84 -84
  6. package/dist/tokens/css/tokens.css +1 -1
  7. package/dist/tokens/css/tokens.dark.css +47 -47
  8. package/dist/tokens/js/tokens.dark.js +84 -84
  9. package/dist/tokens/json/tokens.dark.json +133 -148
  10. package/dist/tokens/json/tokens.json +49 -64
  11. package/dist/tokens/scss/_tokens.dark.scss +47 -47
  12. package/dist/tokens/scss/_tokens.scss +1 -1
  13. package/package.json +3 -4
  14. package/src/components/base/breadcrumb/breadcrumb.vue +1 -1
  15. package/src/tokens/action.tokens.json +12 -21
  16. package/src/tokens/build/css/tokens.css +1 -1
  17. package/src/tokens/build/css/tokens.dark.css +47 -47
  18. package/src/tokens/build/js/tokens.dark.js +84 -84
  19. package/src/tokens/build/json/tokens.dark.json +133 -148
  20. package/src/tokens/build/json/tokens.json +49 -64
  21. package/src/tokens/build/scss/_tokens.dark.scss +47 -47
  22. package/src/tokens/build/scss/_tokens.scss +1 -1
  23. package/src/tokens/contextual/button.tokens.json +37 -43
package/src/tokens/contextual/button.tokens.json CHANGED
@@ -34,7 +34,7 @@
34
34
  "default": {
35
35
  "$value": {
36
36
  "default": "{color.neutral.0}",
37
- "dark": "rgba(137, 136, 141, 0.4)"
37
+ "dark": "{color.neutral.900}"
38
38
  },
39
39
  "$type": "color",
40
40
  "$description": "Used for the background of an default primary button in the default state."
@@ -42,7 +42,7 @@
42
42
  "hover": {
43
43
  "$value": {
44
44
  "default": "{color.neutral.50}",
45
- "dark": "rgba(137, 136, 141, 0.64)"
45
+ "dark": "{color.neutral.900}"
46
46
  },
47
47
  "$type": "color",
48
48
  "$description": "Used for the background of an default primary button in the hover state."
@@ -55,7 +55,7 @@
55
55
  "active": {
56
56
  "$value": {
57
57
  "default": "{color.neutral.100}",
58
- "dark": "rgba(137, 136, 141, 0.32)"
58
+ "dark": "{color.neutral.800}"
59
59
  },
60
60
  "$type": "color",
61
61
  "$description": "Used for the background of an default primary button in the active state."
@@ -67,7 +67,7 @@
67
67
  "default": {
68
68
  "$value": {
69
69
  "default": "{color.neutral.200}",
70
- "dark": "{color.alpha.0}"
70
+ "dark": "{color.neutral.700}"
71
71
  },
72
72
  "$type": "color",
73
73
  "$description": "Used for the border of an default primary button in the default state."
@@ -75,7 +75,7 @@
75
75
  "hover": {
76
76
  "$value": {
77
77
  "default": "{color.neutral.400}",
78
- "dark": "{color.alpha.0}"
78
+ "dark": "{color.neutral.500}"
79
79
  },
80
80
  "$type": "color",
81
81
  "$description": "Used for the border of an default primary button in the hover state."
@@ -88,7 +88,7 @@
88
88
  "active": {
89
89
  "$value": {
90
90
  "default": "{color.neutral.600}",
91
- "dark": "{color.alpha.0}"
91
+ "dark": "{color.neutral.300}"
92
92
  },
93
93
  "$type": "color",
94
94
  "$description": "Used for the border of an default primary button in the active state."
@@ -176,10 +176,7 @@
176
176
  "foreground": {
177
177
  "color": {
178
178
  "default": {
179
- "$value": {
180
- "default": "{color.neutral.0}",
181
- "dark": "{color.neutral.950}"
182
- },
179
+ "$value": "{action.strong.confirm.foreground.color.default}",
183
180
  "$type": "color",
184
181
  "$description": "Used for the foreground of a confirm (positive) primary button in the default state."
185
182
  },
@@ -229,7 +226,7 @@
229
226
  "default": {
230
227
  "$value": {
231
228
  "default": "{color.blue.600}",
232
- "dark": "{color.alpha.0}"
229
+ "dark": "{color.blue.300}"
233
230
  },
234
231
  "$type": "color",
235
232
  "$description": "Used for the border of a confirm (positive) primary button in the default state."
@@ -237,7 +234,7 @@
237
234
  "hover": {
238
235
  "$value": {
239
236
  "default": "{color.blue.800}",
240
- "dark": "{color.alpha.0}"
237
+ "dark": "{color.blue.100}"
241
238
  },
242
239
  "$type": "color",
243
240
  "$description": "Used for the border of a confirm (positive) primary button in the hover state."
@@ -250,7 +247,7 @@
250
247
  "active": {
251
248
  "$value": {
252
249
  "default": "{color.blue.900}",
253
- "dark": "{color.alpha.0}"
250
+ "dark": "{color.blue.50}"
254
251
  },
255
252
  "$type": "color",
256
253
  "$description": "Used for the border of a confirm (positive) primary button in the active state."
@@ -264,7 +261,7 @@
264
261
  "default": {
265
262
  "$value": {
266
263
  "default": "{color.blue.500}",
267
- "dark": "{color.blue.100}"
264
+ "dark": "{color.blue.400}"
268
265
  },
269
266
  "$type": "color",
270
267
  "$description": "Used for the foreground of a confirm (positive) button in the default state."
@@ -272,7 +269,7 @@
272
269
  "hover": {
273
270
  "$value": {
274
271
  "default": "{color.blue.700}",
275
- "dark": "{color.blue.100}"
272
+ "dark": "{color.blue.200}"
276
273
  },
277
274
  "$type": "color",
278
275
  "$description": "Used for the foreground of a confirm (positive) button in the hover state."
@@ -285,7 +282,7 @@
285
282
  "active": {
286
283
  "$value": {
287
284
  "default": "{color.blue.900}",
288
- "dark": "{color.blue.100}"
285
+ "dark": "{color.blue.50}"
289
286
  },
290
287
  "$type": "color",
291
288
  "$description": "Used for the foreground of a confirm (positive) button in the active state."
@@ -297,7 +294,7 @@
297
294
  "default": {
298
295
  "$value": {
299
296
  "default": "{color.neutral.0}",
300
- "dark": "rgba(66, 143, 220, 0.4)"
297
+ "dark": "{color.neutral.900}"
301
298
  },
302
299
  "$type": "color",
303
300
  "$description": "Used for the background of an outlined confirm (positive) button in the default state."
@@ -305,7 +302,7 @@
305
302
  "hover": {
306
303
  "$value": {
307
304
  "default": "{color.blue.50}",
308
- "dark": "rgba(66, 143, 220, 0.64)"
305
+ "dark": "{color.blue.900}"
309
306
  },
310
307
  "$type": "color",
311
308
  "$description": "Used for the background of an outlined confirm (positive) button in the hover state."
@@ -318,7 +315,7 @@
318
315
  "active": {
319
316
  "$value": {
320
317
  "default": "{color.blue.100}",
321
- "dark": "rgba(66, 143, 220, 0.32)"
318
+ "dark": "{color.blue.800}"
322
319
  },
323
320
  "$type": "color",
324
321
  "$description": "Used for the background of an outlined confirm (positive) button in the active state."
@@ -330,7 +327,7 @@
330
327
  "default": {
331
328
  "$value": {
332
329
  "default": "{color.blue.500}",
333
- "dark": "{color.alpha.0}"
330
+ "dark": "{color.blue.400}"
334
331
  },
335
332
  "$type": "color",
336
333
  "$description": "Used for the border of an outlined confirm (positive) button in the default state."
@@ -338,7 +335,7 @@
338
335
  "hover": {
339
336
  "$value": {
340
337
  "default": "{color.blue.700}",
341
- "dark": "{color.alpha.0}"
338
+ "dark": "{color.blue.200}"
342
339
  },
343
340
  "$type": "color",
344
341
  "$description": "Used for the border of an outlined confirm (positive) button in the hover state."
@@ -351,7 +348,7 @@
351
348
  "active": {
352
349
  "$value": {
353
350
  "default": "{color.blue.900}",
354
- "dark": "{color.alpha.0}"
351
+ "dark": "{color.blue.50}"
355
352
  },
356
353
  "$type": "color",
357
354
  "$description": "Used for the border of an outlined confirm (positive) button in the active state."
@@ -439,10 +436,7 @@
439
436
  "foreground": {
440
437
  "color": {
441
438
  "default": {
442
- "$value": {
443
- "default": "{color.neutral.0}",
444
- "dark": "{color.neutral.950}"
445
- },
439
+ "$value": "{color.neutral.0}",
446
440
  "$type": "color",
447
441
  "$description": "Used for the foreground of a danger (destructive) primary button in the default state."
448
442
  },
@@ -468,7 +462,7 @@
468
462
  "default": {
469
463
  "$value": {
470
464
  "default": "{color.red.500}",
471
- "dark": "{color.red.300}"
465
+ "dark": "{color.red.400}"
472
466
  },
473
467
  "$type": "color",
474
468
  "$description": "Used for the background of a danger (destructive) primary button in the default state."
@@ -476,7 +470,7 @@
476
470
  "hover": {
477
471
  "$value": {
478
472
  "default": "{color.red.600}",
479
- "dark": "{color.red.200}"
473
+ "dark": "{color.red.300}"
480
474
  },
481
475
  "$type": "color",
482
476
  "$description": "Used for the background of a danger (destructive) primary button in the hover state."
@@ -489,7 +483,7 @@
489
483
  "active": {
490
484
  "$value": {
491
485
  "default": "{color.red.800}",
492
- "dark": "{color.red.400}"
486
+ "dark": "{color.red.100}"
493
487
  },
494
488
  "$type": "color",
495
489
  "$description": "Used for the background of a danger (destructive) primary button in the active state."
@@ -501,7 +495,7 @@
501
495
  "default": {
502
496
  "$value": {
503
497
  "default": "{color.red.600}",
504
- "dark": "{color.alpha.0}"
498
+ "dark": "{color.red.300}"
505
499
  },
506
500
  "$type": "color",
507
501
  "$description": "Used for the border of a danger (destructive) primary button in the default state."
@@ -509,7 +503,7 @@
509
503
  "hover": {
510
504
  "$value": {
511
505
  "default": "{color.red.800}",
512
- "dark": "{color.alpha.0}"
506
+ "dark": "{color.red.100}"
513
507
  },
514
508
  "$type": "color",
515
509
  "$description": "Used for the border of a danger (destructive) primary button in the hover state."
@@ -522,7 +516,7 @@
522
516
  "active": {
523
517
  "$value": {
524
518
  "default": "{color.red.900}",
525
- "dark": "{color.alpha.0}"
519
+ "dark": "{color.red.50}"
526
520
  },
527
521
  "$type": "color",
528
522
  "$description": "Used for the border of a danger (destructive) primary button in the active state."
@@ -536,7 +530,7 @@
536
530
  "default": {
537
531
  "$value": {
538
532
  "default": "{color.red.500}",
539
- "dark": "{color.red.100}"
533
+ "dark": "{color.red.400}"
540
534
  },
541
535
  "$type": "color",
542
536
  "$description": "Used for the foreground of a danger (destructive) button in the default state."
@@ -544,7 +538,7 @@
544
538
  "hover": {
545
539
  "$value": {
546
540
  "default": "{color.red.700}",
547
- "dark": "{color.red.50}"
541
+ "dark": "{color.red.200}"
548
542
  },
549
543
  "$type": "color",
550
544
  "$description": "Used for the foreground of a danger (destructive) button in the hover state."
@@ -557,7 +551,7 @@
557
551
  "active": {
558
552
  "$value": {
559
553
  "default": "{color.red.900}",
560
- "dark": "{button.danger.secondary.foreground.color.focus}"
554
+ "dark": "{color.red.50}"
561
555
  },
562
556
  "$type": "color",
563
557
  "$description": "Used for the foreground of a danger (destructive) button in the active state."
@@ -569,7 +563,7 @@
569
563
  "default": {
570
564
  "$value": {
571
565
  "default": "{color.neutral.0}",
572
- "dark": "rgba(236, 89, 65, 0.40)"
566
+ "dark": "{color.neutral.900}"
573
567
  },
574
568
  "$type": "color",
575
569
  "$description": "Used for the background of an outlined danger (destructive) button in the default state."
@@ -577,7 +571,7 @@
577
571
  "hover": {
578
572
  "$value": {
579
573
  "default": "{color.red.50}",
580
- "dark": "rgba(236, 89, 65, 0.64)"
574
+ "dark": "{color.red.900}"
581
575
  },
582
576
  "$type": "color",
583
577
  "$description": "Used for the background of an outlined danger (destructive) button in the hover state."
@@ -590,7 +584,7 @@
590
584
  "active": {
591
585
  "$value": {
592
586
  "default": "{color.red.100}",
593
- "dark": "rgba(236, 89, 65, 0.32)"
587
+ "dark": "{color.red.800}"
594
588
  },
595
589
  "$type": "color",
596
590
  "$description": "Used for the background of an outlined danger (destructive) button in the active state."
@@ -602,7 +596,7 @@
602
596
  "default": {
603
597
  "$value": {
604
598
  "default": "{color.red.500}",
605
- "dark": "{color.alpha.0}"
599
+ "dark": "{color.red.400}"
606
600
  },
607
601
  "$type": "color",
608
602
  "$description": "Used for the border of an outlined danger (destructive) button in the default state."
@@ -610,7 +604,7 @@
610
604
  "hover": {
611
605
  "$value": {
612
606
  "default": "{color.red.700}",
613
- "dark": "{color.alpha.0}"
607
+ "dark": "{color.red.200}"
614
608
  },
615
609
  "$type": "color",
616
610
  "$description": "Used for the border of an outlined danger (destructive) button in the hover state."
@@ -623,7 +617,7 @@
623
617
  "active": {
624
618
  "$value": {
625
619
  "default": "{color.red.900}",
626
- "dark": "{color.alpha.0}"
620
+ "dark": "{color.red.50}"
627
621
  },
628
622
  "$type": "color",
629
623
  "$description": "Used for the border of an outlined danger (destructive) button in the active state."
@@ -859,7 +853,7 @@
859
853
  "color": {
860
854
  "$value": {
861
855
  "default": "{color.neutral.10}",
862
- "dark": "rgba(137, 136, 141, 0.16)"
856
+ "dark": "{color.neutral.950}"
863
857
  },
864
858
  "$type": "color",
865
859
  "$description": "Used for the background of a disabled button."
@@ -869,7 +863,7 @@
869
863
  "color": {
870
864
  "$value": {
871
865
  "default": "{color.neutral.100}",
872
- "dark": "{color.alpha.0}"
866
+ "dark": "{color.neutral.800}"
873
867
  },
874
868
  "$type": "color",
875
869
  "$description": "Used for the border of a disabled button."