@pantheon-systems/pds-design-tokens 2.0.0-alpha.16 → 2.0.0-alpha.17
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.
- package/build/css/variables.dark.css +3 -0
- package/build/css/variables.global.css +4 -1
- package/build/css/variables.light.css +3 -0
- package/build/figma/tokens.json +141 -2
- package/build/js/variables.global.d.ts +4 -1
- package/build/js/variables.global.js +4 -1
- package/build/json/tokens.json +73 -4
- package/package.json +1 -1
|
@@ -70,6 +70,9 @@
|
|
|
70
70
|
--pds-color-spinner-mono-reverse-1: #171717;
|
|
71
71
|
--pds-color-spinner-mono-reverse-2: #66666680;
|
|
72
72
|
--pds-color-spinner-mono-reverse-3: transparent;
|
|
73
|
+
--pds-color-spinner-critical-secondary-1: #e86b61;
|
|
74
|
+
--pds-color-spinner-critical-secondary-2: #de2e21;
|
|
75
|
+
--pds-color-spinner-critical-secondary-3: transparent;
|
|
73
76
|
--pds-color-tag-1-background: #DED8FA;
|
|
74
77
|
--pds-color-tag-1-foreground: #5C4FAC;
|
|
75
78
|
--pds-color-tag-2-background: #F8D7D3;
|
|
@@ -73,7 +73,10 @@
|
|
|
73
73
|
--pds-spacing-button-padding-inline-s: var(--pds-spacing-m);
|
|
74
74
|
--pds-spacing-button-padding-inline-m: var(--pds-spacing-l);
|
|
75
75
|
--pds-spacing-button-padding-inline-l: var(--pds-spacing-xl);
|
|
76
|
-
--pds-spacing-button-gap-inline-
|
|
76
|
+
--pds-spacing-button-gap-inline-xs: var(--pds-spacing-2xs);
|
|
77
|
+
--pds-spacing-button-gap-inline-s: var(--pds-spacing-2xs);
|
|
78
|
+
--pds-spacing-button-gap-inline-m: var(--pds-spacing-xs);
|
|
79
|
+
--pds-spacing-button-gap-inline-l: var(--pds-spacing-xs);
|
|
77
80
|
--pds-spacing-input-height-s: var(--pds-spacing-2xl);
|
|
78
81
|
--pds-spacing-input-height-m: var(--pds-spacing-3xl);
|
|
79
82
|
--pds-z-index-navigation: 100;
|
|
@@ -70,6 +70,9 @@
|
|
|
70
70
|
--pds-color-spinner-mono-reverse-1: #FFFFFF;
|
|
71
71
|
--pds-color-spinner-mono-reverse-2: #ffffff80;
|
|
72
72
|
--pds-color-spinner-mono-reverse-3: transparent;
|
|
73
|
+
--pds-color-spinner-critical-secondary-1: #DE2E21;
|
|
74
|
+
--pds-color-spinner-critical-secondary-2: #F5B6B0;
|
|
75
|
+
--pds-color-spinner-critical-secondary-3: transparent;
|
|
73
76
|
--pds-color-tag-1-background: #DED8FA;
|
|
74
77
|
--pds-color-tag-1-foreground: #5C4FAC;
|
|
75
78
|
--pds-color-tag-2-background: #F8D7D3;
|
package/build/figma/tokens.json
CHANGED
|
@@ -740,7 +740,24 @@
|
|
|
740
740
|
}
|
|
741
741
|
},
|
|
742
742
|
"gap-inline": {
|
|
743
|
-
"
|
|
743
|
+
"xs": {
|
|
744
|
+
"value": "{spacing.2XS}",
|
|
745
|
+
"type": "dimension",
|
|
746
|
+
"$extensions": {
|
|
747
|
+
"public": true,
|
|
748
|
+
"defaultUnit": "rem",
|
|
749
|
+
"com.figma": {
|
|
750
|
+
"scopes": [
|
|
751
|
+
"GAP"
|
|
752
|
+
],
|
|
753
|
+
"exportAs": "variable",
|
|
754
|
+
"codeSyntax": {
|
|
755
|
+
"WEB": "--pds-spacing-button-gap-inline-xs"
|
|
756
|
+
}
|
|
757
|
+
}
|
|
758
|
+
}
|
|
759
|
+
},
|
|
760
|
+
"s": {
|
|
744
761
|
"value": "{spacing.2XS}",
|
|
745
762
|
"type": "dimension",
|
|
746
763
|
"$extensions": {
|
|
@@ -752,7 +769,41 @@
|
|
|
752
769
|
],
|
|
753
770
|
"exportAs": "variable",
|
|
754
771
|
"codeSyntax": {
|
|
755
|
-
"WEB": "--pds-spacing-button-gap-inline-
|
|
772
|
+
"WEB": "--pds-spacing-button-gap-inline-s"
|
|
773
|
+
}
|
|
774
|
+
}
|
|
775
|
+
}
|
|
776
|
+
},
|
|
777
|
+
"m": {
|
|
778
|
+
"value": "{spacing.XS}",
|
|
779
|
+
"type": "dimension",
|
|
780
|
+
"$extensions": {
|
|
781
|
+
"public": true,
|
|
782
|
+
"defaultUnit": "rem",
|
|
783
|
+
"com.figma": {
|
|
784
|
+
"scopes": [
|
|
785
|
+
"GAP"
|
|
786
|
+
],
|
|
787
|
+
"exportAs": "variable",
|
|
788
|
+
"codeSyntax": {
|
|
789
|
+
"WEB": "--pds-spacing-button-gap-inline-m"
|
|
790
|
+
}
|
|
791
|
+
}
|
|
792
|
+
}
|
|
793
|
+
},
|
|
794
|
+
"l": {
|
|
795
|
+
"value": "{spacing.XS}",
|
|
796
|
+
"type": "dimension",
|
|
797
|
+
"$extensions": {
|
|
798
|
+
"public": true,
|
|
799
|
+
"defaultUnit": "rem",
|
|
800
|
+
"com.figma": {
|
|
801
|
+
"scopes": [
|
|
802
|
+
"GAP"
|
|
803
|
+
],
|
|
804
|
+
"exportAs": "variable",
|
|
805
|
+
"codeSyntax": {
|
|
806
|
+
"WEB": "--pds-spacing-button-gap-inline-l"
|
|
756
807
|
}
|
|
757
808
|
}
|
|
758
809
|
}
|
|
@@ -4756,6 +4807,50 @@
|
|
|
4756
4807
|
}
|
|
4757
4808
|
}
|
|
4758
4809
|
}
|
|
4810
|
+
},
|
|
4811
|
+
"critical-secondary": {
|
|
4812
|
+
"1": {
|
|
4813
|
+
"value": "#DE2E21",
|
|
4814
|
+
"type": "color",
|
|
4815
|
+
"$extensions": {
|
|
4816
|
+
"public": true,
|
|
4817
|
+
"resolveValue": true,
|
|
4818
|
+
"com.figma": {
|
|
4819
|
+
"exportAs": "variable",
|
|
4820
|
+
"codeSyntax": {
|
|
4821
|
+
"WEB": "--pds-color-spinner-critical-secondary-1"
|
|
4822
|
+
}
|
|
4823
|
+
}
|
|
4824
|
+
}
|
|
4825
|
+
},
|
|
4826
|
+
"2": {
|
|
4827
|
+
"value": "#F5B6B0",
|
|
4828
|
+
"type": "color",
|
|
4829
|
+
"$extensions": {
|
|
4830
|
+
"public": true,
|
|
4831
|
+
"resolveValue": true,
|
|
4832
|
+
"com.figma": {
|
|
4833
|
+
"exportAs": "variable",
|
|
4834
|
+
"codeSyntax": {
|
|
4835
|
+
"WEB": "--pds-color-spinner-critical-secondary-2"
|
|
4836
|
+
}
|
|
4837
|
+
}
|
|
4838
|
+
}
|
|
4839
|
+
},
|
|
4840
|
+
"3": {
|
|
4841
|
+
"value": "transparent",
|
|
4842
|
+
"type": "color",
|
|
4843
|
+
"$extensions": {
|
|
4844
|
+
"public": true,
|
|
4845
|
+
"resolveValue": true,
|
|
4846
|
+
"com.figma": {
|
|
4847
|
+
"exportAs": "variable",
|
|
4848
|
+
"codeSyntax": {
|
|
4849
|
+
"WEB": "--pds-color-spinner-critical-secondary-3"
|
|
4850
|
+
}
|
|
4851
|
+
}
|
|
4852
|
+
}
|
|
4853
|
+
}
|
|
4759
4854
|
}
|
|
4760
4855
|
},
|
|
4761
4856
|
"tag": {
|
|
@@ -9294,6 +9389,50 @@
|
|
|
9294
9389
|
}
|
|
9295
9390
|
}
|
|
9296
9391
|
}
|
|
9392
|
+
},
|
|
9393
|
+
"critical-secondary": {
|
|
9394
|
+
"1": {
|
|
9395
|
+
"value": "#e86b61",
|
|
9396
|
+
"type": "color",
|
|
9397
|
+
"$extensions": {
|
|
9398
|
+
"public": true,
|
|
9399
|
+
"resolveValue": true,
|
|
9400
|
+
"com.figma": {
|
|
9401
|
+
"exportAs": "variable",
|
|
9402
|
+
"codeSyntax": {
|
|
9403
|
+
"WEB": "--pds-color-spinner-critical-secondary-1"
|
|
9404
|
+
}
|
|
9405
|
+
}
|
|
9406
|
+
}
|
|
9407
|
+
},
|
|
9408
|
+
"2": {
|
|
9409
|
+
"value": "#de2e21",
|
|
9410
|
+
"type": "color",
|
|
9411
|
+
"$extensions": {
|
|
9412
|
+
"public": true,
|
|
9413
|
+
"resolveValue": true,
|
|
9414
|
+
"com.figma": {
|
|
9415
|
+
"exportAs": "variable",
|
|
9416
|
+
"codeSyntax": {
|
|
9417
|
+
"WEB": "--pds-color-spinner-critical-secondary-2"
|
|
9418
|
+
}
|
|
9419
|
+
}
|
|
9420
|
+
}
|
|
9421
|
+
},
|
|
9422
|
+
"3": {
|
|
9423
|
+
"value": "transparent",
|
|
9424
|
+
"type": "color",
|
|
9425
|
+
"$extensions": {
|
|
9426
|
+
"public": true,
|
|
9427
|
+
"resolveValue": true,
|
|
9428
|
+
"com.figma": {
|
|
9429
|
+
"exportAs": "variable",
|
|
9430
|
+
"codeSyntax": {
|
|
9431
|
+
"WEB": "--pds-color-spinner-critical-secondary-3"
|
|
9432
|
+
}
|
|
9433
|
+
}
|
|
9434
|
+
}
|
|
9435
|
+
}
|
|
9297
9436
|
}
|
|
9298
9437
|
},
|
|
9299
9438
|
"tag": {
|
|
@@ -80,7 +80,10 @@ export const SPACING_BUTTON_PADDING_INLINE_XS: string;
|
|
|
80
80
|
export const SPACING_BUTTON_PADDING_INLINE_S: string;
|
|
81
81
|
export const SPACING_BUTTON_PADDING_INLINE_M: string;
|
|
82
82
|
export const SPACING_BUTTON_PADDING_INLINE_L: string;
|
|
83
|
-
export const
|
|
83
|
+
export const SPACING_BUTTON_GAP_INLINE_XS: string;
|
|
84
|
+
export const SPACING_BUTTON_GAP_INLINE_S: string;
|
|
85
|
+
export const SPACING_BUTTON_GAP_INLINE_M: string;
|
|
86
|
+
export const SPACING_BUTTON_GAP_INLINE_L: string;
|
|
84
87
|
export const SPACING_INPUT_HEIGHT_S: string;
|
|
85
88
|
export const SPACING_INPUT_HEIGHT_M: string;
|
|
86
89
|
export const Z_INDEX_NAVIGATION: number;
|
|
@@ -80,7 +80,10 @@ export const SPACING_BUTTON_PADDING_INLINE_XS = "0.75rem";
|
|
|
80
80
|
export const SPACING_BUTTON_PADDING_INLINE_S = "1rem";
|
|
81
81
|
export const SPACING_BUTTON_PADDING_INLINE_M = "1.25rem";
|
|
82
82
|
export const SPACING_BUTTON_PADDING_INLINE_L = "1.5rem";
|
|
83
|
-
export const
|
|
83
|
+
export const SPACING_BUTTON_GAP_INLINE_XS = "0.5rem";
|
|
84
|
+
export const SPACING_BUTTON_GAP_INLINE_S = "0.5rem";
|
|
85
|
+
export const SPACING_BUTTON_GAP_INLINE_M = "0.625rem";
|
|
86
|
+
export const SPACING_BUTTON_GAP_INLINE_L = "0.625rem";
|
|
84
87
|
export const SPACING_INPUT_HEIGHT_S = "2rem";
|
|
85
88
|
export const SPACING_INPUT_HEIGHT_M = "2.5rem";
|
|
86
89
|
export const Z_INDEX_NAVIGATION = 100;
|
package/build/json/tokens.json
CHANGED
|
@@ -1704,7 +1704,30 @@
|
|
|
1704
1704
|
}
|
|
1705
1705
|
},
|
|
1706
1706
|
"gap-inline": {
|
|
1707
|
-
"
|
|
1707
|
+
"xs": {
|
|
1708
|
+
"value": "0.5",
|
|
1709
|
+
"filePath": "tokens/spacing/semantic/button.json",
|
|
1710
|
+
"isSource": true,
|
|
1711
|
+
"original": {
|
|
1712
|
+
"value": "{spacing.2XS}",
|
|
1713
|
+
"public": true
|
|
1714
|
+
},
|
|
1715
|
+
"name": "SpacingButtonGapInlineXs",
|
|
1716
|
+
"attributes": {
|
|
1717
|
+
"category": "spacing",
|
|
1718
|
+
"type": "button",
|
|
1719
|
+
"item": "gap-inline",
|
|
1720
|
+
"subitem": "xs"
|
|
1721
|
+
},
|
|
1722
|
+
"path": [
|
|
1723
|
+
"spacing",
|
|
1724
|
+
"button",
|
|
1725
|
+
"gap-inline",
|
|
1726
|
+
"xs"
|
|
1727
|
+
],
|
|
1728
|
+
"public": true
|
|
1729
|
+
},
|
|
1730
|
+
"s": {
|
|
1708
1731
|
"value": "0.5",
|
|
1709
1732
|
"filePath": "tokens/spacing/semantic/button.json",
|
|
1710
1733
|
"isSource": true,
|
|
@@ -1712,18 +1735,64 @@
|
|
|
1712
1735
|
"value": "{spacing.2XS}",
|
|
1713
1736
|
"public": true
|
|
1714
1737
|
},
|
|
1715
|
-
"name": "
|
|
1738
|
+
"name": "SpacingButtonGapInlineS",
|
|
1716
1739
|
"attributes": {
|
|
1717
1740
|
"category": "spacing",
|
|
1718
1741
|
"type": "button",
|
|
1719
1742
|
"item": "gap-inline",
|
|
1720
|
-
"subitem": "
|
|
1743
|
+
"subitem": "s"
|
|
1721
1744
|
},
|
|
1722
1745
|
"path": [
|
|
1723
1746
|
"spacing",
|
|
1724
1747
|
"button",
|
|
1725
1748
|
"gap-inline",
|
|
1726
|
-
"
|
|
1749
|
+
"s"
|
|
1750
|
+
],
|
|
1751
|
+
"public": true
|
|
1752
|
+
},
|
|
1753
|
+
"m": {
|
|
1754
|
+
"value": "0.625",
|
|
1755
|
+
"filePath": "tokens/spacing/semantic/button.json",
|
|
1756
|
+
"isSource": true,
|
|
1757
|
+
"original": {
|
|
1758
|
+
"value": "{spacing.XS}",
|
|
1759
|
+
"public": true
|
|
1760
|
+
},
|
|
1761
|
+
"name": "SpacingButtonGapInlineM",
|
|
1762
|
+
"attributes": {
|
|
1763
|
+
"category": "spacing",
|
|
1764
|
+
"type": "button",
|
|
1765
|
+
"item": "gap-inline",
|
|
1766
|
+
"subitem": "m"
|
|
1767
|
+
},
|
|
1768
|
+
"path": [
|
|
1769
|
+
"spacing",
|
|
1770
|
+
"button",
|
|
1771
|
+
"gap-inline",
|
|
1772
|
+
"m"
|
|
1773
|
+
],
|
|
1774
|
+
"public": true
|
|
1775
|
+
},
|
|
1776
|
+
"l": {
|
|
1777
|
+
"value": "0.625",
|
|
1778
|
+
"filePath": "tokens/spacing/semantic/button.json",
|
|
1779
|
+
"isSource": true,
|
|
1780
|
+
"original": {
|
|
1781
|
+
"value": "{spacing.XS}",
|
|
1782
|
+
"public": true
|
|
1783
|
+
},
|
|
1784
|
+
"name": "SpacingButtonGapInlineL",
|
|
1785
|
+
"attributes": {
|
|
1786
|
+
"category": "spacing",
|
|
1787
|
+
"type": "button",
|
|
1788
|
+
"item": "gap-inline",
|
|
1789
|
+
"subitem": "l"
|
|
1790
|
+
},
|
|
1791
|
+
"path": [
|
|
1792
|
+
"spacing",
|
|
1793
|
+
"button",
|
|
1794
|
+
"gap-inline",
|
|
1795
|
+
"l"
|
|
1727
1796
|
],
|
|
1728
1797
|
"public": true
|
|
1729
1798
|
}
|
package/package.json
CHANGED