@gitlab/ui 89.2.0 → 89.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (30) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/dist/index.css +2 -2
  3. package/dist/index.css.map +1 -1
  4. package/dist/tokens/build/js/tokens.dark.js +116 -92
  5. package/dist/tokens/build/js/tokens.js +33 -9
  6. package/dist/tokens/css/tokens.css +38 -14
  7. package/dist/tokens/css/tokens.dark.css +95 -71
  8. package/dist/tokens/js/tokens.dark.js +115 -91
  9. package/dist/tokens/js/tokens.js +32 -8
  10. package/dist/tokens/json/tokens.dark.json +744 -177
  11. package/dist/tokens/json/tokens.json +661 -94
  12. package/dist/tokens/scss/_tokens.dark.scss +95 -71
  13. package/dist/tokens/scss/_tokens.scss +38 -14
  14. package/dist/tokens/scss/_tokens_custom_properties.scss +24 -0
  15. package/package.json +3 -3
  16. package/src/components/base/badge/badge.scss +65 -32
  17. package/src/components/base/datepicker/datepicker.scss +5 -0
  18. package/src/components/base/toggle/toggle.scss +8 -5
  19. package/src/tokens/action.tokens.json +171 -3
  20. package/src/tokens/build/css/tokens.css +38 -14
  21. package/src/tokens/build/css/tokens.dark.css +95 -71
  22. package/src/tokens/build/js/tokens.dark.js +115 -91
  23. package/src/tokens/build/js/tokens.js +32 -8
  24. package/src/tokens/build/json/tokens.dark.json +744 -177
  25. package/src/tokens/build/json/tokens.json +661 -94
  26. package/src/tokens/build/scss/_tokens.dark.scss +95 -71
  27. package/src/tokens/build/scss/_tokens.scss +38 -14
  28. package/src/tokens/build/scss/_tokens_custom_properties.scss +24 -0
  29. package/src/tokens/contextual/badge.tokens.json +69 -69
  30. package/src/tokens/contextual/button.tokens.json +8 -17
package/dist/tokens/css/tokens.css CHANGED
@@ -557,10 +557,6 @@
557
557
  --gl-button-confirm-primary-border-color-active: var(--gl-color-blue-900); /* Used for the border of a confirm (positive) primary button in the active state. */
558
558
  --gl-button-confirm-primary-border-color-hover: var(--gl-color-blue-800); /* Used for the border of a confirm (positive) primary button in the hover state. */
559
559
  --gl-button-confirm-primary-border-color-default: var(--gl-color-blue-600); /* Used for the border of a confirm (positive) primary button in the default state. */
560
- --gl-button-confirm-primary-background-color-active: var(--gl-color-blue-700); /* Used for the background of a confirm (positive) primary button in the active state. */
561
- --gl-button-confirm-primary-background-color-hover: var(--gl-color-blue-600); /* Used for the background of a confirm (positive) primary button in the hover state. */
562
- --gl-button-confirm-primary-background-color-default: var(--gl-color-blue-500); /* Used for the background of a confirm (positive) primary button in the default state. */
563
- --gl-button-confirm-primary-foreground-color-default: var(--gl-color-neutral-0); /* Used for the foreground of a confirm (positive) primary button in the default state. */
564
560
  --gl-button-default-tertiary-background-color-active: var(--gl-action-neutral-background-color-active); /* Used for the background of a default borderless, tertiary button in the active state. */
565
561
  --gl-button-default-tertiary-background-color-hover: var(--gl-action-neutral-background-color-hover); /* Used for the background of a default borderless, tertiary button in the hover state. */
566
562
  --gl-button-default-tertiary-background-color-default: var(--gl-action-neutral-background-color-default); /* Used for the background of a default borderless, tertiary button in the default state. */
@@ -574,9 +570,9 @@
574
570
  --gl-breadcrumb-separator-color: var(--gl-color-neutral-400); /* Used for the breadcrumb level separator. */
575
571
  --gl-banner-promo-background-color: var(--gl-color-neutral-10); /* Used as background for the default banner type. */
576
572
  --gl-banner-intro-border-color: var(--gl-color-blue-300); /* Used to compliment the info banner. */
577
- --gl-badge-tier-icon-color-active: var(--gl-color-purple-700); /* Used for the icon of a tier related badge in the active state. */
578
- --gl-badge-tier-icon-color-hover: var(--gl-color-purple-600); /* Used for the icon of a tier related badge in the hover state. */
579
- --gl-badge-tier-icon-color-default: var(--gl-color-purple-500); /* Used for the icon of a tier related badge when static or the default state when linked. */
573
+ --gl-badge-tier-icon-color-active: var(--gl-color-purple-900); /* Used for the icon of a tier related badge in the active state. */
574
+ --gl-badge-tier-icon-color-hover: var(--gl-color-purple-800); /* Used for the icon of a tier related badge in the hover state. */
575
+ --gl-badge-tier-icon-color-default: var(--gl-color-purple-700); /* Used for the icon of a tier related badge when static or the default state when linked. */
580
576
  --gl-badge-tier-text-color-active: var(--gl-color-purple-900); /* Used for the text of a tier related badge in the active state. */
581
577
  --gl-badge-tier-text-color-hover: var(--gl-color-purple-800); /* Used for the text of a tier related badge in the hover state. */
582
578
  --gl-badge-tier-text-color-default: var(--gl-color-purple-700); /* Used for the text of a tier related badge when static or the default state when linked. */
@@ -586,9 +582,9 @@
586
582
  --gl-badge-tier-border-color-default: var(--gl-color-alpha-0); /* Used for the border of a tier related badge when static or the default state when linked. */
587
583
  --gl-badge-tier-background-color-active: var(--gl-color-purple-200); /* Used for the background of a tier related badge in the active state. */
588
584
  --gl-badge-tier-background-color-default: var(--gl-color-purple-100); /* Used for the background of a tier related badge when static or the default state when linked. */
589
- --gl-badge-danger-icon-color-active: var(--gl-color-red-700); /* Used for the icon of a danger badge in the active state. */
590
- --gl-badge-danger-icon-color-hover: var(--gl-color-red-600); /* Used for the icon of a danger badge in the hover state. */
591
- --gl-badge-danger-icon-color-default: var(--gl-color-red-500); /* Used for the icon of a danger badge when static or the default state when linked. */
585
+ --gl-badge-danger-icon-color-active: var(--gl-color-red-900); /* Used for the icon of a danger badge in the active state. */
586
+ --gl-badge-danger-icon-color-hover: var(--gl-color-red-800); /* Used for the icon of a danger badge in the hover state. */
587
+ --gl-badge-danger-icon-color-default: var(--gl-color-red-700); /* Used for the icon of a danger badge when static or the default state when linked. */
592
588
  --gl-badge-danger-text-color-active: var(--gl-color-red-900); /* Used for the text of a danger badge in the active state. */
