@rijkshuisstijl-community/design-tokens 1.0.0-alpha.167 → 1.0.0-alpha.169

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 (53) hide show
  1. package/dist/_variables.scss +67 -72
  2. package/dist/index.css +67 -72
  3. package/dist/index.d.ts +11 -16
  4. package/dist/index.js +67 -72
  5. package/dist/index.json +66 -71
  6. package/dist/index.tokens.json +57 -64
  7. package/dist/root.css +67 -72
  8. package/dist/tokens.d.ts +2 -9
  9. package/dist/tokens.js +145 -266
  10. package/dist/uitvoerend-mintgroen-focus/_variables.scss +112 -119
  11. package/dist/uitvoerend-mintgroen-focus/index.css +112 -119
  12. package/dist/uitvoerend-mintgroen-focus/index.d.ts +51 -58
  13. package/dist/uitvoerend-mintgroen-focus/index.js +112 -119
  14. package/dist/uitvoerend-mintgroen-focus/index.json +111 -118
  15. package/dist/uitvoerend-mintgroen-focus/index.tokens.json +121 -138
  16. package/dist/uitvoerend-mintgroen-focus/root.css +112 -119
  17. package/dist/uitvoerend-mintgroen-focus/tokens.d.ts +61 -78
  18. package/dist/uitvoerend-mintgroen-focus/tokens.js +3136 -3313
  19. package/dist/uitvoerend-violet/_variables.scss +72 -77
  20. package/dist/uitvoerend-violet/index.css +72 -77
  21. package/dist/uitvoerend-violet/index.d.ts +11 -16
  22. package/dist/uitvoerend-violet/index.js +72 -77
  23. package/dist/uitvoerend-violet/index.json +71 -76
  24. package/dist/uitvoerend-violet/index.tokens.json +62 -69
  25. package/dist/uitvoerend-violet/root.css +72 -77
  26. package/dist/uitvoerend-violet/tokens.d.ts +2 -9
  27. package/dist/uitvoerend-violet/tokens.js +155 -276
  28. package/dist/uitvoerend-violet-oud/_variables.scss +72 -77
  29. package/dist/uitvoerend-violet-oud/index.css +72 -77
  30. package/dist/uitvoerend-violet-oud/index.d.ts +11 -16
  31. package/dist/uitvoerend-violet-oud/index.js +72 -77
  32. package/dist/uitvoerend-violet-oud/index.json +71 -76
  33. package/dist/uitvoerend-violet-oud/index.tokens.json +62 -69
  34. package/dist/uitvoerend-violet-oud/root.css +72 -77
  35. package/dist/uitvoerend-violet-oud/tokens.d.ts +2 -9
  36. package/dist/uitvoerend-violet-oud/tokens.js +155 -276
  37. package/dist/wetgevend/_variables.scss +66 -71
  38. package/dist/wetgevend/index.css +66 -71
  39. package/dist/wetgevend/index.d.ts +11 -16
  40. package/dist/wetgevend/index.js +66 -71
  41. package/dist/wetgevend/index.json +65 -70
  42. package/dist/wetgevend/index.tokens.json +56 -63
  43. package/dist/wetgevend/root.css +66 -71
  44. package/dist/wetgevend/tokens.d.ts +2 -9
  45. package/dist/wetgevend/tokens.js +143 -264
  46. package/figma/figma.tokens.json +145 -165
  47. package/package.json +2 -2
  48. package/src/generated/base.tokens.json +57 -81
  49. package/src/generated/themes.json +442 -554
  50. package/src/generated/uitvoerend-mintgroen-focus/tokens.json +231 -271
  51. package/src/generated/uitvoerend-violet/tokens.json +62 -86
  52. package/src/generated/uitvoerend-violet-oud/tokens.json +62 -86
  53. package/src/generated/wetgevend/tokens.json +56 -80
@@ -32,7 +32,7 @@
32
32
  "border-color": "#007bc7"
33
33
  },
34
34
  "hover": {
35
- "color": "#154273",
35
+ "color": "#0F172A",
36
36
  "background-color": "#66AFDD"
37
37
  },
