@pantheon-systems/pds-design-tokens 1.0.0-dev.2 → 1.0.0-dev.3

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 (8) hide show
  1. package/build/css/pds-design-tokens-dark-mode.css +5 -0
  2. package/build/css/pds-design-tokens-light-mode.css +5 -0
  3. package/build/figma/pds-design-tokens-figma.json +276 -0
  4. package/build/json/pds-design-tokens-dark-mode.json +137 -0
  5. package/build/json/pds-design-tokens-light-mode.json +139 -0
  6. package/build/scss/_pds-design-tokens-dark-mode.scss +5 -0
  7. package/build/scss/_pds-design-tokens-light-mode.scss +5 -0
  8. package/package.json +1 -1
package/build/css/pds-design-tokens-dark-mode.css CHANGED
@@ -72,6 +72,11 @@
72
72
  --pds-color-link-default: #36a3ff;
73
73
  --pds-color-link-hover: #2776b9;
74
74
  --pds-color-link-visited: #967fff;
75
+ --pds-color-menu-background: #121219;
76
+ --pds-color-menu-item-background-active: #282839;
77
+ --pds-color-menu-item-background-default: #121219;
78
+ --pds-color-menu-item-background-hover: #1d1d29;
79
+ --pds-color-menu-item-foreground: #ffffff;
75
80
  --pds-color-panel-default-background: var(--pds-color-background-default);
76
81
  --pds-color-panel-default-border: var(--pds-color-border-default);
77
82
  --pds-color-panel-overlay-background: #282839;
package/build/css/pds-design-tokens-light-mode.css CHANGED
@@ -72,6 +72,11 @@
72
72
  --pds-color-link-default: #0f62fe;
73
73
  --pds-color-link-hover: #003cac;
74
74
  --pds-color-link-visited: #967fff;
75
+ --pds-color-menu-item-background-active: #cfcfd3;
76
+ --pds-color-menu-item-background-default: #ffffff;
77
+ --pds-color-menu-item-background-hover: #f1f1f1;
78
+ --pds-color-menu-item-foreground: #23232d;
79
+ --pds-color-menu-item-menu-background: #ffffff;
75
80
  --pds-color-panel-default-background: var(--pds-color-background-default);
76
81
  --pds-color-panel-default-border: var(--pds-color-border-default);
77
82
  --pds-color-panel-overlay-background: var(--pds-color-background-default);
package/build/figma/pds-design-tokens-figma.json CHANGED
@@ -3122,6 +3122,143 @@
3122
3122
  ]
3123
3123
  }
3124
3124
  },