593
589
  --gl-badge-danger-text-color-hover: var(--gl-color-red-800); /* Used for the text of a danger badge in the hover state. */
594
590
  --gl-badge-danger-text-color-default: var(--gl-color-red-700); /* Used for the text of a danger badge when static or the default state when linked. */
@@ -675,6 +671,16 @@
675
671
  --gl-background-color-strong: var(--gl-color-neutral-50); /* Used to make the background easily stand out from the default. */
676
672
  --gl-background-color-subtle: var(--gl-color-neutral-10); /* Used to slightly differentiate the background from the default. */
677
673
  --gl-background-color-default: var(--gl-color-neutral-0); /* Used for the default background color. */
674
+ --gl-action-strong-neutral-border-color-default: var(--gl-color-alpha-0); /* Used for the border of a strong neutral action in the default state. */
675
+ --gl-action-strong-neutral-foreground-color-default: var(--gl-color-neutral-0); /* Used for the foreground of a strong neutral action in the default state. */
676
+ --gl-action-strong-neutral-background-color-active: var(--gl-color-neutral-800); /* Used for the background of a strong neutral action in the active state. */
677
+ --gl-action-strong-neutral-background-color-hover: var(--gl-color-neutral-700); /* Used for the background of a strong neutral action in the hover state. */
678
+ --gl-action-strong-neutral-background-color-default: var(--gl-color-neutral-600); /* Used for the background of a strong neutral action in the default state. */
679
+ --gl-action-strong-confirm-border-color-default: var(--gl-color-alpha-0); /* Used for the border of a strong confirm action in the default state. */
680
+ --gl-action-strong-confirm-foreground-color-default: var(--gl-color-neutral-0); /* Used for the foreground of a strong confirm action in the default state. */
681
+ --gl-action-strong-confirm-background-color-active: var(--gl-color-blue-700); /* Used for the background of a strong confirm action in the active state. */
682
+ --gl-action-strong-confirm-background-color-hover: var(--gl-color-blue-600); /* Used for the background of a strong confirm action in the hover state. */
683
+ --gl-action-strong-confirm-background-color-default: var(--gl-color-blue-500); /* Used for the background of a strong confirm action in the default state. */
678
684
  --gl-action-danger-border-color-default: var(--gl-color-alpha-0); /* Used for the border of a danger action in the default state. */
679
685
  --gl-action-danger-background-color-focus: var(--gl-action-danger-background-color-hover); /* Used for the background of a danger (destructive) action in the focus state. */
680
686
  --gl-action-danger-foreground-color-active: var(--gl-color-red-900); /* Used for the foreground of a danger (destructive) action in the active state. */
@@ -727,10 +733,10 @@
727
733
  --gl-button-confirm-secondary-background-color-focus: var(--gl-button-confirm-secondary-background-color-hover); /* Used for the background of an outlined confirm (positive) button in the focus state. */
728
734
  --gl-button-confirm-secondary-foreground-color-focus: var(--gl-button-confirm-secondary-foreground-color-hover); /* Used for the foreground of a confirm (positive) button in the focus state. */
729
735
  --gl-button-confirm-primary-border-color-focus: var(--gl-button-confirm-primary-border-color-hover); /* Used for the border of a confirm (positive) primary button in the focus state. */
730
- --gl-button-confirm-primary-background-color-focus: var(--gl-button-confirm-primary-background-color-hover); /* Used for the background of a confirm (positive) primary button in the focus state. */
731
- --gl-button-confirm-primary-foreground-color-active: var(--gl-button-confirm-primary-foreground-color-default); /* Used for the foreground of a confirm (positive) primary button in the active state. */
732
- --gl-button-confirm-primary-foreground-color-focus: var(--gl-button-confirm-primary-foreground-color-default); /* Used for the foreground of a confirm (positive) primary button in the focus state. */
733
- --gl-button-confirm-primary-foreground-color-hover: var(--gl-button-confirm-primary-foreground-color-default); /* Used for the foreground of a confirm (positive) primary button in the hover state. */
736
+ --gl-button-confirm-primary-background-color-active: var(--gl-action-strong-confirm-background-color-active); /* Used for the background of a confirm (positive) primary button in the active state. */
737
+ --gl-button-confirm-primary-background-color-hover: var(--gl-action-strong-confirm-background-color-hover); /* Used for the background of a confirm (positive) primary button in the hover state. */
738
+ --gl-button-confirm-primary-background-color-default: var(--gl-action-strong-confirm-background-color-default); /* Used for the background of a confirm (positive) primary button in the default state. */
739
+ --gl-button-confirm-primary-foreground-color-default: var(--gl-action-strong-confirm-foreground-color-default); /* Used for the foreground of a confirm (positive) primary button in the default state. */
734
740
  --gl-button-default-tertiary-border-color-default: var(--gl-action-neutral-border-color-default); /* Used for the border of a default borderless, tertiary button in the default state. */
735
741
  --gl-button-default-tertiary-background-color-focus: var(--gl-action-neutral-background-color-focus); /* Used for the background of a default borderless, tertiary button in the focus state. */
736
742
  --gl-button-default-tertiary-foreground-color-default: var(--gl-action-neutral-foreground-color-default); /* Used for the foreground of a default borderless, tertiary button in the default state. */
@@ -760,6 +766,12 @@
760
766
  --gl-badge-muted-icon-color-focus: var(--gl-badge-muted-icon-color-hover); /* Used for the icon of a muted badge in the focus state. */
761
767
  --gl-badge-muted-text-color-focus: var(--gl-badge-muted-text-color-hover); /* Used for the text of a muted badge in the focus state. */
762
768
  --gl-badge-muted-background-color-hover: var(--gl-badge-muted-background-color-default); /* Used for the background of a muted badge in the hover state. */
