@primer/primitives 0.0.0-20250129074101 → 0.0.0-20250129080902

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 (48) hide show
  1. package/dist/css/functional/themes/dark-colorblind.css +18 -14
  2. package/dist/css/functional/themes/dark-dimmed.css +16 -12
  3. package/dist/css/functional/themes/dark-high-contrast.css +8 -4
  4. package/dist/css/functional/themes/dark-tritanopia.css +18 -14
  5. package/dist/css/functional/themes/dark.css +18 -14
  6. package/dist/css/functional/themes/light-colorblind.css +10 -6
  7. package/dist/css/functional/themes/light-high-contrast.css +4 -0
  8. package/dist/css/functional/themes/light-tritanopia.css +10 -6
  9. package/dist/css/functional/themes/light.css +10 -6
  10. package/dist/docs/functional/themes/dark-colorblind.json +234 -72
  11. package/dist/docs/functional/themes/dark-dimmed.json +172 -44
  12. package/dist/docs/functional/themes/dark-high-contrast.json +94 -20
  13. package/dist/docs/functional/themes/dark-tritanopia.json +234 -72
  14. package/dist/docs/functional/themes/dark.json +234 -72
  15. package/dist/docs/functional/themes/light-colorblind.json +211 -59
  16. package/dist/docs/functional/themes/light-high-contrast.json +117 -21
  17. package/dist/docs/functional/themes/light-tritanopia.json +211 -59
  18. package/dist/docs/functional/themes/light.json +211 -59
  19. package/dist/figma/themes/dark-colorblind.json +51 -11
  20. package/dist/figma/themes/dark-dimmed.json +45 -8
  21. package/dist/figma/themes/dark-high-contrast.json +35 -2
  22. package/dist/figma/themes/dark-tritanopia.json +51 -11
  23. package/dist/figma/themes/dark.json +51 -11
  24. package/dist/figma/themes/light-colorblind.json +40 -5
  25. package/dist/figma/themes/light-high-contrast.json +32 -0
  26. package/dist/figma/themes/light-tritanopia.json +40 -5
  27. package/dist/figma/themes/light.json +40 -5
  28. package/dist/internalCss/dark-colorblind.css +18 -14
  29. package/dist/internalCss/dark-dimmed.css +16 -12
  30. package/dist/internalCss/dark-high-contrast.css +8 -4
  31. package/dist/internalCss/dark-tritanopia.css +18 -14
  32. package/dist/internalCss/dark.css +18 -14
  33. package/dist/internalCss/light-colorblind.css +10 -6
  34. package/dist/internalCss/light-high-contrast.css +4 -0
  35. package/dist/internalCss/light-tritanopia.css +10 -6
  36. package/dist/internalCss/light.css +10 -6
  37. package/dist/styleLint/functional/themes/dark-colorblind.json +234 -72
  38. package/dist/styleLint/functional/themes/dark-dimmed.json +172 -44
  39. package/dist/styleLint/functional/themes/dark-high-contrast.json +94 -20
  40. package/dist/styleLint/functional/themes/dark-tritanopia.json +234 -72
  41. package/dist/styleLint/functional/themes/dark.json +234 -72
  42. package/dist/styleLint/functional/themes/light-colorblind.json +211 -59
  43. package/dist/styleLint/functional/themes/light-high-contrast.json +117 -21
  44. package/dist/styleLint/functional/themes/light-tritanopia.json +211 -59
  45. package/dist/styleLint/functional/themes/light.json +211 -59
  46. package/package.json +1 -1
  47. package/src/tokens/component/button.json5 +106 -69
  48. package/src/tokens/functional/color/control.json5 +120 -111
package/dist/css/functional/themes/dark-colorblind.css CHANGED
@@ -63,6 +63,9 @@
63
63
  --button-danger-shadow-selected: 0px 0px 0px 0px #000000;
64
64
  --button-default-shadow-resting: 0px 0px 0px 0px #000000;
65
65
  --button-invisible-bgColor-disabled: #00000000;
66
+ --button-invisible-borderColor-active: #00000000;
67
+ --button-invisible-borderColor-hover: #00000000;
68
+ --button-invisible-borderColor-rest: #00000000;
66
69
  --button-outline-shadow-selected: 0px 0px 0px 0px #000000;
67
70
  --button-primary-bgColor-disabled: #1158c7;
68
71
  --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
@@ -143,10 +146,10 @@
143
146
  --control-checked-borderColor-active: var(--control-checked-bgColor-active);
144
147
  --control-checked-borderColor-hover: var(--control-checked-bgColor-hover);
145
148
  --control-danger-fgColor-hover: #f0883e;
146
- --control-transparent-bgColor-active: #656c76;
147
- --control-transparent-bgColor-hover: #656c76;
149
+ --control-transparent-bgColor-active: #656c7640;
150
+ --control-transparent-bgColor-hover: #656c7633;
148
151
  --control-transparent-bgColor-rest: #00000000;
149
- --control-transparent-bgColor-selected: #656c76;
152
+ --control-transparent-bgColor-selected: #656c761a;
150
153
  --control-transparent-borderColor-active: #00000000;
151
154
  --control-transparent-borderColor-hover: #00000000;
152
155
  --control-transparent-borderColor-rest: #00000000;
@@ -343,12 +346,11 @@
343
346
  --button-invisible-bgColor-active: var(--control-transparent-bgColor-active);
344
347
  --button-invisible-bgColor-hover: var(--control-transparent-bgColor-hover);
345
348
  --button-invisible-bgColor-rest: var(--control-transparent-bgColor-rest);