3125
+ "menu": {
3126
+ "background": {
3127
+ "value": "#121219",
3128
+ "public": true,
3129
+ "isReferenceToInternal": true,
3130
+ "filePath": "tokens/color/alias/menu.dark.json",
3131
+ "isSource": true,
3132
+ "original": {
3133
+ "value": "{color.dark-mode.neutral.700}",
3134
+ "public": true,
3135
+ "isReferenceToInternal": true
3136
+ },
3137
+ "name": "color-dark-mode-menu-background",
3138
+ "attributes": {
3139
+ "category": "color",
3140
+ "type": "dark-mode",
3141
+ "item": "menu",
3142
+ "subitem": "background"
3143
+ },
3144
+ "path": [
3145
+ "color",
3146
+ "dark-mode",
3147
+ "menu",
3148
+ "background"
3149
+ ]
3150
+ }
3151
+ },
3152
+ "menu-item": {
3153
+ "background": {
3154
+ "default": {
3155
+ "value": "#121219",
3156
+ "public": true,
3157
+ "isReferenceToInternal": true,
3158
+ "filePath": "tokens/color/alias/menu.dark.json",
3159
+ "isSource": true,
3160
+ "original": {
3161
+ "value": "{color.dark-mode.neutral.700}",
3162
+ "public": true,
3163
+ "isReferenceToInternal": true
3164
+ },
3165
+ "name": "color-dark-mode-menu-item-background-default",
3166
+ "attributes": {
3167
+ "category": "color",
3168
+ "type": "dark-mode",
3169
+ "item": "menu-item",
3170
+ "subitem": "background",
3171
+ "state": "default"
3172
+ },
3173
+ "path": [
3174
+ "color",
3175
+ "dark-mode",
3176
+ "menu-item",
3177
+ "background",
3178
+ "default"
3179
+ ]
3180
+ },
3181
+ "hover": {
3182
+ "value": "#1d1d29",
3183
+ "public": true,
3184
+ "isReferenceToInternal": true,
3185
+ "filePath": "tokens/color/alias/menu.dark.json",
3186
+ "isSource": true,
3187
+ "original": {
3188
+ "value": "{color.dark-mode.neutral.600}",
3189
+ "public": true,
3190
+ "isReferenceToInternal": true
3191
+ },
3192
+ "name": "color-dark-mode-menu-item-background-hover",
3193
+ "attributes": {
3194
+ "category": "color",
3195
+ "type": "dark-mode",
3196
+ "item": "menu-item",
3197
+ "subitem": "background",
3198
+ "state": "hover"
3199
+ },
3200
+ "path": [
3201
+ "color",
3202
+ "dark-mode",
3203
+ "menu-item",
3204
+ "background",
3205
+ "hover"
3206
+ ]
3207
+ },
3208
+ "active": {
3209
+ "value": "#282839",
3210
+ "public": true,
3211
+ "isReferenceToInternal": true,
3212
+ "filePath": "tokens/color/alias/menu.dark.json",
3213
+ "isSource": true,
3214
+ "original": {
3215
+ "value": "{color.dark-mode.neutral.500}",
3216
+ "public": true,
3217
+ "isReferenceToInternal": true
3218
+ },
3219
+ "name": "color-dark-mode-menu-item-background-active",
3220
+ "attributes": {
3221
+ "category": "color",
3222
+ "type": "dark-mode",
3223
+ "item": "menu-item",
3224
+ "subitem": "background",
3225
+ "state": "active"
3226
+ },
3227
+ "path": [
3228
+ "color",
3229
+ "dark-mode",
3230
+ "menu-item",
3231
+ "background",
3232
+ "active"
3233
+ ]
3234
+ }
3235
+ },
3236
+ "foreground": {
3237
+ "value": "#ffffff",
3238
+ "public": true,
3239
+ "isReferenceToInternal": true,
3240
+ "filePath": "tokens/color/alias/menu.dark.json",
3241
+ "isSource": true,
3242
+ "original": {
3243
+ "value": "{color.dark-mode.foreground.default}",
3244
+ "public": true,
3245
+ "isReferenceToInternal": true
3246
+ },
3247
+ "name": "color-dark-mode-menu-item-foreground",
3248
+ "attributes": {
3249
+ "category": "color",
3250
+ "type": "dark-mode",
3251
+ "item": "menu-item",
3252
+ "subitem": "foreground"
3253
+ },
3254
+ "path": [
3255
+ "color",
3256
+ "dark-mode",
3257
+ "menu-item",
3258
+ "foreground"
3259
+ ]
3260
+ }
3261
+ },
3125
3262
  "panel": {
3126
3263
  "default": {
3127
3264
  "background": {
@@ -6664,6 +6801,145 @@
6664
6801
  ]
6665
6802
  }
6666
6803
  },