769
+ --gl-action-strong-neutral-border-color-hover: var(--gl-action-strong-neutral-border-color-default); /* Used for the border of a strong neutral action in the hover state. */
770
+ --gl-action-strong-neutral-foreground-color-hover: var(--gl-action-strong-neutral-foreground-color-default); /* Used for the foreground of a strong neutral action in the hover state. */
771
+ --gl-action-strong-neutral-background-color-focus: var(--gl-action-strong-neutral-background-color-hover); /* Used for the background of a strong neutral action in the focus state. */
772
+ --gl-action-strong-confirm-border-color-hover: var(--gl-action-strong-confirm-border-color-default); /* Used for the border of a strong confirm action in the hover state. */
773
+ --gl-action-strong-confirm-foreground-color-hover: var(--gl-action-strong-confirm-foreground-color-default); /* Used for the foreground of a strong confirm action in the hover state. */
774
+ --gl-action-strong-confirm-background-color-focus: var(--gl-action-strong-confirm-background-color-hover); /* Used for the background of a strong confirm action in the focus state. */
763
775
  --gl-action-danger-border-color-active: var(--gl-action-danger-border-color-default); /* Used for the border of a danger action in the active state. */
764
776
  --gl-action-danger-border-color-focus: var(--gl-action-danger-border-color-default); /* Used for the border of a danger action in the focus state. */
765
777
  --gl-action-danger-border-color-hover: var(--gl-action-danger-border-color-default); /* Used for the border of a danger action in the hover state. */
@@ -791,6 +803,8 @@
791
803
  --gl-button-confirm-tertiary-border-color-focus: var(--gl-action-confirm-border-color-focus); /* Used for the border of a borderless, tertiary confirm (positive) button in the focus state. */
792
804
  --gl-button-confirm-tertiary-border-color-hover: var(--gl-action-confirm-border-color-hover); /* Used for the border of a borderless, tertiary confirm (positive) button in the hover state. */
793
805
  --gl-button-confirm-tertiary-foreground-color-focus: var(--gl-action-confirm-foreground-color-focus); /* Used for the foreground of a borderless, tertiary confirm (positive) button in the focus state. */
806
+ --gl-button-confirm-primary-background-color-focus: var(--gl-action-strong-confirm-background-color-focus); /* Used for the background of a confirm (positive) primary button in the focus state. */
807
+ --gl-button-confirm-primary-foreground-color-hover: var(--gl-action-strong-confirm-foreground-color-hover); /* Used for the foreground of a confirm (positive) primary button in the hover state. */
794
808
  --gl-button-default-tertiary-border-color-active: var(--gl-action-neutral-border-color-active); /* Used for the border of a default borderless, tertiary button in the active state. */
795
809
  --gl-button-default-tertiary-border-color-focus: var(--gl-action-neutral-border-color-focus); /* Used for the border of a default borderless, tertiary button in the focus state. */
796
810
  --gl-button-default-tertiary-border-color-hover: var(--gl-action-neutral-border-color-hover); /* Used for the border of a default borderless, tertiary button in the hover state. */
@@ -804,4 +818,14 @@
804
818
  --gl-badge-info-background-color-focus: var(--gl-badge-info-background-color-hover); /* Used for the background of an informational badge in the focus state. */
805
819
  --gl-badge-neutral-background-color-focus: var(--gl-badge-neutral-background-color-hover); /* Used for the background of a neutral badge in the focus state. */
806
820
  --gl-badge-muted-background-color-focus: var(--gl-badge-muted-background-color-hover); /* Used for the background of a muted badge in the focus state. */
821
+ --gl-action-strong-neutral-border-color-focus: var(--gl-action-strong-neutral-border-color-hover); /* Used for the border of a strong neutral action in the focus state. */
822
+ --gl-action-strong-neutral-foreground-color-focus: var(--gl-action-strong-neutral-foreground-color-hover); /* Used for the foreground of a strong neutral action in the focus state. */
823
+ --gl-action-strong-confirm-border-color-focus: var(--gl-action-strong-confirm-border-color-hover); /* Used for the border of a strong confirm action in the focus state. */
824
+ --gl-action-strong-confirm-foreground-color-focus: var(--gl-action-strong-confirm-foreground-color-hover); /* Used for the foreground of a strong confirm action in the focus state. */
825
+ --gl-button-confirm-primary-foreground-color-focus: var(--gl-action-strong-confirm-foreground-color-focus); /* Used for the foreground of a confirm (positive) primary button in the focus state. */
826
+ --gl-action-strong-neutral-border-color-active: var(--gl-action-strong-neutral-border-color-focus); /* Used for the border of a strong neutral action in the active state. */
827
+ --gl-action-strong-neutral-foreground-color-active: var(--gl-action-strong-neutral-foreground-color-focus); /* Used for the foreground of a strong neutral action in the active state. */
828
+ --gl-action-strong-confirm-border-color-active: var(--gl-action-strong-confirm-border-color-focus); /* Used for the border of a strong confirm action in the active state. */
829
+ --gl-action-strong-confirm-foreground-color-active: var(--gl-action-strong-confirm-foreground-color-focus); /* Used for the foreground of a strong confirm action in the active state. */
830
+ --gl-button-confirm-primary-foreground-color-active: var(--gl-action-strong-confirm-foreground-color-active); /* Used for the foreground of a confirm (positive) primary button in the active state. */
807
831
  }
package/dist/tokens/css/tokens.dark.css CHANGED
@@ -557,10 +557,6 @@
557
557
  --gl-button-confirm-primary-border-color-active: var(--gl-color-blue-50); /* Used for the border of a confirm (positive) primary button in the active state. */
558
558
  --gl-button-confirm-primary-border-color-hover: var(--gl-color-blue-100); /* Used for the border of a confirm (positive) primary button in the hover state. */
559
559
  --gl-button-confirm-primary-border-color-default: var(--gl-color-blue-300); /* Used for the border of a confirm (positive) primary button in the default state. */
560
- --gl-button-confirm-primary-background-color-active: var(--gl-color-blue-200); /* Used for the background of a confirm (positive) primary button in the active state. */
561
- --gl-button-confirm-primary-background-color-hover: var(--gl-color-blue-300); /* Used for the background of a confirm (positive) primary button in the hover state. */
562
- --gl-button-confirm-primary-background-color-default: var(--gl-color-blue-400); /* Used for the background of a confirm (positive) primary button in the default state. */
563
- --gl-button-confirm-primary-foreground-color-default: var(--gl-color-neutral-0); /* Used for the foreground of a confirm (positive) primary button in the default state. */
564
560
  --gl-button-default-tertiary-background-color-active: var(--gl-action-neutral-background-color-active); /* Used for the background of a default borderless, tertiary button in the active state. */
565
561
  --gl-button-default-tertiary-background-color-hover: var(--gl-action-neutral-background-color-hover); /* Used for the background of a default borderless, tertiary button in the hover state. */