346
- --button-invisible-borderColor-rest: var(--control-transparent-borderColor-rest);
347
349
  --button-invisible-iconColor-hover: var(--fgColor-muted);
348
350
  --button-invisible-iconColor-rest: var(--fgColor-muted);
349
351
  --button-primary-bgColor-rest: var(--bgColor-success-emphasis);
350
- --button-primary-borderColor-rest: #ffffff;
351
- --button-primary-fgColor-disabled: #ffffff;
352
+ --button-primary-borderColor-rest: #ffffff1a;
353
+ --button-primary-fgColor-disabled: #ffffff66;
352
354
  --card-bgColor: var(--bgColor-muted);
353
355
  --codeMirror-activeline-bgColor: var(--bgColor-neutral-muted);
354
356
  --codeMirror-bgColor: var(--bgColor-default);
@@ -373,7 +375,7 @@
373
375
  --control-checked-bgColor-disabled: var(--fgColor-disabled);
374
376
  --control-checked-bgColor-rest: var(--bgColor-accent-emphasis);
375
377
  --control-checked-fgColor-disabled: #010409;
376
- --control-danger-bgColor-active: var(--bgColor-danger-muted);
378
+ --control-danger-bgColor-active: #db6d2866;
377
379
  --control-danger-bgColor-hover: var(--bgColor-danger-muted);
378
380
  --control-danger-fgColor-rest: var(--fgColor-danger);
379
381
  --control-fgColor-disabled: var(--fgColor-disabled);
@@ -525,6 +527,9 @@
525
527
  --button-danger-shadow-selected: 0px 0px 0px 0px #000000;
526
528
  --button-default-shadow-resting: 0px 0px 0px 0px #000000;
527
529
  --button-invisible-bgColor-disabled: #00000000;
530
+ --button-invisible-borderColor-active: #00000000;
531
+ --button-invisible-borderColor-hover: #00000000;
532
+ --button-invisible-borderColor-rest: #00000000;
528
533
  --button-outline-shadow-selected: 0px 0px 0px 0px #000000;
529
534
  --button-primary-bgColor-disabled: #1158c7;
530
535
  --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
@@ -605,10 +610,10 @@
605
610
  --control-checked-borderColor-active: var(--control-checked-bgColor-active);
606
611
  --control-checked-borderColor-hover: var(--control-checked-bgColor-hover);
607
612
  --control-danger-fgColor-hover: #f0883e;
608
- --control-transparent-bgColor-active: #656c76;
609
- --control-transparent-bgColor-hover: #656c76;
613
+ --control-transparent-bgColor-active: #656c7640;
614
+ --control-transparent-bgColor-hover: #656c7633;
610
615
  --control-transparent-bgColor-rest: #00000000;
611
- --control-transparent-bgColor-selected: #656c76;
616
+ --control-transparent-bgColor-selected: #656c761a;
612
617
  --control-transparent-borderColor-active: #00000000;
613
618
  --control-transparent-borderColor-hover: #00000000;
614
619
  --control-transparent-borderColor-rest: #00000000;
@@ -805,12 +810,11 @@
805
810
  --button-invisible-bgColor-active: var(--control-transparent-bgColor-active);
806
811
  --button-invisible-bgColor-hover: var(--control-transparent-bgColor-hover);
807
812
  --button-invisible-bgColor-rest: var(--control-transparent-bgColor-rest);
808
- --button-invisible-borderColor-rest: var(--control-transparent-borderColor-rest);
809
813
  --button-invisible-iconColor-hover: var(--fgColor-muted);
810
814
  --button-invisible-iconColor-rest: var(--fgColor-muted);
811
815
  --button-primary-bgColor-rest: var(--bgColor-success-emphasis);
812
- --button-primary-borderColor-rest: #ffffff;
813
- --button-primary-fgColor-disabled: #ffffff;
816
+ --button-primary-borderColor-rest: #ffffff1a;
817
+ --button-primary-fgColor-disabled: #ffffff66;
814
818
  --card-bgColor: var(--bgColor-muted);
815
819
  --codeMirror-activeline-bgColor: var(--bgColor-neutral-muted);
816
820
  --codeMirror-bgColor: var(--bgColor-default);
@@ -835,7 +839,7 @@
835
839
  --control-checked-bgColor-disabled: var(--fgColor-disabled);
836
840
  --control-checked-bgColor-rest: var(--bgColor-accent-emphasis);
837
841
  --control-checked-fgColor-disabled: #010409;
838
- --control-danger-bgColor-active: var(--bgColor-danger-muted);
842
+ --control-danger-bgColor-active: #db6d2866;
839
843
  --control-danger-bgColor-hover: var(--bgColor-danger-muted);
840
844
  --control-danger-fgColor-rest: var(--fgColor-danger);
841
845
  --control-fgColor-disabled: var(--fgColor-disabled);
package/dist/css/functional/themes/dark-dimmed.css CHANGED
@@ -72,6 +72,9 @@
72
72
  --button-inactive-bgColor: #2a313c;
73
73
  --button-inactive-fgColor: #656c76;
74
74
  --button-invisible-bgColor-disabled: #00000000;
75
+ --button-invisible-borderColor-active: #00000000;
76
+ --button-invisible-borderColor-hover: #00000000;
77
+ --button-invisible-borderColor-rest: #00000000;
75
78
  --button-invisible-iconColor-hover: #b7bdc8;
76
79
  --button-invisible-iconColor-rest: #b7bdc8;