6804
+ "menu-item": {
6805
+ "menu": {
6806
+ "background": {
6807
+ "value": "#ffffff",
6808
+ "public": true,
6809
+ "isReferenceToInternal": true,
6810
+ "filePath": "tokens/color/alias/menu.light.json",
6811
+ "isSource": true,
6812
+ "original": {
6813
+ "value": "{color.light-mode.background.default}",
6814
+ "public": true,
6815
+ "isReferenceToInternal": true
6816
+ },
6817
+ "name": "color-light-mode-menu-item-menu-background",
6818
+ "attributes": {
6819
+ "category": "color",
6820
+ "type": "light-mode",
6821
+ "item": "menu-item",
6822
+ "subitem": "menu",
6823
+ "state": "background"
6824
+ },
6825
+ "path": [
6826
+ "color",
6827
+ "light-mode",
6828
+ "menu-item",
6829
+ "menu",
6830
+ "background"
6831
+ ]
6832
+ }
6833
+ },
6834
+ "background": {
6835
+ "default": {
6836
+ "value": "#ffffff",
6837
+ "public": true,
6838
+ "isReferenceToInternal": true,
6839
+ "filePath": "tokens/color/alias/menu.light.json",
6840
+ "isSource": true,
6841
+ "original": {
6842
+ "value": "{color.light-mode.background.default}",
6843
+ "public": true,
6844
+ "isReferenceToInternal": true
6845
+ },
6846
+ "name": "color-light-mode-menu-item-background-default",
6847
+ "attributes": {
6848
+ "category": "color",
6849
+ "type": "light-mode",
6850
+ "item": "menu-item",
6851
+ "subitem": "background",
6852
+ "state": "default"
6853
+ },
6854
+ "path": [
6855
+ "color",
6856
+ "light-mode",
6857
+ "menu-item",
6858
+ "background",
6859
+ "default"
6860
+ ]
6861
+ },
6862
+ "hover": {
6863
+ "value": "#f1f1f1",
6864
+ "public": true,
6865
+ "isReferenceToInternal": true,
6866
+ "filePath": "tokens/color/alias/menu.light.json",
6867
+ "isSource": true,
6868
+ "original": {
6869
+ "value": "{color.light-mode.neutral.050}",
6870
+ "public": true,
6871
+ "isReferenceToInternal": true
6872
+ },
6873
+ "name": "color-light-mode-menu-item-background-hover",
6874
+ "attributes": {
6875
+ "category": "color",
6876
+ "type": "light-mode",
6877
+ "item": "menu-item",
6878
+ "subitem": "background",
6879
+ "state": "hover"
6880
+ },
6881
+ "path": [
6882
+ "color",
6883
+ "light-mode",
6884
+ "menu-item",
6885
+ "background",
6886
+ "hover"
6887
+ ]
6888
+ },
6889
+ "active": {
6890
+ "value": "#cfcfd3",
6891
+ "public": true,
6892
+ "isReferenceToInternal": true,
6893
+ "filePath": "tokens/color/alias/menu.light.json",
6894
+ "isSource": true,
6895
+ "original": {
6896
+ "value": "{color.light-mode.neutral.100}",
6897
+ "public": true,
6898
+ "isReferenceToInternal": true
6899
+ },
6900
+ "name": "color-light-mode-menu-item-background-active",
6901
+ "attributes": {
6902
+ "category": "color",
6903
+ "type": "light-mode",
6904
+ "item": "menu-item",
6905
+ "subitem": "background",
6906
+ "state": "active"
6907
+ },
6908
+ "path": [
6909
+ "color",
6910
+ "light-mode",
6911
+ "menu-item",
6912
+ "background",
6913
+ "active"
6914
+ ]
6915
+ }
6916
+ },
6917
+ "foreground": {
6918
+ "value": "#23232d",
6919
+ "public": true,
6920
+ "isReferenceToInternal": true,
6921
+ "filePath": "tokens/color/alias/menu.light.json",
6922
+ "isSource": true,
6923
+ "original": {
6924
+ "value": "{color.light-mode.foreground.default}",
6925
+ "public": true,
6926
+ "isReferenceToInternal": true
6927
+ },
6928
+ "name": "color-light-mode-menu-item-foreground",
6929
+ "attributes": {
6930
+ "category": "color",
6931
+ "type": "light-mode",
6932
+ "item": "menu-item",
6933
+ "subitem": "foreground"
6934
+ },
6935
+ "path": [
6936
+ "color",
6937
+ "light-mode",
6938
+ "menu-item",
6939
+ "foreground"
6940
+ ]
6941
+ }
6942
+ },
6667
6943
  "panel": {
6668
6944
  "default": {
6669
6945
  "background": {
package/build/json/pds-design-tokens-dark-mode.json CHANGED
@@ -1536,6 +1536,143 @@
1536
1536
  ]
1537
1537
  }
1538
1538
  },