566
562
  --gl-button-default-tertiary-background-color-default: var(--gl-action-neutral-background-color-default); /* Used for the background of a default borderless, tertiary button in the default state. */
@@ -574,90 +570,90 @@
574
570
  --gl-breadcrumb-separator-color: var(--gl-color-neutral-400); /* Used for the breadcrumb level separator. */
575
571
  --gl-banner-promo-background-color: var(--gl-color-neutral-900); /* Used as background for the default banner type. */
576
572
  --gl-banner-intro-border-color: var(--gl-color-blue-600); /* Used to compliment the info banner. */
577
- --gl-badge-tier-icon-color-active: var(--gl-color-purple-300); /* Used for the icon of a tier related badge in the active state. */
578
- --gl-badge-tier-icon-color-hover: var(--gl-color-purple-400); /* Used for the icon of a tier related badge in the hover state. */
579
- --gl-badge-tier-icon-color-default: var(--gl-color-purple-500); /* Used for the icon of a tier related badge when static or the default state when linked. */
580
- --gl-badge-tier-text-color-active: var(--gl-color-purple-100); /* Used for the text of a tier related badge in the active state. */
581
- --gl-badge-tier-text-color-hover: var(--gl-color-purple-200); /* Used for the text of a tier related badge in the hover state. */
582
- --gl-badge-tier-text-color-default: var(--gl-color-purple-300); /* Used for the text of a tier related badge when static or the default state when linked. */
573
+ --gl-badge-tier-icon-color-active: var(--gl-color-purple-950); /* Used for the icon of a tier related badge in the active state. */
574
+ --gl-badge-tier-icon-color-hover: var(--gl-color-purple-950); /* Used for the icon of a tier related badge in the hover state. */
575
+ --gl-badge-tier-icon-color-default: var(--gl-color-purple-950); /* Used for the icon of a tier related badge when static or the default state when linked. */
576
+ --gl-badge-tier-text-color-active: var(--gl-color-purple-950); /* Used for the text of a tier related badge in the active state. */
577
+ --gl-badge-tier-text-color-hover: var(--gl-color-purple-950); /* Used for the text of a tier related badge in the hover state. */
578
+ --gl-badge-tier-text-color-default: var(--gl-color-purple-950); /* Used for the text of a tier related badge when static or the default state when linked. */
583
579
  --gl-badge-tier-border-color-active: var(--gl-color-alpha-0); /* Used for the border of a tier related badge in the active state. */
584
580
  --gl-badge-tier-border-color-focus: var(--gl-color-alpha-0); /* Used for the border of a tier related badge in the focus state. */
585
- --gl-badge-tier-border-color-hover: var(--gl-color-purple-800); /* Used for the border of a tier related badge in the hover state. */
581
+ --gl-badge-tier-border-color-hover: var(--gl-color-purple-200); /* Used for the border of a tier related badge in the hover state. */
586
582
  --gl-badge-tier-border-color-default: var(--gl-color-alpha-0); /* Used for the border of a tier related badge when static or the default state when linked. */
587
- --gl-badge-tier-background-color-active: var(--gl-color-purple-800); /* Used for the background of a tier related badge in the active state. */
588
- --gl-badge-tier-background-color-default: var(--gl-color-purple-900); /* Used for the background of a tier related badge when static or the default state when linked. */
589
- --gl-badge-danger-icon-color-active: var(--gl-color-red-200); /* Used for the icon of a danger badge in the active state. */
590
- --gl-badge-danger-icon-color-hover: var(--gl-color-red-300); /* Used for the icon of a danger badge in the hover state. */
591
- --gl-badge-danger-icon-color-default: var(--gl-color-red-400); /* Used for the icon of a danger badge when static or the default state when linked. */
592
- --gl-badge-danger-text-color-active: var(--gl-color-red-50); /* Used for the text of a danger badge in the active state. */
593
- --gl-badge-danger-text-color-hover: var(--gl-color-red-100); /* Used for the text of a danger badge in the hover state. */
594
- --gl-badge-danger-text-color-default: var(--gl-color-red-200); /* Used for the text of a danger badge when static or the default state when linked. */
583
+ --gl-badge-tier-background-color-active: var(--gl-color-purple-200); /* Used for the background of a tier related badge in the active state. */
584
+ --gl-badge-tier-background-color-default: var(--gl-color-purple-300); /* Used for the background of a tier related badge when static or the default state when linked. */
585
+ --gl-badge-danger-icon-color-active: var(--gl-color-red-950); /* Used for the icon of a danger badge in the active state. */
586
+ --gl-badge-danger-icon-color-hover: var(--gl-color-red-950); /* Used for the icon of a danger badge in the hover state. */
587
+ --gl-badge-danger-icon-color-default: var(--gl-color-red-950); /* Used for the icon of a danger badge when static or the default state when linked. */
588
+ --gl-badge-danger-text-color-active: var(--gl-color-red-950); /* Used for the text of a danger badge in the active state. */
589
+ --gl-badge-danger-text-color-hover: var(--gl-color-red-950); /* Used for the text of a danger badge in the hover state. */
590
+ --gl-badge-danger-text-color-default: var(--gl-color-red-950); /* Used for the text of a danger badge when static or the default state when linked. */
595
591
  --gl-badge-danger-border-color-active: var(--gl-color-alpha-0); /* Used for the border of a danger badge in the active state. */
596
592
  --gl-badge-danger-border-color-focus: var(--gl-color-alpha-0); /* Used for the border of a danger badge in the focus state. */
597
- --gl-badge-danger-border-color-hover: var(--gl-color-red-700); /* Used for the border of a danger badge in the hover state. */
593
+ --gl-badge-danger-border-color-hover: var(--gl-color-red-200); /* Used for the border of a danger badge in the hover state. */
598
594
  --gl-badge-danger-border-color-default: var(--gl-color-alpha-0); /* Used for the border of a danger badge when static or the default state when linked. */