77
80
  --button-outline-shadow-selected: 0px 0px 0px 0px #000000;
@@ -355,13 +358,12 @@
355
358
  --button-default-borderColor-active: var(--button-default-borderColor-rest);
356
359
  --button-default-borderColor-disabled: var(--control-borderColor-disabled);
357
360
  --button-default-borderColor-hover: var(--button-default-borderColor-rest);
358
- --button-invisible-bgColor-active: var(--control-transparent-bgColor-active);
359
- --button-invisible-bgColor-hover: var(--control-transparent-bgColor-hover);
361
+ --button-invisible-bgColor-active: #656c7640;
362
+ --button-invisible-bgColor-hover: #656c7633;
360
363
  --button-invisible-bgColor-rest: var(--control-transparent-bgColor-rest);
361
- --button-invisible-borderColor-rest: var(--control-transparent-borderColor-rest);
362
364
  --button-primary-bgColor-rest: var(--bgColor-success-emphasis);
363
- --button-primary-borderColor-rest: #cdd9e5;
364
- --button-primary-fgColor-disabled: #cdd9e5;
365
+ --button-primary-borderColor-rest: #cdd9e51a;
366
+ --button-primary-fgColor-disabled: #cdd9e566;
365
367
  --card-bgColor: var(--bgColor-muted);
366
368
  --codeMirror-activeline-bgColor: var(--bgColor-neutral-muted);
367
369
  --codeMirror-bgColor: var(--bgColor-default);
@@ -385,7 +387,7 @@
385
387
  --control-checked-bgColor-rest: var(--bgColor-accent-emphasis);
386
388
  --control-checked-fgColor-disabled: #1c2128;
387
389
  --control-checked-fgColor-rest: var(--fgColor-onEmphasis);
388
- --control-danger-bgColor-active: var(--bgColor-danger-muted);
390
+ --control-danger-bgColor-active: #e5534b66;
389
391
  --control-danger-bgColor-hover: var(--bgColor-danger-muted);
390
392
  --control-danger-fgColor-rest: var(--fgColor-danger);
391
393
  --control-fgColor-disabled: var(--fgColor-disabled);
@@ -536,6 +538,9 @@
536
538
  --button-inactive-bgColor: #2a313c;
537
539
  --button-inactive-fgColor: #656c76;
538
540
  --button-invisible-bgColor-disabled: #00000000;
541
+ --button-invisible-borderColor-active: #00000000;
542
+ --button-invisible-borderColor-hover: #00000000;
543
+ --button-invisible-borderColor-rest: #00000000;
539
544
  --button-invisible-iconColor-hover: #b7bdc8;
540
545
  --button-invisible-iconColor-rest: #b7bdc8;
541
546
  --button-outline-shadow-selected: 0px 0px 0px 0px #000000;
@@ -819,13 +824,12 @@
819
824
  --button-default-borderColor-active: var(--button-default-borderColor-rest);
820
825
  --button-default-borderColor-disabled: var(--control-borderColor-disabled);
821
826
  --button-default-borderColor-hover: var(--button-default-borderColor-rest);
822
- --button-invisible-bgColor-active: var(--control-transparent-bgColor-active);
823
- --button-invisible-bgColor-hover: var(--control-transparent-bgColor-hover);
827
+ --button-invisible-bgColor-active: #656c7640;
828
+ --button-invisible-bgColor-hover: #656c7633;
824
829
  --button-invisible-bgColor-rest: var(--control-transparent-bgColor-rest);
825
- --button-invisible-borderColor-rest: var(--control-transparent-borderColor-rest);
826
830
  --button-primary-bgColor-rest: var(--bgColor-success-emphasis);
827
- --button-primary-borderColor-rest: #cdd9e5;
828
- --button-primary-fgColor-disabled: #cdd9e5;
831
+ --button-primary-borderColor-rest: #cdd9e51a;
832
+ --button-primary-fgColor-disabled: #cdd9e566;
829
833
  --card-bgColor: var(--bgColor-muted);
830
834
  --codeMirror-activeline-bgColor: var(--bgColor-neutral-muted);
831
835
  --codeMirror-bgColor: var(--bgColor-default);
@@ -849,7 +853,7 @@
849
853
  --control-checked-bgColor-rest: var(--bgColor-accent-emphasis);
850
854
  --control-checked-fgColor-disabled: #1c2128;
851
855
  --control-checked-fgColor-rest: var(--fgColor-onEmphasis);
852
- --control-danger-bgColor-active: var(--bgColor-danger-muted);
856
+ --control-danger-bgColor-active: #e5534b66;
853
857
  --control-danger-bgColor-hover: var(--bgColor-danger-muted);
854
858
  --control-danger-fgColor-rest: var(--fgColor-danger);
855
859
  --control-fgColor-disabled: var(--fgColor-disabled);
package/dist/css/functional/themes/dark-high-contrast.css CHANGED
@@ -66,6 +66,9 @@
66
66
  --button-invisible-bgColor-active: #212830;
67
67
  --button-invisible-bgColor-disabled: #00000000;
68
68
  --button-invisible-bgColor-hover: #151b23;
69
+ --button-invisible-borderColor-active: #00000000;
70
+ --button-invisible-borderColor-hover: #00000000;
71
+ --button-invisible-borderColor-rest: #00000000;
69
72
  --button-invisible-iconColor-hover: #d1d7e0;
70
73
  --button-invisible-iconColor-rest: #d1d7e0;
71
74
  --button-outline-shadow-selected: 0px 0px 0px 0px #000000;