1539
+ "menu": {
1540
+ "background": {
1541
+ "value": "#121219",
1542
+ "public": true,
1543
+ "isReferenceToInternal": true,
1544
+ "filePath": "tokens/color/alias/menu.dark.json",
1545
+ "isSource": true,
1546
+ "original": {
1547
+ "value": "{color.dark-mode.neutral.700}",
1548
+ "public": true,
1549
+ "isReferenceToInternal": true
1550
+ },
1551
+ "name": "color-dark-mode-menu-background",
1552
+ "attributes": {
1553
+ "category": "color",
1554
+ "type": "dark-mode",
1555
+ "item": "menu",
1556
+ "subitem": "background"
1557
+ },
1558
+ "path": [
1559
+ "color",
1560
+ "dark-mode",
1561
+ "menu",
1562
+ "background"
1563
+ ]
1564
+ }
1565
+ },
1566
+ "menu-item": {
1567
+ "background": {
1568
+ "default": {
1569
+ "value": "#121219",
1570
+ "public": true,
1571
+ "isReferenceToInternal": true,
1572
+ "filePath": "tokens/color/alias/menu.dark.json",
1573
+ "isSource": true,
1574
+ "original": {
1575
+ "value": "{color.dark-mode.neutral.700}",
1576
+ "public": true,
1577
+ "isReferenceToInternal": true
1578
+ },
1579
+ "name": "color-dark-mode-menu-item-background-default",
1580
+ "attributes": {
1581
+ "category": "color",
1582
+ "type": "dark-mode",
1583
+ "item": "menu-item",
1584
+ "subitem": "background",
1585
+ "state": "default"
1586
+ },
1587
+ "path": [
1588
+ "color",
1589
+ "dark-mode",
1590
+ "menu-item",
1591
+ "background",
1592
+ "default"
1593
+ ]
1594
+ },
1595
+ "hover": {
1596
+ "value": "#1d1d29",
1597
+ "public": true,
1598
+ "isReferenceToInternal": true,
1599
+ "filePath": "tokens/color/alias/menu.dark.json",
1600
+ "isSource": true,
1601
+ "original": {
1602
+ "value": "{color.dark-mode.neutral.600}",
1603
+ "public": true,
1604
+ "isReferenceToInternal": true
1605
+ },
1606
+ "name": "color-dark-mode-menu-item-background-hover",
1607
+ "attributes": {
1608
+ "category": "color",
1609
+ "type": "dark-mode",
1610
+ "item": "menu-item",
1611
+ "subitem": "background",
1612
+ "state": "hover"
1613
+ },
1614
+ "path": [
1615
+ "color",
1616
+ "dark-mode",
1617
+ "menu-item",
1618
+ "background",
1619
+ "hover"
1620
+ ]
1621
+ },
1622
+ "active": {
1623
+ "value": "#282839",
1624
+ "public": true,
1625
+ "isReferenceToInternal": true,
1626
+ "filePath": "tokens/color/alias/menu.dark.json",
1627
+ "isSource": true,
1628
+ "original": {
1629
+ "value": "{color.dark-mode.neutral.500}",
1630
+ "public": true,
1631
+ "isReferenceToInternal": true
1632
+ },
1633
+ "name": "color-dark-mode-menu-item-background-active",
1634
+ "attributes": {
1635
+ "category": "color",
1636
+ "type": "dark-mode",
1637
+ "item": "menu-item",
1638
+ "subitem": "background",
1639
+ "state": "active"
1640
+ },
1641
+ "path": [
1642
+ "color",
1643
+ "dark-mode",
1644
+ "menu-item",
1645
+ "background",
1646
+ "active"
1647
+ ]
1648
+ }
1649
+ },
1650
+ "foreground": {
1651
+ "value": "#ffffff",
1652
+ "public": true,
1653
+ "isReferenceToInternal": true,
1654
+ "filePath": "tokens/color/alias/menu.dark.json",
1655
+ "isSource": true,
1656
+ "original": {
1657
+ "value": "{color.dark-mode.foreground.default}",
1658
+ "public": true,
1659
+ "isReferenceToInternal": true
1660
+ },
1661
+ "name": "color-dark-mode-menu-item-foreground",
1662
+ "attributes": {
1663
+ "category": "color",
1664
+ "type": "dark-mode",
1665
+ "item": "menu-item",
1666
+ "subitem": "foreground"
1667
+ },
1668
+ "path": [
1669
+ "color",
1670
+ "dark-mode",
1671
+ "menu-item",
1672
+ "foreground"
1673
+ ]
1674
+ }
1675
+ },
1539
1676
  "panel": {
1540
1677
  "default": {
1541
1678
  "background": {
package/build/json/pds-design-tokens-light-mode.json CHANGED
@@ -1536,6 +1536,145 @@
1536
1536
  ]
1537
1537
  }
1538
1538
  },