599
- --gl-badge-danger-background-color-active: var(--gl-color-red-700); /* Used for the background of a danger badge in the active state. */
600
- --gl-badge-danger-background-color-default: var(--gl-color-red-800); /* Used for the background of a danger badge when static or the default state when linked. */
601
- --gl-badge-warning-icon-color-active: var(--gl-color-orange-200); /* Used for the icon of a warning badge in the active state. */
602
- --gl-badge-warning-icon-color-hover: var(--gl-color-orange-300); /* Used for the icon of a warning badge in the hover state. */
603
- --gl-badge-warning-icon-color-default: var(--gl-color-orange-400); /* Used for the icon of a warning badge when static or the default state when linked. */
604
- --gl-badge-warning-text-color-active: var(--gl-color-orange-50); /* Used for the text of a warning badge in the active state. */
605
- --gl-badge-warning-text-color-hover: var(--gl-color-orange-100); /* Used for the text of a warning badge in the hover state. */
606
- --gl-badge-warning-text-color-default: var(--gl-color-orange-200); /* Used for the text of a warning badge when static or the default state when linked. */
595
+ --gl-badge-danger-background-color-active: var(--gl-color-red-200); /* Used for the background of a danger badge in the active state. */
596
+ --gl-badge-danger-background-color-default: var(--gl-color-red-300); /* Used for the background of a danger badge when static or the default state when linked. */
597
+ --gl-badge-warning-icon-color-active: var(--gl-color-orange-950); /* Used for the icon of a warning badge in the active state. */
598
+ --gl-badge-warning-icon-color-hover: var(--gl-color-orange-950); /* Used for the icon of a warning badge in the hover state. */
599
+ --gl-badge-warning-icon-color-default: var(--gl-color-orange-950); /* Used for the icon of a warning badge when static or the default state when linked. */
600
+ --gl-badge-warning-text-color-active: var(--gl-color-orange-950); /* Used for the text of a warning badge in the active state. */
601
+ --gl-badge-warning-text-color-hover: var(--gl-color-orange-950); /* Used for the text of a warning badge in the hover state. */
602
+ --gl-badge-warning-text-color-default: var(--gl-color-orange-950); /* Used for the text of a warning badge when static or the default state when linked. */
607
603
  --gl-badge-warning-border-color-active: var(--gl-color-alpha-0); /* Used for the border of a warning badge in the active state. */
608
604
  --gl-badge-warning-border-color-focus: var(--gl-color-alpha-0); /* Used for the border of a warning badge in the focus state. */
609
- --gl-badge-warning-border-color-hover: var(--gl-color-orange-700); /* Used for the border of a warning badge in the hover state. */
605
+ --gl-badge-warning-border-color-hover: var(--gl-color-orange-200); /* Used for the border of a warning badge in the hover state. */
610
606
  --gl-badge-warning-border-color-default: var(--gl-color-alpha-0); /* Used for the border of a warning badge when static or the default state when linked. */
611
- --gl-badge-warning-background-color-active: var(--gl-color-orange-700); /* Used for the background of a warning badge in the active state. */
612
- --gl-badge-warning-background-color-default: var(--gl-color-orange-800); /* Used for the background of a warning badge when static or the default state when linked. */
613
- --gl-badge-success-icon-color-active: var(--gl-color-green-200); /* Used for the icon of a success badge in the active state. */
614
- --gl-badge-success-icon-color-hover: var(--gl-color-green-300); /* Used for the icon of a success badge in the hover state. */
615
- --gl-badge-success-icon-color-default: var(--gl-color-green-400); /* Used for the icon of a success badge when static or the default state when linked. */
616
- --gl-badge-success-text-color-active: var(--gl-color-green-50); /* Used for the text of a success badge in the active state. */
617
- --gl-badge-success-text-color-hover: var(--gl-color-green-100); /* Used for the text of a success badge in the hover state. */
618
- --gl-badge-success-text-color-default: var(--gl-color-green-200); /* Used for the text of a success badge when static or the default state when linked. */
607
+ --gl-badge-warning-background-color-active: var(--gl-color-orange-200); /* Used for the background of a warning badge in the active state. */
608
+ --gl-badge-warning-background-color-default: var(--gl-color-orange-300); /* Used for the background of a warning badge when static or the default state when linked. */
609
+ --gl-badge-success-icon-color-active: var(--gl-color-green-950); /* Used for the icon of a success badge in the active state. */
610
+ --gl-badge-success-icon-color-hover: var(--gl-color-green-950); /* Used for the icon of a success badge in the hover state. */
611
+ --gl-badge-success-icon-color-default: var(--gl-color-green-950); /* Used for the icon of a success badge when static or the default state when linked. */
612
+ --gl-badge-success-text-color-active: var(--gl-color-green-950); /* Used for the text of a success badge in the active state. */
613
+ --gl-badge-success-text-color-hover: var(--gl-color-green-950); /* Used for the text of a success badge in the hover state. */
614
+ --gl-badge-success-text-color-default: var(--gl-color-green-950); /* Used for the text of a success badge when static or the default state when linked. */
619
615
  --gl-badge-success-border-color-active: var(--gl-color-alpha-0); /* Used for the border of a success badge in the active state. */
620
616
  --gl-badge-success-border-color-focus: var(--gl-color-alpha-0); /* Used for the border of a success badge in the focus state. */
621
- --gl-badge-success-border-color-hover: var(--gl-color-green-700); /* Used for the border of a success badge in the hover state. */
617
+ --gl-badge-success-border-color-hover: var(--gl-color-green-200); /* Used for the border of a success badge in the hover state. */
622
618
  --gl-badge-success-border-color-default: var(--gl-color-alpha-0); /* Used for the border of a success badge when static or the default state when linked. */
623
- --gl-badge-success-background-color-active: var(--gl-color-green-700); /* Used for the background of a success badge in the active state. */
624
- --gl-badge-success-background-color-default: var(--gl-color-green-800); /* Used for the background of a success badge when static or the default state when linked. */
625
- --gl-badge-info-icon-color-active: var(--gl-color-blue-200); /* Used for the icon of an informational badge in the active state. */
626
- --gl-badge-info-icon-color-hover: var(--gl-color-blue-300); /* Used for the icon of an informational badge in the hover state. */
627
- --gl-badge-info-icon-color-default: var(--gl-color-blue-400); /* Used for the icon of an informational badge when static or the default state when linked. */
628
- --gl-badge-info-text-color-active: var(--gl-color-blue-50); /* Used for the text of an informational badge in the active state. */
629
- --gl-badge-info-text-color-hover: var(--gl-color-blue-100); /* Used for the text of an informational badge in the hover state. */
630
- --gl-badge-info-text-color-default: var(--gl-color-blue-200); /* Used for the text of an informational badge when static or the default state when linked. */
619
+ --gl-badge-success-background-color-active: var(--gl-color-green-200); /* Used for the background of a success badge in the active state. */
620
+ --gl-badge-success-background-color-default: var(--gl-color-green-300); /* Used for the background of a success badge when static or the default state when linked. */
621
+ --gl-badge-info-icon-color-active: var(--gl-color-blue-950); /* Used for the icon of an informational badge in the active state. */
622
+ --gl-badge-info-icon-color-hover: var(--gl-color-blue-950); /* Used for the icon of an informational badge in the hover state. */
623
+ --gl-badge-info-icon-color-default: var(--gl-color-blue-950); /* Used for the icon of an informational badge when static or the default state when linked. */
624
+ --gl-badge-info-text-color-active: var(--gl-color-blue-950); /* Used for the text of an informational badge in the active state. */
625
+ --gl-badge-info-text-color-hover: var(--gl-color-blue-950); /* Used for the text of an informational badge in the hover state. */
626
+ --gl-badge-info-text-color-default: var(--gl-color-blue-950); /* Used for the text of an informational badge when static or the default state when linked. */
631
627
  --gl-badge-info-border-color-active: var(--gl-color-alpha-0); /* Used for the border of an informational badge in the active state. */