@@ -346,9 +349,8 @@
346
349
  --button-default-bgColor-selected: var(--control-bgColor-active);
347
350
  --button-inactive-bgColor: var(--control-bgColor-rest);
348
351
  --button-invisible-bgColor-rest: var(--control-transparent-bgColor-rest);
349
- --button-invisible-borderColor-rest: var(--control-transparent-borderColor-rest);
350
352
  --button-primary-bgColor-rest: var(--bgColor-success-emphasis);
351
- --button-primary-fgColor-disabled: #ffffff;
353
+ --button-primary-fgColor-disabled: #ffffff66;
352
354
  --buttonCounter-danger-bgColor-hover: #01040926;
353
355
  --buttonCounter-danger-bgColor-rest: #01040926;
354
356
  --buttonCounter-primary-bgColor-rest: #01040926;
@@ -535,6 +537,9 @@
535
537
  --button-invisible-bgColor-active: #212830;
536
538
  --button-invisible-bgColor-disabled: #00000000;
537
539
  --button-invisible-bgColor-hover: #151b23;
540
+ --button-invisible-borderColor-active: #00000000;
541
+ --button-invisible-borderColor-hover: #00000000;
542
+ --button-invisible-borderColor-rest: #00000000;
538
543
  --button-invisible-iconColor-hover: #d1d7e0;
539
544
  --button-invisible-iconColor-rest: #d1d7e0;
540
545
  --button-outline-shadow-selected: 0px 0px 0px 0px #000000;
@@ -815,9 +820,8 @@
815
820
  --button-default-bgColor-selected: var(--control-bgColor-active);
816
821
  --button-inactive-bgColor: var(--control-bgColor-rest);
817
822
  --button-invisible-bgColor-rest: var(--control-transparent-bgColor-rest);
818
- --button-invisible-borderColor-rest: var(--control-transparent-borderColor-rest);
819
823
  --button-primary-bgColor-rest: var(--bgColor-success-emphasis);
820
- --button-primary-fgColor-disabled: #ffffff;
824
+ --button-primary-fgColor-disabled: #ffffff66;
821
825
  --buttonCounter-danger-bgColor-hover: #01040926;
822
826
  --buttonCounter-danger-bgColor-rest: #01040926;
823
827
  --buttonCounter-primary-bgColor-rest: #01040926;
package/dist/css/functional/themes/dark-tritanopia.css CHANGED
@@ -64,6 +64,9 @@
64
64
  --button-danger-shadow-selected: 0px 0px 0px 0px #000000;
65
65
  --button-default-shadow-resting: 0px 0px 0px 0px #000000;
66
66
  --button-invisible-bgColor-disabled: #00000000;
67
+ --button-invisible-borderColor-active: #00000000;
68
+ --button-invisible-borderColor-hover: #00000000;
69
+ --button-invisible-borderColor-rest: #00000000;
67
70
  --button-outline-shadow-selected: 0px 0px 0px 0px #000000;
68
71
  --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
69
72
  --codeMirror-syntax-fgColor-comment: #656c76;
@@ -143,10 +146,10 @@
143
146
  --control-checked-borderColor-active: var(--control-checked-bgColor-active);
144
147
  --control-checked-borderColor-hover: var(--control-checked-bgColor-hover);
145
148
  --control-danger-fgColor-hover: #ff7b72;
146
- --control-transparent-bgColor-active: #656c76;
147
- --control-transparent-bgColor-hover: #656c76;
149
+ --control-transparent-bgColor-active: #656c7640;
150
+ --control-transparent-bgColor-hover: #656c7633;
148
151
  --control-transparent-bgColor-rest: #00000000;
149
- --control-transparent-bgColor-selected: #656c76;
152
+ --control-transparent-bgColor-selected: #656c761a;
150
153
  --control-transparent-borderColor-active: #00000000;
151
154
  --control-transparent-borderColor-hover: #00000000;
152
155
  --control-transparent-borderColor-rest: #00000000;
@@ -341,12 +344,11 @@
341
344
  --button-invisible-bgColor-active: var(--control-transparent-bgColor-active);
342
345
  --button-invisible-bgColor-hover: var(--control-transparent-bgColor-hover);
343
346
  --button-invisible-bgColor-rest: var(--control-transparent-bgColor-rest);
344
- --button-invisible-borderColor-rest: var(--control-transparent-borderColor-rest);
345
347
  --button-invisible-iconColor-hover: var(--fgColor-muted);
346
348
  --button-invisible-iconColor-rest: var(--fgColor-muted);
347
349
  --button-primary-bgColor-rest: var(--bgColor-success-emphasis);
348
- --button-primary-borderColor-rest: #ffffff;
349
- --button-primary-fgColor-disabled: #ffffff;
350
+ --button-primary-borderColor-rest: #ffffff1a;
351
+ --button-primary-fgColor-disabled: #ffffff66;
350
352
  --card-bgColor: var(--bgColor-muted);
351
353
  --codeMirror-activeline-bgColor: var(--bgColor-neutral-muted);
352
354
  --codeMirror-bgColor: var(--bgColor-default);
@@ -371,7 +373,7 @@
371
373
  --control-checked-bgColor-disabled: var(--fgColor-disabled);
372
374
  --control-checked-bgColor-rest: var(--bgColor-accent-emphasis);
373
375
  --control-checked-fgColor-disabled: #010409;
374
- --control-danger-bgColor-active: var(--bgColor-danger-muted);
376
+ --control-danger-bgColor-active: #f8514966;
375
377
  --control-danger-bgColor-hover: var(--bgColor-danger-muted);