1539
+ "menu-item": {
1540
+ "menu": {
1541
+ "background": {
1542
+ "value": "#ffffff",
1543
+ "public": true,
1544
+ "isReferenceToInternal": true,
1545
+ "filePath": "tokens/color/alias/menu.light.json",
1546
+ "isSource": true,
1547
+ "original": {
1548
+ "value": "{color.light-mode.background.default}",
1549
+ "public": true,
1550
+ "isReferenceToInternal": true
1551
+ },
1552
+ "name": "color-light-mode-menu-item-menu-background",
1553
+ "attributes": {
1554
+ "category": "color",
1555
+ "type": "light-mode",
1556
+ "item": "menu-item",
1557
+ "subitem": "menu",
1558
+ "state": "background"
1559
+ },
1560
+ "path": [
1561
+ "color",
1562
+ "light-mode",
1563
+ "menu-item",
1564
+ "menu",
1565
+ "background"
1566
+ ]
1567
+ }
1568
+ },
1569
+ "background": {
1570
+ "default": {
1571
+ "value": "#ffffff",
1572
+ "public": true,
1573
+ "isReferenceToInternal": true,
1574
+ "filePath": "tokens/color/alias/menu.light.json",
1575
+ "isSource": true,
1576
+ "original": {
1577
+ "value": "{color.light-mode.background.default}",
1578
+ "public": true,
1579
+ "isReferenceToInternal": true
1580
+ },
1581
+ "name": "color-light-mode-menu-item-background-default",
1582
+ "attributes": {
1583
+ "category": "color",
1584
+ "type": "light-mode",
1585
+ "item": "menu-item",
1586
+ "subitem": "background",
1587
+ "state": "default"
1588
+ },
1589
+ "path": [
1590
+ "color",
1591
+ "light-mode",
1592
+ "menu-item",
1593
+ "background",
1594
+ "default"
1595
+ ]
1596
+ },
1597
+ "hover": {
1598
+ "value": "#f1f1f1",
1599
+ "public": true,
1600
+ "isReferenceToInternal": true,
1601
+ "filePath": "tokens/color/alias/menu.light.json",
1602
+ "isSource": true,
1603
+ "original": {
1604
+ "value": "{color.light-mode.neutral.050}",
1605
+ "public": true,
1606
+ "isReferenceToInternal": true
1607
+ },
1608
+ "name": "color-light-mode-menu-item-background-hover",
1609
+ "attributes": {
1610
+ "category": "color",
1611
+ "type": "light-mode",
1612
+ "item": "menu-item",
1613
+ "subitem": "background",
1614
+ "state": "hover"
1615
+ },
1616
+ "path": [
1617
+ "color",
1618
+ "light-mode",
1619
+ "menu-item",
1620
+ "background",
1621
+ "hover"
1622
+ ]
1623
+ },
1624
+ "active": {
1625
+ "value": "#cfcfd3",
1626
+ "public": true,
1627
+ "isReferenceToInternal": true,
1628
+ "filePath": "tokens/color/alias/menu.light.json",
1629
+ "isSource": true,
1630
+ "original": {
1631
+ "value": "{color.light-mode.neutral.100}",
1632
+ "public": true,
1633
+ "isReferenceToInternal": true
1634
+ },
1635
+ "name": "color-light-mode-menu-item-background-active",
1636
+ "attributes": {
1637
+ "category": "color",
1638
+ "type": "light-mode",
1639
+ "item": "menu-item",
1640
+ "subitem": "background",
1641
+ "state": "active"
1642
+ },
1643
+ "path": [
1644
+ "color",
1645
+ "light-mode",
1646
+ "menu-item",
1647
+ "background",
1648
+ "active"
1649
+ ]
1650
+ }
1651
+ },
1652
+ "foreground": {
1653
+ "value": "#23232d",
1654
+ "public": true,
1655
+ "isReferenceToInternal": true,
1656
+ "filePath": "tokens/color/alias/menu.light.json",
1657
+ "isSource": true,
1658
+ "original": {
1659
+ "value": "{color.light-mode.foreground.default}",
1660
+ "public": true,
1661
+ "isReferenceToInternal": true
1662
+ },
1663
+ "name": "color-light-mode-menu-item-foreground",
1664
+ "attributes": {
1665
+ "category": "color",
1666
+ "type": "light-mode",
1667
+ "item": "menu-item",
1668
+ "subitem": "foreground"
1669
+ },
1670
+ "path": [
1671
+ "color",
1672
+ "light-mode",
1673
+ "menu-item",
1674
+ "foreground"
1675
+ ]
1676
+ }
1677
+ },
1539
1678
  "panel": {
1540
1679
  "default": {
1541
1680
  "background": {
package/build/scss/_pds-design-tokens-dark-mode.scss CHANGED
@@ -70,6 +70,11 @@ $pds-color-link-active: #2776b9;
70
70
  $pds-color-link-default: #36a3ff;
71
71
  $pds-color-link-hover: #2776b9;
72
72
  $pds-color-link-visited: #967fff;
73
+ $pds-color-menu-background: #121219;
74
+ $pds-color-menu-item-background-active: #282839;
75
+ $pds-color-menu-item-background-default: #121219;
76
+ $pds-color-menu-item-background-hover: #1d1d29;
77
+ $pds-color-menu-item-foreground: #ffffff;
73
78
  $pds-color-panel-default-background: $pds-color-background-default;
74
79
  $pds-color-panel-default-border: $pds-color-border-default;
75
80
  $pds-color-panel-overlay-background: #282839;
package/build/scss/_pds-design-tokens-light-mode.scss CHANGED
@@ -70,6 +70,11 @@ $pds-color-link-active: #003cac;
70
70
  $pds-color-link-default: #0f62fe;
71
71
  $pds-color-link-hover: #003cac;
72
72
  $pds-color-link-visited: #967fff;
73
+ $pds-color-menu-item-background-active: #cfcfd3;
74
+ $pds-color-menu-item-background-default: #ffffff;
75
+ $pds-color-menu-item-background-hover: #f1f1f1;
76
+ $pds-color-menu-item-foreground: #23232d;
77
+ $pds-color-menu-item-menu-background: #ffffff;
73
78
  $pds-color-panel-default-background: $pds-color-background-default;
74
79
  $pds-color-panel-default-border: $pds-color-border-default;
75
80
  $pds-color-panel-overlay-background: $pds-color-background-default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pantheon-systems/pds-design-tokens",
3
- "version": "1.0.0-dev.2",
3
+ "version": "1.0.0-dev.3",
4
4
  "description": "Design Tokens for the Pantheon Design System",
5
5
  "homepage": "https://pantheon.io",
6
6
  "keywords": [