632
628
  --gl-badge-info-border-color-focus: var(--gl-color-alpha-0); /* Used for the border of an informational badge in the focus state. */
633
- --gl-badge-info-border-color-hover: var(--gl-color-blue-700); /* Used for the border of an informational badge in the hover state. */
629
+ --gl-badge-info-border-color-hover: var(--gl-color-blue-200); /* Used for the border of an informational badge in the hover state. */
634
630
  --gl-badge-info-border-color-default: var(--gl-color-alpha-0); /* Used for the border of an informational badge when static or the default state when linked. */
635
- --gl-badge-info-background-color-active: var(--gl-color-blue-700); /* Used for the background of an informational badge in the active state. */
636
- --gl-badge-info-background-color-default: var(--gl-color-blue-800); /* Used for the background of an informational badge when static or the default state when linked. */
637
- --gl-badge-neutral-icon-color-active: var(--gl-color-neutral-200); /* Used for the icon of a neutral badge in the active state. */
638
- --gl-badge-neutral-icon-color-hover: var(--gl-color-neutral-300); /* Used for the icon of a neutral badge in the hover state. */
639
- --gl-badge-neutral-icon-color-default: var(--gl-color-neutral-400); /* Used for the icon of a neutral badge when static or the default state when linked. */
640
- --gl-badge-neutral-text-color-active: var(--gl-color-neutral-50); /* Used for the text of a neutral badge in the active state. */
641
- --gl-badge-neutral-text-color-hover: var(--gl-color-neutral-100); /* Used for the text of a neutral badge in the hover state. */
642
- --gl-badge-neutral-text-color-default: var(--gl-color-neutral-200); /* Used for the text of a neutral badge when static or the default state when linked. */
631
+ --gl-badge-info-background-color-active: var(--gl-color-blue-200); /* Used for the background of an informational badge in the active state. */
632
+ --gl-badge-info-background-color-default: var(--gl-color-blue-300); /* Used for the background of an informational badge when static or the default state when linked. */
633
+ --gl-badge-neutral-icon-color-active: var(--gl-color-neutral-950); /* Used for the icon of a neutral badge in the active state. */
634
+ --gl-badge-neutral-icon-color-hover: var(--gl-color-neutral-950); /* Used for the icon of a neutral badge in the hover state. */
635
+ --gl-badge-neutral-icon-color-default: var(--gl-color-neutral-950); /* Used for the icon of a neutral badge when static or the default state when linked. */
636
+ --gl-badge-neutral-text-color-active: var(--gl-color-neutral-950); /* Used for the text of a neutral badge in the active state. */
637
+ --gl-badge-neutral-text-color-hover: var(--gl-color-neutral-950); /* Used for the text of a neutral badge in the hover state. */
638
+ --gl-badge-neutral-text-color-default: var(--gl-color-neutral-950); /* Used for the text of a neutral badge when static or the default state when linked. */
643
639
  --gl-badge-neutral-border-color-active: var(--gl-color-alpha-0); /* Used for the border of a neutral badge in the active state. */
644
640
  --gl-badge-neutral-border-color-focus: var(--gl-color-alpha-0); /* Used for the border of a neutral badge in the focus state. */
645
- --gl-badge-neutral-border-color-hover: var(--gl-color-neutral-700); /* Used for the border of a neutral badge in the hover state. */
641
+ --gl-badge-neutral-border-color-hover: var(--gl-color-neutral-200); /* Used for the border of a neutral badge in the hover state. */
646
642
  --gl-badge-neutral-border-color-default: var(--gl-color-alpha-0); /* Used for the border of a neutral badge when static or the default state when linked. */
647
- --gl-badge-neutral-background-color-active: var(--gl-color-neutral-700); /* Used for the background of a neutral badge in the active state. */
648
- --gl-badge-neutral-background-color-default: var(--gl-color-neutral-800); /* Used for the background of a neutral badge when static or the default state when linked. */
649
- --gl-badge-muted-icon-color-active: var(--gl-color-neutral-200); /* Used for the icon of a muted badge in the active state. */
650
- --gl-badge-muted-icon-color-hover: var(--gl-color-neutral-300); /* Used for the icon of a muted badge in the hover state. */
651
- --gl-badge-muted-icon-color-default: var(--gl-color-neutral-400); /* Used for the icon of a muted badge when static or the default state when linked. */
652
- --gl-badge-muted-text-color-active: var(--gl-color-neutral-100); /* Used for the text of a muted badge in the active state. */
653
- --gl-badge-muted-text-color-hover: var(--gl-color-neutral-200); /* Used for the text of a muted badge in the hover state. */
654
- --gl-badge-muted-text-color-default: var(--gl-color-neutral-300); /* Used for the text of a muted badge when static or the default state when linked. */
643
+ --gl-badge-neutral-background-color-active: var(--gl-color-neutral-200); /* Used for the background of a neutral badge in the active state. */
644
+ --gl-badge-neutral-background-color-default: var(--gl-color-neutral-300); /* Used for the background of a neutral badge when static or the default state when linked. */
645
+ --gl-badge-muted-icon-color-active: var(--gl-color-neutral-950); /* Used for the icon of a muted badge in the active state. */
646
+ --gl-badge-muted-icon-color-hover: var(--gl-color-neutral-950); /* Used for the icon of a muted badge in the hover state. */
647
+ --gl-badge-muted-icon-color-default: var(--gl-color-neutral-950); /* Used for the icon of a muted badge when static or the default state when linked. */
648
+ --gl-badge-muted-text-color-active: var(--gl-color-neutral-950); /* Used for the text of a muted badge in the active state. */
649
+ --gl-badge-muted-text-color-hover: var(--gl-color-neutral-950); /* Used for the text of a muted badge in the hover state. */
650
+ --gl-badge-muted-text-color-default: var(--gl-color-neutral-950); /* Used for the text of a muted badge when static or the default state when linked. */
655
651
  --gl-badge-muted-border-color-active: var(--gl-color-alpha-0); /* Used for the border of a muted badge in the active state. */