376
378
  --control-danger-fgColor-rest: var(--fgColor-danger);
377
379
  --control-fgColor-disabled: var(--fgColor-disabled);
@@ -525,6 +527,9 @@
525
527
  --button-danger-shadow-selected: 0px 0px 0px 0px #000000;
526
528
  --button-default-shadow-resting: 0px 0px 0px 0px #000000;
527
529
  --button-invisible-bgColor-disabled: #00000000;
530
+ --button-invisible-borderColor-active: #00000000;
531
+ --button-invisible-borderColor-hover: #00000000;
532
+ --button-invisible-borderColor-rest: #00000000;
528
533
  --button-outline-shadow-selected: 0px 0px 0px 0px #000000;
529
534
  --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
530
535
  --codeMirror-syntax-fgColor-comment: #656c76;
@@ -604,10 +609,10 @@
604
609
  --control-checked-borderColor-active: var(--control-checked-bgColor-active);
605
610
  --control-checked-borderColor-hover: var(--control-checked-bgColor-hover);
606
611
  --control-danger-fgColor-hover: #ff7b72;
607
- --control-transparent-bgColor-active: #656c76;
608
- --control-transparent-bgColor-hover: #656c76;
612
+ --control-transparent-bgColor-active: #656c7640;
613
+ --control-transparent-bgColor-hover: #656c7633;
609
614
  --control-transparent-bgColor-rest: #00000000;
610
- --control-transparent-bgColor-selected: #656c76;
615
+ --control-transparent-bgColor-selected: #656c761a;
611
616
  --control-transparent-borderColor-active: #00000000;
612
617
  --control-transparent-borderColor-hover: #00000000;
613
618
  --control-transparent-borderColor-rest: #00000000;
@@ -802,12 +807,11 @@
802
807
  --button-invisible-bgColor-active: var(--control-transparent-bgColor-active);
803
808
  --button-invisible-bgColor-hover: var(--control-transparent-bgColor-hover);
804
809
  --button-invisible-bgColor-rest: var(--control-transparent-bgColor-rest);
805
- --button-invisible-borderColor-rest: var(--control-transparent-borderColor-rest);
806
810
  --button-invisible-iconColor-hover: var(--fgColor-muted);
807
811
  --button-invisible-iconColor-rest: var(--fgColor-muted);
808
812
  --button-primary-bgColor-rest: var(--bgColor-success-emphasis);
809
- --button-primary-borderColor-rest: #ffffff;
810
- --button-primary-fgColor-disabled: #ffffff;
813
+ --button-primary-borderColor-rest: #ffffff1a;
814
+ --button-primary-fgColor-disabled: #ffffff66;
811
815
  --card-bgColor: var(--bgColor-muted);
812
816
  --codeMirror-activeline-bgColor: var(--bgColor-neutral-muted);
813
817
  --codeMirror-bgColor: var(--bgColor-default);
@@ -832,7 +836,7 @@
832
836
  --control-checked-bgColor-disabled: var(--fgColor-disabled);
833
837
  --control-checked-bgColor-rest: var(--bgColor-accent-emphasis);
834
838
  --control-checked-fgColor-disabled: #010409;
835
- --control-danger-bgColor-active: var(--bgColor-danger-muted);
839
+ --control-danger-bgColor-active: #f8514966;
836
840
  --control-danger-bgColor-hover: var(--bgColor-danger-muted);
837
841
  --control-danger-fgColor-rest: var(--fgColor-danger);
838
842
  --control-fgColor-disabled: var(--fgColor-disabled);
package/dist/css/functional/themes/dark.css CHANGED
@@ -57,6 +57,9 @@
57
57
  --button-danger-shadow-selected: 0px 0px 0px 0px #000000;
58
58
  --button-default-shadow-resting: 0px 0px 0px 0px #000000;
59
59
  --button-invisible-bgColor-disabled: #00000000;
60
+ --button-invisible-borderColor-active: #00000000;
61
+ --button-invisible-borderColor-hover: #00000000;
62
+ --button-invisible-borderColor-rest: #00000000;
60
63
  --button-outline-shadow-selected: 0px 0px 0px 0px #000000;
61
64
  --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
62
65
  --codeMirror-syntax-fgColor-comment: #656c76;
@@ -136,10 +139,10 @@
136
139
  --control-checked-borderColor-active: var(--control-checked-bgColor-active);
137
140
  --control-checked-borderColor-hover: var(--control-checked-bgColor-hover);
138
141
  --control-danger-fgColor-hover: #ff7b72;
139
- --control-transparent-bgColor-active: #656c76;
140
- --control-transparent-bgColor-hover: #656c76;
142
+ --control-transparent-bgColor-active: #656c7640;
143
+ --control-transparent-bgColor-hover: #656c7633;
141
144
  --control-transparent-bgColor-rest: #00000000;
142
- --control-transparent-bgColor-selected: #656c76;
145
+ --control-transparent-bgColor-selected: #656c761a;
143
146
  --control-transparent-borderColor-active: #00000000;
144
147
  --control-transparent-borderColor-hover: #00000000;
145
148
  --control-transparent-borderColor-rest: #00000000;
@@ -335,12 +338,11 @@
335
338
  --button-invisible-bgColor-active: var(--control-transparent-bgColor-active);
336
339
  --button-invisible-bgColor-hover: var(--control-transparent-bgColor-hover);
337
340
  --button-invisible-bgColor-rest: var(--control-transparent-bgColor-rest);