38
38
  "focus": {
@@ -53,7 +53,7 @@
53
53
  "font-weight": 400,
54
54
  "current": {
55
55
  "font-weight": 700,
56
- "color": "#154273"
56
+ "color": "#0F172A"
57
57
  },
58
58
  "color": "#01689b",
59
59
  "active": {
@@ -86,7 +86,7 @@
86
86
  },
87
87
  "navigation-list": {
88
88
  "icon": {
89
- "background-color": "#154273",
89
+ "background-color": "#0F172A",
90
90
  "border-radius": "999px",
91
91
  "color": "#fff"
92
92
  },
@@ -121,7 +121,7 @@
121
121
  "border-width": "1px",
122
122
  "border-color": "#CBD5E1",
123
123
  "heading": {
124
- "color": "#154273"
124
+ "color": "#0F172A"
125
125
  },
126
126
  "column-gap": "1rem",
127
127
  "min-height": "48px",
@@ -140,7 +140,7 @@
140
140
  "column-gap": "1rem"
141
141
  },
142
142
  "icon": {
143
- "color": "#154273",
143
+ "color": "#0F172A",
144
144
  "active": {
145
145
  "color": "#fff"
146
146
  },
@@ -172,7 +172,7 @@
172
172
  },
173
173
  "background-color": "#fff",
174
174
  "color": "#154273",
175
- "border-color": "#64748B"
175
+ "border-color": "#4f7196"
176
176
  },
177
177
  "message-list": {
178
178
  "item": {
@@ -183,7 +183,7 @@
183
183
  "column-gap": "1rem",
184
184
  "icon": {
185
185
  "size": "24px",
186
- "color": "#154273"
186
+ "color": "#0F172A"
187
187
  },
188
188
  "min-height": "48px",
189
189
  "padding-block": "0.75rem",
@@ -200,7 +200,7 @@
200
200
  "line-height": "150%"
201
201
  },
202
202
  "heading": {
203
- "color": "#154273"
203
+ "color": "#0F172A"
204
204
  }
205
205
  }
206
206
  },
@@ -371,11 +371,11 @@
371
371
  "border-color": "#CBD5E1",
372
372
  "border-radius": "5px",
373
373
  "border-width": "1px",
374
- "color": "#154273",
374
+ "color": "#0F172A",
375
375
  "column-gap": "1rem",
376
376
  "inline-size": "328px",
377
377
  "icon": {
378
- "color": "#154273",
378
+ "color": "#0F172A",
379
379
  "size": "24px"
380
380
  },
381
381
  "link": {
@@ -392,7 +392,7 @@
392
392
  }
393
393
  },
394
394
  "metadata": {
395
- "color": "#154273"
395
+ "color": "#0F172A"
396
396
  },
397
397
  "padding-block-end": "1rem",
398
398
  "padding-block-start": "1rem",
@@ -451,7 +451,7 @@
451
451
  "padding-inline-start": "1rem",
452
452
  "expanded": {
453
453
  "background-color": "#fff",
454
- "color": "#154273"
454
+ "color": "#0F172A"
455
455
  }
456
456
  },
457
457
  "section": {
@@ -463,7 +463,7 @@
463
463
  "margin": 0
464
464
  },
465
465
  "border-radius": "0px",
466
- "color": "#154273"
466
+ "color": "#0F172A"
467
467
  },