656
652
  --gl-badge-muted-border-color-focus: var(--gl-color-alpha-0); /* Used for the border of a muted badge in the focus state. */
657
- --gl-badge-muted-border-color-hover: var(--gl-color-neutral-700); /* Used for the border of a muted badge in the hover state. */
653
+ --gl-badge-muted-border-color-hover: var(--gl-color-neutral-300); /* Used for the border of a muted badge in the hover state. */
658
654
  --gl-badge-muted-border-color-default: var(--gl-color-alpha-0); /* Used for the border of a muted badge when static or the default state when linked. */
659
- --gl-badge-muted-background-color-active: var(--gl-color-neutral-800); /* Used for the background of a muted badge in the active state. */
660
- --gl-badge-muted-background-color-default: var(--gl-color-neutral-900); /* Used for the background of a muted badge when static or the default state when linked. */
655
+ --gl-badge-muted-background-color-active: var(--gl-color-neutral-300); /* Used for the background of a muted badge in the active state. */
656
+ --gl-badge-muted-background-color-default: var(--gl-color-neutral-400); /* Used for the background of a muted badge when static or the default state when linked. */
661
657
  --gl-avatar-fallback-text-color-neutral: var(--gl-color-neutral-200); /* Neutral text color for avatar fallback with no particular meaning. */
662
658
  --gl-avatar-fallback-text-color-orange: var(--gl-color-orange-200); /* Orange text color for avatar fallback with no particular meaning. */
663
659
  --gl-avatar-fallback-text-color-green: var(--gl-color-green-200); /* Green text color for avatar fallback with no particular meaning. */
@@ -675,6 +671,16 @@
675
671
  --gl-background-color-strong: var(--gl-color-neutral-800); /* Used to make the background easily stand out from the default. */
676
672
  --gl-background-color-subtle: var(--gl-color-neutral-900); /* Used to slightly differentiate the background from the default. */
677
673
  --gl-background-color-default: var(--gl-color-neutral-950); /* Used for the default background color. */
674
+ --gl-action-strong-neutral-border-color-default: var(--gl-color-alpha-0); /* Used for the border of a strong neutral action in the default state. */
675
+ --gl-action-strong-neutral-foreground-color-default: var(--gl-color-neutral-0); /* Used for the foreground of a strong neutral action in the default state. */
676
+ --gl-action-strong-neutral-background-color-active: var(--gl-color-neutral-100); /* Used for the background of a strong neutral action in the active state. */
677
+ --gl-action-strong-neutral-background-color-hover: var(--gl-color-neutral-200); /* Used for the background of a strong neutral action in the hover state. */
678
+ --gl-action-strong-neutral-background-color-default: var(--gl-color-neutral-300); /* Used for the background of a strong neutral action in the default state. */
679
+ --gl-action-strong-confirm-border-color-default: var(--gl-color-alpha-0); /* Used for the border of a strong confirm action in the default state. */
680
+ --gl-action-strong-confirm-foreground-color-default: var(--gl-color-neutral-0); /* Used for the foreground of a strong confirm action in the default state. */
681
+ --gl-action-strong-confirm-background-color-active: var(--gl-color-blue-200); /* Used for the background of a strong confirm action in the active state. */
682
+ --gl-action-strong-confirm-background-color-hover: var(--gl-color-blue-300); /* Used for the background of a strong confirm action in the hover state. */
683
+ --gl-action-strong-confirm-background-color-default: var(--gl-color-blue-400); /* Used for the background of a strong confirm action in the default state. */
678
684
  --gl-action-danger-border-color-default: var(--gl-color-alpha-0); /* Used for the border of a danger action in the default state. */
679
685
  --gl-action-danger-background-color-focus: var(--gl-action-danger-background-color-hover); /* Used for the background of a danger (destructive) action in the focus state. */
680
686
  --gl-action-danger-foreground-color-active: var(--gl-color-red-50); /* Used for the foreground of a danger (destructive) action in the active state. */
@@ -727,10 +733,10 @@
727
733
  --gl-button-confirm-secondary-background-color-focus: var(--gl-button-confirm-secondary-background-color-hover); /* Used for the background of an outlined confirm (positive) button in the focus state. */
728
734
  --gl-button-confirm-secondary-foreground-color-focus: var(--gl-button-confirm-secondary-foreground-color-hover); /* Used for the foreground of a confirm (positive) button in the focus state. */
729
735
  --gl-button-confirm-primary-border-color-focus: var(--gl-button-confirm-primary-border-color-hover); /* Used for the border of a confirm (positive) primary button in the focus state. */
730
- --gl-button-confirm-primary-background-color-focus: var(--gl-button-confirm-primary-background-color-hover); /* Used for the background of a confirm (positive) primary button in the focus state. */
731
- --gl-button-confirm-primary-foreground-color-active: var(--gl-button-confirm-primary-foreground-color-default); /* Used for the foreground of a confirm (positive) primary button in the active state. */
732
- --gl-button-confirm-primary-foreground-color-focus: var(--gl-button-confirm-primary-foreground-color-default); /* Used for the foreground of a confirm (positive) primary button in the focus state. */
733
- --gl-button-confirm-primary-foreground-color-hover: var(--gl-button-confirm-primary-foreground-color-default); /* Used for the foreground of a confirm (positive) primary button in the hover state. */
736
+ --gl-button-confirm-primary-background-color-active: var(--gl-action-strong-confirm-background-color-active); /* Used for the background of a confirm (positive) primary button in the active state. */
737
+ --gl-button-confirm-primary-background-color-hover: var(--gl-action-strong-confirm-background-color-hover); /* Used for the background of a confirm (positive) primary button in the hover state. */
738
+ --gl-button-confirm-primary-background-color-default: var(--gl-action-strong-confirm-background-color-default); /* Used for the background of a confirm (positive) primary button in the default state. */
739
+ --gl-button-confirm-primary-foreground-color-default: var(--gl-action-strong-confirm-foreground-color-default); /* Used for the foreground of a confirm (positive) primary button in the default state. */
734
740
  --gl-button-default-tertiary-border-color-default: var(--gl-action-neutral-border-color-default); /* Used for the border of a default borderless, tertiary button in the default state. */