338
- --button-invisible-borderColor-rest: var(--control-transparent-borderColor-rest);
339
341
  --button-invisible-iconColor-hover: var(--fgColor-muted);
340
342
  --button-invisible-iconColor-rest: var(--fgColor-muted);
341
343
  --button-primary-bgColor-rest: var(--bgColor-success-emphasis);
342
- --button-primary-borderColor-rest: #ffffff;
343
- --button-primary-fgColor-disabled: #ffffff;
344
+ --button-primary-borderColor-rest: #ffffff1a;
345
+ --button-primary-fgColor-disabled: #ffffff66;
344
346
  --card-bgColor: var(--bgColor-muted);
345
347
  --codeMirror-activeline-bgColor: var(--bgColor-neutral-muted);
346
348
  --codeMirror-bgColor: var(--bgColor-default);
@@ -365,7 +367,7 @@
365
367
  --control-checked-bgColor-disabled: var(--fgColor-disabled);
366
368
  --control-checked-bgColor-rest: var(--bgColor-accent-emphasis);
367
369
  --control-checked-fgColor-disabled: #010409;
368
- --control-danger-bgColor-active: var(--bgColor-danger-muted);
370
+ --control-danger-bgColor-active: #f8514966;
369
371
  --control-danger-bgColor-hover: var(--bgColor-danger-muted);
370
372
  --control-danger-fgColor-rest: var(--fgColor-danger);
371
373
  --control-fgColor-disabled: var(--fgColor-disabled);
@@ -515,6 +517,9 @@
515
517
  --button-danger-shadow-selected: 0px 0px 0px 0px #000000;
516
518
  --button-default-shadow-resting: 0px 0px 0px 0px #000000;
517
519
  --button-invisible-bgColor-disabled: #00000000;
520
+ --button-invisible-borderColor-active: #00000000;
521
+ --button-invisible-borderColor-hover: #00000000;
522
+ --button-invisible-borderColor-rest: #00000000;
518
523
  --button-outline-shadow-selected: 0px 0px 0px 0px #000000;
519
524
  --button-primary-shadow-selected: 0px 0px 0px 0px #000000;
520
525
  --codeMirror-syntax-fgColor-comment: #656c76;
@@ -594,10 +599,10 @@
594
599
  --control-checked-borderColor-active: var(--control-checked-bgColor-active);
595
600
  --control-checked-borderColor-hover: var(--control-checked-bgColor-hover);
596
601
  --control-danger-fgColor-hover: #ff7b72;
597
- --control-transparent-bgColor-active: #656c76;
598
- --control-transparent-bgColor-hover: #656c76;
602
+ --control-transparent-bgColor-active: #656c7640;
603
+ --control-transparent-bgColor-hover: #656c7633;
599
604
  --control-transparent-bgColor-rest: #00000000;
600
- --control-transparent-bgColor-selected: #656c76;
605
+ --control-transparent-bgColor-selected: #656c761a;
601
606
  --control-transparent-borderColor-active: #00000000;
602
607
  --control-transparent-borderColor-hover: #00000000;
603
608
  --control-transparent-borderColor-rest: #00000000;
@@ -793,12 +798,11 @@
793
798
  --button-invisible-bgColor-active: var(--control-transparent-bgColor-active);
794
799
  --button-invisible-bgColor-hover: var(--control-transparent-bgColor-hover);
795
800
  --button-invisible-bgColor-rest: var(--control-transparent-bgColor-rest);
796
- --button-invisible-borderColor-rest: var(--control-transparent-borderColor-rest);
797
801
  --button-invisible-iconColor-hover: var(--fgColor-muted);
798
802
  --button-invisible-iconColor-rest: var(--fgColor-muted);
799
803
  --button-primary-bgColor-rest: var(--bgColor-success-emphasis);
800
- --button-primary-borderColor-rest: #ffffff;
801
- --button-primary-fgColor-disabled: #ffffff;
804
+ --button-primary-borderColor-rest: #ffffff1a;
805
+ --button-primary-fgColor-disabled: #ffffff66;
802
806
  --card-bgColor: var(--bgColor-muted);
803
807
  --codeMirror-activeline-bgColor: var(--bgColor-neutral-muted);
804
808
  --codeMirror-bgColor: var(--bgColor-default);
@@ -823,7 +827,7 @@
823
827
  --control-checked-bgColor-disabled: var(--fgColor-disabled);
824
828
  --control-checked-bgColor-rest: var(--bgColor-accent-emphasis);
825
829
  --control-checked-fgColor-disabled: #010409;
826
- --control-danger-bgColor-active: var(--bgColor-danger-muted);
830
+ --control-danger-bgColor-active: #f8514966;
827
831
  --control-danger-bgColor-hover: var(--bgColor-danger-muted);
828
832
  --control-danger-fgColor-rest: var(--fgColor-danger);
829
833
  --control-fgColor-disabled: var(--fgColor-disabled);
package/dist/css/functional/themes/light-colorblind.css CHANGED
@@ -135,10 +135,10 @@
135
135
  --control-checked-borderColor-active: var(--control-checked-bgColor-active);
136
136
  --control-checked-borderColor-hover: var(--control-checked-bgColor-hover);
137
137
  --control-fgColor-rest: #25292e;
138
- --control-transparent-bgColor-active: #818b98;
139
- --control-transparent-bgColor-hover: #818b98;
138
+ --control-transparent-bgColor-active: #818b9826;
139
+ --control-transparent-bgColor-hover: #818b981a;
140
140
  --control-transparent-bgColor-rest: #ffffff00;