468
468
  "keep": {
469
469
  "top-left": {
@@ -503,8 +503,7 @@
503
503
  "outline": "#000"
504
504
  },
505
505
  "foreground": {
506
- "default": "#000",
507
- "lint": "#154273",
506
+ "default": "#0F172A",
508
507
  "subdued": "#334155",
509
508
  "onEmphasis": "#fff",
510
509
  "link": "#01689b"
@@ -512,7 +511,7 @@
512
511
  "border": {
513
512
  "default": "#64748B",
514
513
  "subdued": "#94A3B8",
515
- "strong": "#000"
514
+ "strong": "#0F172A"
516
515
  },
517
516
  "canvas": "#fff",
518
517
  "feedback": {
@@ -545,7 +544,7 @@
545
544
  "500": "#154273",
546
545
  "hover": "#162f50"
547
546
  },
548
- "grijs": {
547
+ "cool-grey": {
549
548
  "50": "#F8FAFC",
550
549
  "100": "#F1F5F9",
551
550
  "200": "#E2E8F0",
@@ -807,7 +806,7 @@
807
806
  "padding-inline-start": "1.5rem",
808
807
  "margin-block-end": "0.25rem",
809
808
  "margin-block-start": "0.25rem",
810
- "color": "#154273",
809
+ "color": "#0F172A",
811
810
  "font-family": "Fira Sans, Arial, Verdana, sans-serif",
812
811
  "font-weight": 400,
813
812
  "font-size": "1.25rem",
@@ -818,8 +817,8 @@
818
817
  "margin-block-start": "0.25rem"
819
818
  },
820
819
  "marker": {
821
- "color": "#154273",
822
- "border-color": "#154273"
820
+ "color": "#0F172A",
821
+ "border-color": "#0F172A"
823
822
  }
824
823
  },
825
824
  "textbox": {
@@ -835,11 +834,11 @@
835
834
  "padding-inline-start": "0.75rem",
836
835
  "background-color": "#fff",
837
836
  "border-color": "#154273",
838
- "color": "#154273",
837
+ "color": "#0F172A",
839
838
  "invalid": {
840
839
  "background-color": "#f9dfdd",
841
840
  "border-color": "#d52b1e",
842
- "color": "#154273",
841
+ "color": "#0F172A",
843
842
  "border-width": "1px"
844
843
  },
845
844
  "placeholder": {
@@ -851,7 +850,7 @@
851
850
  "border-width": "2px",
852
851
  "background-color": "#fff",
853
852
  "border-color": "#154273",
854
- "color": "#154273"
853
+ "color": "#0F172A"
855
854
  },
856
855
  "disabled": {
857
856
  "background-color": "#CBD5E1",
@@ -861,13 +860,13 @@
861
860
  "read-only": {
862
861
  "background-color": "#F1F5F9",
863
862
  "border-color": "transparent",
864
- "color": "#154273"
863
+ "color": "#0F172A"
865
864
  },
866
865
  "hover": {
867
866
  "border-width": "1px",
868
867
  "background-color": "#fff",
869
868
  "border-color": "#738eab",
870
- "color": "#154273"
869
+ "color": "#0F172A"
871
870
  }
872
871
  },
873
872
  "textarea": {
@@ -878,11 +877,11 @@
878
877
  "padding-inline-start": "0.75rem",
879
878
  "background-color": "#fff",
880
879
  "border-color": "#154273",
881
- "color": "#154273",
880
+ "color": "#0F172A",
882
881
  "invalid": {
883
882
  "background-color": "#f9dfdd",
884
883
  "border-color": "#d52b1e",
885
- "color": "#154273",
884
+ "color": "#0F172A",
886
885
  "border-width": "1px"
887
886
  },
888
887
  "placeholder": {
@@ -891,7 +890,7 @@
891
890
  "focus": {
892
891
  "background-color": "#fff",
893
892
  "border-color": "#154273",
894
- "color": "#154273",
893
+ "color": "#0F172A",
895
894
  "border-width": "2px"
896
895
  },
897
896
  "disabled": {
@@ -902,12 +901,12 @@
902
901
  "read-only": {
903
902
  "background-color": "#F1F5F9",
904
903
  "border-color": "transparent",
905
- "color": "#154273"
904
+ "color": "#0F172A"
906
905
  },
907
906
  "hover": {
908
907
  "background-color": "#fff",
909
908
  "border-color": "#738eab",
910
- "color": "#154273",
909
+ "color": "#0F172A",
911
910
  "border-width": "1px"
912
911
  },
913
912
  "border-radius": "2.5px",
@@ -921,7 +920,7 @@
921
920
  "table": {
922
921
  "header-cell": {
923
922
  "line-height": "150%",
924
- "color": "#154273",
923
+ "color": "#0F172A",
925
924
  "font-family": "Fira Sans, Arial, Verdana, sans-serif",
926
925
  "font-weight": 700,
927
926
  "font-size": "1.25rem"
@@ -929,7 +928,7 @@
929
928
  "caption": {
930
929
  "line-height": "125%",
931
930
  "margin-block-end": "1.5rem",
932
- "color": "#154273",
931
+ "color": "#0F172A",
933
932
  "font-family": "Fira Sans, Arial, Verdana, sans-serif",
934
933
  "font-weight": 700,
935
934
  "font-size": "1.875rem"
@@ -942,7 +941,7 @@
942
941
  "line-height": "150%"
943
942
  },
944
943
  "data-cell": {
945
- "color": "#154273",
944
+ "color": "#0F172A",
946
945
  "font-family": "Fira Sans, Arial, Verdana, sans-serif",
947
946
  "font-weight": 400,
948
947
  "line-height": "150%",
@@ -966,7 +965,7 @@
966
965
  "footer-cell": {
967
966
  "font-weight": 700,
968
967
  "font-size": "1.25rem",
969
- "color": "#154273",
968
+ "color": "#0F172A",
970
969
  "font-family": "Fira Sans, Arial, Verdana, sans-serif",
971
970
  "line-height": "150%"
972
971
  },
@@ -1001,17 +1000,17 @@
1001
1000
  },
1002
1001
  "background-color": "#fff",
1003
1002
  "border-color": "#154273",
1004
- "color": "#154273",
1003
+ "color": "#0F172A",
1005
1004
  "invalid": {
1006
1005
  "background-color": "#f9dfdd",
1007
1006
  "border-color": "#d52b1e",
1008
- "color": "#154273",
1007
+ "color": "#0F172A",
1009
1008
  "border-width": "1px"
1010
1009
  },
1011
1010
  "focus": {
1012
1011
  "background-color": "#fff",
1013
1012
  "border-color": "#154273",
1014
- "color": "#154273",
1013
+ "color": "#0F172A",
1015
1014
  "border-width": "2px"
1016
1015
  },
1017
1016
  "disabled": {
@@ -1022,7 +1021,7 @@
1022
1021
  "hover": {
1023
1022
  "background-color": "#fff",
1024
1023
  "border-color": "#738eab",
1025
- "color": "#154273",
1024
+ "color": "#0F172A",
1026
1025
  "border-width": "1px"
1027
1026
  },
1028
1027
  "padding-block-end": "0.5rem",
@@ -1103,7 +1102,7 @@
1103
1102
  "border-width": "1px"
1104
1103
  },
1105
1104
  "pre-heading": {
1106
- "color": "#154273",
1105
+ "color": "#0F172A",
1107
1106
  "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1108
1107
  "font-weight": 700,
1109
1108
  "line-height": "125%",
@@ -1119,7 +1118,7 @@
1119
1118
  "margin-block-end": "0.25rem",
1120
1119
  "margin-block-start": "0.25rem"
1121
1120
  },
1122
- "color": "#154273",
1121
+ "color": "#0F172A",
1123
1122
  "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1124
1123
  "font-weight": 400,
1125
1124
  "font-size": "1.25rem",
@@ -1173,12 +1172,12 @@
1173
1172
  "line-height": "150%"
1174
1173
  },
1175
1174
  "form-label": {
1176
- "color": "#154273",
1175
+ "color": "#0F172A",
1177
1176
  "font-size": "1.25rem",
1178
1177
  "font-weight": 700
1179
1178
  },
1180
1179
  "form-field-label": {
1181
- "color": "#154273",
1180
+ "color": "#0F172A",
1182
1181
  "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1183
1182
  "font-size": "1.25rem",
1184
1183
  "font-weight": 700,
@@ -1248,7 +1247,7 @@
1248
1247
  },
1249
1248
  "form-fieldset": {
1250
1249
  "legend": {
1251
- "color": "#154273",
1250
+ "color": "#0F172A",
1252
1251
  "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1253
1252
  "font-size": "1.25rem",
1254
1253
  "font-weight": 700,
@@ -1259,7 +1258,7 @@
1259
1258
  },
1260
1259
  "section": {
1261
1260
  "background-color": "transparent",
1262
- "color": "#154273"
1261
+ "color": "#0F172A"
1263
1262
  },
1264
1263
  "invalid": {
1265
1264
  "border-inline-start": {
@@ -1551,7 +1550,7 @@
1551
1550
  "line-height": "150%",
1552
1551
  "font-weight": 400,
1553
1552
  "font-size": "1.5rem",
1554
- "color": "#154273"
1553
+ "color": "#0F172A"
1555
1554
  },
1556
1555
  "margin-block-end": 0,
1557
1556
  "margin-block-start": 0,
@@ -1620,26 +1619,26 @@
1620
1619
  "padding-inline-start": "1rem",
1621
1620
  "background-color": "#d9ebf7",
1622
1621
  "border-color": "transparent",
1623
- "color": "#154273",
1622
+ "color": "#0F172A",
1624
1623
  "info": {
1625
1624
  "background-color": "#d9ebf7",
1626
1625
  "border-color": "transparent",
1627
- "color": "#154273"
1626
+ "color": "#0F172A"
1628
1627
  },
1629
1628
  "error": {
1630
1629
  "background-color": "#f9dfdd",
1631
1630
  "border-color": "transparent",
1632
- "color": "#154273"
1631
+ "color": "#0F172A"
1633
1632
  },
1634
1633
  "ok": {
1635
1634
  "background-color": "#e1eddb",
1636
1635
  "border-color": "transparent",
1637
- "color": "#154273"
1636
+ "color": "#0F172A"
1638
1637
  },
1639
1638
  "warning": {
1640
1639
  "background-color": "#fff4db",
1641
1640
  "border-color": "transparent",
1642
- "color": "#154273"
1641
+ "color": "#0F172A"
1643
1642
  },
1644
1643
  "icon": {
1645
1644
  "inset-block-start": "3px",
@@ -1680,28 +1679,28 @@
1680
1679
  "hover": {
1681
1680
  "background-color": "#F8FAFC",
1682
1681
  "border-color": "#94A3B8",
1683
- "color": "#154273"
1682
+ "color": "#0F172A"
1684
1683
  },
1685
1684
  "background-color": "#fff",
1686
1685
  "border-color": "#94A3B8",
1687
1686
  "border-width": 0,
1688
- "color": "#154273",
1687
+ "color": "#0F172A",
1689
1688
  "focus": {
1690
1689
  "background-color": "#dce3ea",
1691
1690
  "border-color": "#154273",
1692
- "color": "#154273"
1691
+ "color": "#0F172A"
1693
1692
  },
1694
1693
  "active": {
1695
1694
  "background-color": "#F1F5F9",
1696
1695
  "border-color": "#94A3B8",
1697
- "color": "#154273",
1696
+ "color": "#0F172A",
1698
1697
  "row-gap": 0
1699
1698
  }
1700
1699
  }
1701
1700
  },
1702
1701
  "document": {
1703
1702
  "background-color": "#fff",
1704
- "color": "#000",
1703
+ "color": "#0F172A",
1705
1704
  "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1706
1705
  "font-size": "1.25rem",
1707
1706
  "line-height": "150%",
@@ -1754,7 +1753,7 @@
1754
1753
  "border-color": "#154273",
1755
1754
  "border-style": "solid",
1756
1755
  "border-width": "2px",
1757
- "color": "#154273",
1756
+ "color": "#0F172A",
1758
1757
  "text-decoration": "None"
1759
1758
  },
1760
1759
  "focus-visible": {
@@ -1775,7 +1774,7 @@
1775
1774
  "text-underline-offset": "0.125rem"
1776
1775
  },
1777
1776
  "paragraph": {
1778
- "color": "#154273",
1777
+ "color": "#0F172A",
1779
1778
  "font-family": "Fira Sans, Arial, Verdana, sans-serif",
1780
1779
  "font-size": "1.25rem",
1781
1780
  "font-weight": 400,
@@ -1783,16 +1782,10 @@
1783
1782
  "margin-block-end": 0,
1784
1783
  "margin-block-start": 0,
1785
1784
  "lead": {
1786
- "color": "#154273",
1785
+ "color": "#0F172A",
1787
1786
  "font-size": "1.5rem",
1788
1787
  "font-weight": 400,
1789
1788
  "line-height": "150%"
1790
- },
1791
- "small": {
1792
- "color": "#154273",
1793
- "font-size": "1.125rem",
1794
- "font-weight": 400,
1795
- "line-height": "150%"
1796
1789
  }
1797
1790
  },
1798
1791
  "heading-level-1": {