735
741
  --gl-button-default-tertiary-background-color-focus: var(--gl-action-neutral-background-color-focus); /* Used for the background of a default borderless, tertiary button in the focus state. */
736
742
  --gl-button-default-tertiary-foreground-color-default: var(--gl-action-neutral-foreground-color-default); /* Used for the foreground of a default borderless, tertiary button in the default state. */
@@ -760,6 +766,12 @@
760
766
  --gl-badge-muted-icon-color-focus: var(--gl-badge-muted-icon-color-hover); /* Used for the icon of a muted badge in the focus state. */
761
767
  --gl-badge-muted-text-color-focus: var(--gl-badge-muted-text-color-hover); /* Used for the text of a muted badge in the focus state. */
762
768
  --gl-badge-muted-background-color-hover: var(--gl-badge-muted-background-color-default); /* Used for the background of a muted badge in the hover state. */
769
+ --gl-action-strong-neutral-border-color-hover: var(--gl-action-strong-neutral-border-color-default); /* Used for the border of a strong neutral action in the hover state. */
770
+ --gl-action-strong-neutral-foreground-color-hover: var(--gl-action-strong-neutral-foreground-color-default); /* Used for the foreground of a strong neutral action in the hover state. */
771
+ --gl-action-strong-neutral-background-color-focus: var(--gl-action-strong-neutral-background-color-hover); /* Used for the background of a strong neutral action in the focus state. */
772
+ --gl-action-strong-confirm-border-color-hover: var(--gl-action-strong-confirm-border-color-default); /* Used for the border of a strong confirm action in the hover state. */
773
+ --gl-action-strong-confirm-foreground-color-hover: var(--gl-action-strong-confirm-foreground-color-default); /* Used for the foreground of a strong confirm action in the hover state. */
774
+ --gl-action-strong-confirm-background-color-focus: var(--gl-action-strong-confirm-background-color-hover); /* Used for the background of a strong confirm action in the focus state. */
763
775
  --gl-action-danger-border-color-active: var(--gl-action-danger-border-color-default); /* Used for the border of a danger action in the active state. */
764
776
  --gl-action-danger-border-color-focus: var(--gl-action-danger-border-color-default); /* Used for the border of a danger action in the focus state. */
765
777
  --gl-action-danger-border-color-hover: var(--gl-action-danger-border-color-default); /* Used for the border of a danger action in the hover state. */
@@ -791,6 +803,8 @@
791
803
  --gl-button-confirm-tertiary-border-color-focus: var(--gl-action-confirm-border-color-focus); /* Used for the border of a borderless, tertiary confirm (positive) button in the focus state. */
792
804
  --gl-button-confirm-tertiary-border-color-hover: var(--gl-action-confirm-border-color-hover); /* Used for the border of a borderless, tertiary confirm (positive) button in the hover state. */
793
805
  --gl-button-confirm-tertiary-foreground-color-focus: var(--gl-action-confirm-foreground-color-focus); /* Used for the foreground of a borderless, tertiary confirm (positive) button in the focus state. */
806
+ --gl-button-confirm-primary-background-color-focus: var(--gl-action-strong-confirm-background-color-focus); /* Used for the background of a confirm (positive) primary button in the focus state. */
807
+ --gl-button-confirm-primary-foreground-color-hover: var(--gl-action-strong-confirm-foreground-color-hover); /* Used for the foreground of a confirm (positive) primary button in the hover state. */
794
808
  --gl-button-default-tertiary-border-color-active: var(--gl-action-neutral-border-color-active); /* Used for the border of a default borderless, tertiary button in the active state. */
795
809
  --gl-button-default-tertiary-border-color-focus: var(--gl-action-neutral-border-color-focus); /* Used for the border of a default borderless, tertiary button in the focus state. */
796
810
  --gl-button-default-tertiary-border-color-hover: var(--gl-action-neutral-border-color-hover); /* Used for the border of a default borderless, tertiary button in the hover state. */
@@ -804,4 +818,14 @@
804
818
  --gl-badge-info-background-color-focus: var(--gl-badge-info-background-color-hover); /* Used for the background of an informational badge in the focus state. */
805
819
  --gl-badge-neutral-background-color-focus: var(--gl-badge-neutral-background-color-hover); /* Used for the background of a neutral badge in the focus state. */
806
820
  --gl-badge-muted-background-color-focus: var(--gl-badge-muted-background-color-hover); /* Used for the background of a muted badge in the focus state. */
821
+ --gl-action-strong-neutral-border-color-focus: var(--gl-action-strong-neutral-border-color-hover); /* Used for the border of a strong neutral action in the focus state. */
822
+ --gl-action-strong-neutral-foreground-color-focus: var(--gl-action-strong-neutral-foreground-color-hover); /* Used for the foreground of a strong neutral action in the focus state. */
823
+ --gl-action-strong-confirm-border-color-focus: var(--gl-action-strong-confirm-border-color-hover); /* Used for the border of a strong confirm action in the focus state. */
824
+ --gl-action-strong-confirm-foreground-color-focus: var(--gl-action-strong-confirm-foreground-color-hover); /* Used for the foreground of a strong confirm action in the focus state. */
825
+ --gl-button-confirm-primary-foreground-color-focus: var(--gl-action-strong-confirm-foreground-color-focus); /* Used for the foreground of a confirm (positive) primary button in the focus state. */
826
+ --gl-action-strong-neutral-border-color-active: var(--gl-action-strong-neutral-border-color-focus); /* Used for the border of a strong neutral action in the active state. */
827
+ --gl-action-strong-neutral-foreground-color-active: var(--gl-action-strong-neutral-foreground-color-focus); /* Used for the foreground of a strong neutral action in the active state. */
828
+ --gl-action-strong-confirm-border-color-active: var(--gl-action-strong-confirm-border-color-focus); /* Used for the border of a strong confirm action in the active state. */
829
+ --gl-action-strong-confirm-foreground-color-active: var(--gl-action-strong-confirm-foreground-color-focus); /* Used for the foreground of a strong confirm action in the active state. */
830
+ --gl-button-confirm-primary-foreground-color-active: var(--gl-action-strong-confirm-foreground-color-active); /* Used for the foreground of a confirm (positive) primary button in the active state. */
807
831
  }