141
- --control-transparent-bgColor-selected: #818b98;
141
+ --control-transparent-bgColor-selected: #818b9826;
142
142
  --control-transparent-borderColor-active: #ffffff00;
143
143
  --control-transparent-borderColor-hover: #ffffff00;
144
144
  --control-transparent-borderColor-rest: #ffffff00;
@@ -336,6 +336,8 @@
336
336
  --button-invisible-bgColor-active: var(--control-transparent-bgColor-active);
337
337
  --button-invisible-bgColor-hover: var(--control-transparent-bgColor-hover);
338
338
  --button-invisible-bgColor-rest: var(--control-transparent-bgColor-rest);
339
+ --button-invisible-borderColor-active: var(--control-transparent-borderColor-active);
340
+ --button-invisible-borderColor-hover: var(--control-transparent-borderColor-hover);
339
341
  --button-invisible-borderColor-rest: var(--control-transparent-borderColor-rest);
340
342
  --button-invisible-fgColor-active: var(--control-fgColor-rest);
341
343
  --button-invisible-fgColor-hover: var(--control-fgColor-rest);
@@ -595,10 +597,10 @@
595
597
  --control-checked-borderColor-active: var(--control-checked-bgColor-active);
596
598
  --control-checked-borderColor-hover: var(--control-checked-bgColor-hover);
597
599
  --control-fgColor-rest: #25292e;
598
- --control-transparent-bgColor-active: #818b98;
599
- --control-transparent-bgColor-hover: #818b98;
600
+ --control-transparent-bgColor-active: #818b9826;
601
+ --control-transparent-bgColor-hover: #818b981a;
600
602
  --control-transparent-bgColor-rest: #ffffff00;
601
- --control-transparent-bgColor-selected: #818b98;
603
+ --control-transparent-bgColor-selected: #818b9826;
602
604
  --control-transparent-borderColor-active: #ffffff00;
603
605
  --control-transparent-borderColor-hover: #ffffff00;
604
606
  --control-transparent-borderColor-rest: #ffffff00;
@@ -796,6 +798,8 @@
796
798
  --button-invisible-bgColor-active: var(--control-transparent-bgColor-active);
797
799
  --button-invisible-bgColor-hover: var(--control-transparent-bgColor-hover);
798
800
  --button-invisible-bgColor-rest: var(--control-transparent-bgColor-rest);
801
+ --button-invisible-borderColor-active: var(--control-transparent-borderColor-active);
802
+ --button-invisible-borderColor-hover: var(--control-transparent-borderColor-hover);
799
803
  --button-invisible-borderColor-rest: var(--control-transparent-borderColor-rest);
800
804
  --button-invisible-fgColor-active: var(--control-fgColor-rest);
801
805
  --button-invisible-fgColor-hover: var(--control-fgColor-rest);
package/dist/css/functional/themes/light-high-contrast.css CHANGED
@@ -420,6 +420,8 @@
420
420
  --button-default-borderColor-disabled: var(--control-borderColor-disabled);
421
421
  --button-default-borderColor-hover: var(--control-borderColor-rest);
422
422
  --button-default-borderColor-rest: var(--control-borderColor-rest);
423
+ --button-invisible-borderColor-active: var(--control-transparent-borderColor-active);
424
+ --button-invisible-borderColor-hover: var(--control-transparent-borderColor-hover);
423
425
  --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
424
426
  --button-invisible-iconColor-disabled: var(--control-fgColor-disabled);
425
427
  --button-primary-fgColor-rest: var(--fgColor-white);
@@ -884,6 +886,8 @@
884
886
  --button-default-borderColor-disabled: var(--control-borderColor-disabled);
885
887
  --button-default-borderColor-hover: var(--control-borderColor-rest);
886
888
  --button-default-borderColor-rest: var(--control-borderColor-rest);
889
+ --button-invisible-borderColor-active: var(--control-transparent-borderColor-active);
890
+ --button-invisible-borderColor-hover: var(--control-transparent-borderColor-hover);
887
891
  --button-invisible-fgColor-disabled: var(--control-fgColor-disabled);
888
892
  --button-invisible-iconColor-disabled: var(--control-fgColor-disabled);
889
893
  --button-primary-fgColor-rest: var(--fgColor-white);
package/dist/css/functional/themes/light-tritanopia.css CHANGED
@@ -136,10 +136,10 @@
136
136
  --control-danger-fgColor-hover: var(--fgColor-danger);
137
137
  --control-danger-fgColor-rest: var(--fgColor-danger);
138
138
  --control-fgColor-rest: #25292e;
139
- --control-transparent-bgColor-active: #818b98;
140
- --control-transparent-bgColor-hover: #818b98;
139
+ --control-transparent-bgColor-active: #818b9826;
140
+ --control-transparent-bgColor-hover: #818b981a;
141
141
  --control-transparent-bgColor-rest: #ffffff00;
142
- --control-transparent-bgColor-selected: #818b98;
142
+ --control-transparent-bgColor-selected: #818b9826;
143
143
  --control-transparent-borderColor-active: #ffffff00;
144
144
  --control-transparent-borderColor-hover: #ffffff00;
145
145
  --control-transparent-borderColor-rest: #ffffff00;
@@ -336,6 +336,8 @@
336
336
  --button-invisible-bgColor-active: var(--control-transparent-bgColor-active);
337
337
  --button-invisible-bgColor-hover: var(--control-transparent-bgColor-hover);
338
338
  --button-invisible-bgColor-rest: var(--control-transparent-bgColor-rest);
339
+ --button-invisible-borderColor-active: var(--control-transparent-borderColor-active);
340
+ --button-invisible-borderColor-hover: var(--control-transparent-borderColor-hover);
339
341
  --button-invisible-borderColor-rest: var(--control-transparent-borderColor-rest);
340
342
  --button-invisible-fgColor-active: var(--control-fgColor-rest);
341
343
  --button-invisible-fgColor-hover: var(--control-fgColor-rest);
@@ -594,10 +596,10 @@
594
596
  --control-danger-fgColor-hover: var(--fgColor-danger);
595
597
  --control-danger-fgColor-rest: var(--fgColor-danger);
596
598
  --control-fgColor-rest: #25292e;
597
- --control-transparent-bgColor-active: #818b98;
598
- --control-transparent-bgColor-hover: #818b98;
599
+ --control-transparent-bgColor-active: #818b9826;
600
+ --control-transparent-bgColor-hover: #818b981a;
599
601
  --control-transparent-bgColor-rest: #ffffff00;
600
- --control-transparent-bgColor-selected: #818b98;
602
+ --control-transparent-bgColor-selected: #818b9826;
601
603
  --control-transparent-borderColor-active: #ffffff00;
602
604
  --control-transparent-borderColor-hover: #ffffff00;
603
605
  --control-transparent-borderColor-rest: #ffffff00;
@@ -794,6 +796,8 @@
794
796
  --button-invisible-bgColor-active: var(--control-transparent-bgColor-active);
795
797
  --button-invisible-bgColor-hover: var(--control-transparent-bgColor-hover);
796
798
  --button-invisible-bgColor-rest: var(--control-transparent-bgColor-rest);
799
+ --button-invisible-borderColor-active: var(--control-transparent-borderColor-active);
800
+ --button-invisible-borderColor-hover: var(--control-transparent-borderColor-hover);
797
801
  --button-invisible-borderColor-rest: var(--control-transparent-borderColor-rest);
798
802
  --button-invisible-fgColor-active: var(--control-fgColor-rest);
799
803
  --button-invisible-fgColor-hover: var(--control-fgColor-rest);
package/dist/css/functional/themes/light.css CHANGED
@@ -134,10 +134,10 @@
134
134
  --control-danger-fgColor-hover: var(--fgColor-danger);
135
135
  --control-danger-fgColor-rest: var(--fgColor-danger);
136
136
  --control-fgColor-rest: #25292e;
137
- --control-transparent-bgColor-active: #818b98;
138
- --control-transparent-bgColor-hover: #818b98;
137
+ --control-transparent-bgColor-active: #818b9826;
138
+ --control-transparent-bgColor-hover: #818b981a;
139
139
  --control-transparent-bgColor-rest: #ffffff00;
140
- --control-transparent-bgColor-selected: #818b98;
140
+ --control-transparent-bgColor-selected: #818b9826;
141
141
  --control-transparent-borderColor-active: #ffffff00;
142
142
  --control-transparent-borderColor-hover: #ffffff00;
143
143
  --control-transparent-borderColor-rest: #ffffff00;
@@ -335,6 +335,8 @@
335
335
  --button-invisible-bgColor-active: var(--control-transparent-bgColor-active);
336
336
  --button-invisible-bgColor-hover: var(--control-transparent-bgColor-hover);
337
337
  --button-invisible-bgColor-rest: var(--control-transparent-bgColor-rest);
338
+ --button-invisible-borderColor-active: var(--control-transparent-borderColor-active);
339
+ --button-invisible-borderColor-hover: var(--control-transparent-borderColor-hover);
338
340
  --button-invisible-borderColor-rest: var(--control-transparent-borderColor-rest);
339
341
  --button-invisible-fgColor-active: var(--control-fgColor-rest);
340
342
  --button-invisible-fgColor-hover: var(--control-fgColor-rest);
@@ -592,10 +594,10 @@
592
594
  --control-danger-fgColor-hover: var(--fgColor-danger);
593
595
  --control-danger-fgColor-rest: var(--fgColor-danger);
594
596
  --control-fgColor-rest: #25292e;
595
- --control-transparent-bgColor-active: #818b98;
596
- --control-transparent-bgColor-hover: #818b98;
597
+ --control-transparent-bgColor-active: #818b9826;
598
+ --control-transparent-bgColor-hover: #818b981a;
597
599
  --control-transparent-bgColor-rest: #ffffff00;
598
- --control-transparent-bgColor-selected: #818b98;
600
+ --control-transparent-bgColor-selected: #818b9826;
599
601
  --control-transparent-borderColor-active: #ffffff00;
600
602
  --control-transparent-borderColor-hover: #ffffff00;
601
603
  --control-transparent-borderColor-rest: #ffffff00;
@@ -793,6 +795,8 @@
793
795
  --button-invisible-bgColor-active: var(--control-transparent-bgColor-active);
794
796
  --button-invisible-bgColor-hover: var(--control-transparent-bgColor-hover);
795
797
  --button-invisible-bgColor-rest: var(--control-transparent-bgColor-rest);
798
+ --button-invisible-borderColor-active: var(--control-transparent-borderColor-active);
799
+ --button-invisible-borderColor-hover: var(--control-transparent-borderColor-hover);
796
800
  --button-invisible-borderColor-rest: var(--control-transparent-borderColor-rest);
797
801
  --button-invisible-fgColor-active: var(--control-fgColor-rest);
798
802
  --button-invisible-fgColor-hover: var(--control-fgColor-rest);