@utrecht/design-tokens 2.0.0 → 2.1.1

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 (83) hide show
  1. package/.stylelintrc.json +5 -1
  2. package/CHANGELOG.md +14 -0
  3. package/config.json +8 -0
  4. package/dist/_mixin-theme.scss +64 -55
  5. package/dist/_mixin.scss +1011 -0
  6. package/dist/_variables.scss +64 -55
  7. package/dist/background-image-icon.css +0 -1
  8. package/dist/dark/_mixin-theme.scss +64 -55
  9. package/dist/dark/_mixin.scss +1022 -0
  10. package/dist/dark/_variables.scss +1019 -0
  11. package/dist/dark/index.cjs +1022 -0
  12. package/dist/dark/index.css +64 -55
  13. package/dist/dark/index.d.ts +1143 -0
  14. package/dist/dark/index.flat.json +1018 -0
  15. package/dist/dark/index.json +30708 -0
  16. package/dist/dark/index.mjs +1020 -0
  17. package/dist/dark/index.tokens.json +7790 -0
  18. package/dist/dark/list.json +30708 -0
  19. package/dist/dark/property.css +703 -0
  20. package/dist/dark/root.css +546 -537
  21. package/dist/dark/theme-prince-xml.css +1022 -0
  22. package/dist/dark/theme.css +1022 -0
  23. package/dist/dark/tokens.cjs +37484 -0
  24. package/dist/dark/tokens.d.ts +4792 -0
  25. package/dist/dark/tokens.json +37480 -0
  26. package/dist/dark/variables.cjs +1022 -0
  27. package/dist/dark/variables.css +1022 -0
  28. package/dist/dark/variables.d.ts +1143 -0
  29. package/dist/dark/variables.json +1018 -0
  30. package/dist/dark/variables.less +1019 -0
  31. package/dist/dark/variables.mjs +1020 -0
  32. package/dist/index.cjs +67 -58
  33. package/dist/index.css +131 -118
  34. package/dist/index.d.ts +59 -47
  35. package/dist/index.flat.json +607 -597
  36. package/dist/index.json +7028 -7230
  37. package/dist/index.mjs +67 -58
  38. package/dist/index.tokens.json +2170 -911
  39. package/dist/list.json +31825 -0
  40. package/dist/property.css +768 -0
  41. package/dist/root.css +541 -532
  42. package/dist/theme-prince-xml.css +64 -55
  43. package/dist/theme.css +541 -532
  44. package/dist/tokens.cjs +10583 -9537
  45. package/dist/tokens.d.ts +609 -249
  46. package/dist/tokens.json +38622 -0
  47. package/dist/variables.cjs +1011 -0
  48. package/dist/variables.css +1011 -0
  49. package/dist/variables.d.ts +1132 -0
  50. package/dist/variables.json +1007 -0
  51. package/dist/variables.less +64 -55
  52. package/dist/variables.mjs +1009 -0
  53. package/package.json +6 -5
  54. package/src/background-image-icon.scss +0 -1
  55. package/src/brand/utrecht/typography.tokens.json +9 -9
  56. package/src/component/of/progress-indicator.tokens.json +1 -1
  57. package/src/component/utrecht/accordion.tokens.json +1 -0
  58. package/src/component/utrecht/backdrop.tokens.json +1 -1
  59. package/src/component/utrecht/blockquote.tokens.json +3 -3
  60. package/src/component/utrecht/button.tokens.json +1 -3
  61. package/src/component/utrecht/code-block.tokens.json +2 -2
  62. package/src/component/utrecht/figure.tokens.json +2 -2
  63. package/src/component/utrecht/form-fieldset.tokens.json +2 -2
  64. package/src/component/utrecht/form-toggle.tokens.json +1 -1
  65. package/src/component/utrecht/link.tokens.json +3 -1
  66. package/src/component/utrecht/number-badge.tokens.json +23 -0
  67. package/src/component/utrecht/pagination.tokens.json +1 -1
  68. package/src/component/utrecht/skip-link.tokens.json +4 -2
  69. package/src/component/utrecht/spotlight-section.tokens.json +8 -0
  70. package/src/component/utrecht/table.tokens.json +1 -1
  71. package/src/component/utrecht/textarea.tokens.json +1 -0
  72. package/src/component/utrecht/toptask-link.tokens.json +1 -1
  73. package/src/css-property-formatter.mjs +46 -0
  74. package/src/dark/component/tokens.json +1 -1
  75. package/src/index.scss +2 -5
  76. package/style-dictionary-build-dark.mjs +64 -0
  77. package/style-dictionary-build.mjs +41 -0
  78. package/style-dictionary-config.mjs +261 -0
  79. package/dist/figma-tokens.json +0 -36582
  80. package/src/css-property-formatter.js +0 -35
  81. package/src/style-dictionary-config-dark.js +0 -56
  82. package/src/style-dictionary-config.js +0 -63
  83. package/style-dictionary.config.json +0 -143
package/dist/index.mjs CHANGED
@@ -1,8 +1,8 @@
1
1
  /**
2
- * Do not edit directly
3
- * Generated on Wed, 21 Aug 2024 08:24:57 GMT
2
+ * Do not edit directly, this file was auto-generated.
4
3
  */
5
4
 
5
+ export const utrechtAccordionRowGap = "8px";
6
6
  export const utrechtAccordionButtonPaddingInlineEnd = "16px";
7
7
  export const utrechtAccordionButtonPaddingInlineStart = "16px";
8
8
  export const utrechtAccordionButtonPaddingBlockEnd = "8px";
@@ -59,7 +59,7 @@ export const utrechtArticleMaxInlineSize = "780px";
59
59
  export const utrechtBackdropBackgroundColor = "hsl(0 0% 100%)";
60
60
  export const utrechtBackdropColor = "hsl(0 0% 0%)";
61
61
  export const utrechtBackdropOpacity = "0.8";
62
- export const utrechtBackdropFadeInAnimationDuration = "0.4s";
62
+ export const utrechtBackdropFadeInAnimationDuration = "400ms";
63
63
  export const utrechtBackdropReducedTransparencyOpacity = "0.98";
64
64
  export const utrechtBadgeCounterBackgroundColor = "hsl(0 100% 40%)"; // Default background color for badge components
65
65
  export const utrechtBadgeCounterBorderRadius = "1rem"; // Default corner radius for badge components
@@ -77,9 +77,9 @@ export const utrechtBadgePaddingInline = "12px"; // Default inline padding color
77
77
  export const utrechtBadgeFontStyle = "normal";
78
78
  export const utrechtBlockquoteMarginInlineStart = "1.6em";
79
79
  export const utrechtBlockquoteMarginInlineEnd = "1.6em";
80
- export const utrechtBlockquoteAttributionFontSize = "0.75rem";
81
80
  export const utrechtBlockquoteContentColor = "hsl(0 100% 40%)";
82
81
  export const utrechtBlockquoteContentFontSize = "1.125rem";
82
+ export const utrechtBlockquoteCaptionFontSize = "0.75rem";
83
83
  export const utrechtBlockquoteMarginBlockStart = "1.6em";
84
84
  export const utrechtBlockquoteMarginBlockEnd = "1.6em";
85
85
  export const utrechtBreadcrumbNavMinBlockSize = "34px";
@@ -109,6 +109,7 @@ export const utrechtButtonBorderColor = "hsl(0 0% 40%)";
109
109
  export const utrechtButtonBorderRadius = "0";
110
110
  export const utrechtButtonBorderWidth = "1px";
111
111
  export const utrechtButtonColor = "hsl(0 0% 40%)";
112
+ export const utrechtButtonColumnGap = "0.5ch";
112
113
  export const utrechtButtonFontFamily = "\"Lucida Grande\", \"Lucida Sans Unicode\", \"Lucida Sans\", \"Arial\", sans-serif";
113
114
  export const utrechtButtonFontSize = "1rem";
114
115
  export const utrechtButtonMarginBlockStart = "8px";
@@ -121,7 +122,6 @@ export const utrechtButtonPaddingInlineStart = "16px";
121
122
  export const utrechtButtonPaddingInlineEnd = "16px";
122
123
  export const utrechtButtonActiveBackgroundColor = "hsl(0 0% 40%)";
123
124
  export const utrechtButtonActiveColor = "hsl(0 0% 100%)";
124
- export const utrechtButtonIconGap = "0.5ch";
125
125
  export const utrechtButtonDisabledBackgroundColor = "hsl(0 0% 90%)";
126
126
  export const utrechtButtonDisabledBorderColor = "hsl(0 0% 80%)";
127
127
  export const utrechtButtonDisabledColor = "hsl(0 0% 80%)";
@@ -231,7 +231,7 @@ export const utrechtButtonSubtleReadyFocusColor = "hsl(90 30% 38%)";
231
231
  export const utrechtCalendarTableWeeksItemWidth = "44px";
232
232
  export const utrechtCalendarTableWeeksItemPaddingBlockStart = "4px";
233
233
  export const utrechtCalendarTableWeeksItemPaddingBlockEnd = "10px";
234
- export const utrechtCalendarTableWeeksItemLineHeight = "24px";
234
+ export const utrechtCalendarTableWeeksItemLineHeight = "1.5rem";
235
235
  export const utrechtCalendarTableDaysItemDaySize = "44px";
236
236
  export const utrechtCalendarTableDaysItemDayColor = "hsl(0 0% 0%)";
237
237
  export const utrechtCalendarTableDaysItemDayBorderWidth = "2px";
@@ -275,8 +275,8 @@ export const utrechtCheckboxInvalidBorderColor = "#990000";
275
275
  export const utrechtCheckboxMarginBlockStart = 0;
276
276
  export const utrechtCodeBlockBackgroundColor = "hsl(0 0% 95%)";
277
277
  export const utrechtCodeBlockColor = "hsl(0 0% 0%)";
278
- export const utrechtCodeBlockFontSize = "16px";
279
- export const utrechtCodeBlockLineHeight = "24px";
278
+ export const utrechtCodeBlockFontSize = "1rem";
279
+ export const utrechtCodeBlockLineHeight = "1.5";
280
280
  export const utrechtCodeBlockMarginBlockStart = "20px";
281
281
  export const utrechtCodeBlockMarginBlockEnd = "20px";
282
282
  export const utrechtCodeBlockPaddingBlockStart = "20px";
@@ -287,12 +287,12 @@ export const utrechtColumnLayoutColumnRuleColor = "hsl(0 0% 80%)";
287
287
  export const utrechtColumnLayoutColumnRuleWidth = "2px";
288
288
  export const utrechtColumnLayoutColumnWidth = "350px";
289
289
  export const utrechtColumnLayoutGap = "16px";
290
+ export const utrechtActionActivateCursor = "pointer";
290
291
  export const utrechtActionBusyCursor = "wait";
291
292
  export const utrechtActionDisabledCursor = "not-allowed";
293
+ export const utrechtActionInertCursor = "default";
292
294
  export const utrechtActionNavigateCursor = "pointer";
293
295
  export const utrechtActionSubmitCursor = "pointer";
294
- export const utrechtActionActivateCursor = "pointer";
295
- export const utrechtActionInertCursor = "default";
296
296
  export const utrechtFeedbackDangerBackgroundColor = "hsl(0 100% 40%)";
297
297
  export const utrechtFeedbackDangerBorderColor = "hsl(0 100% 40%)";
298
298
  export const utrechtFeedbackDangerColor = "hsl(0 100% 40%)";
@@ -396,10 +396,10 @@ export const utrechtSpaceColumn5xl = "64px"; // Extra Large 5
396
396
  export const utrechtDataListMarginBlockEnd = "16px";
397
397
  export const utrechtDataListMarginBlockStart = "16px";
398
398
  export const utrechtDataListItemKeyFontWeight = "700";
399
+ export const utrechtDataListRowsColumnMinInlineSize = "25ch";
400
+ export const utrechtDataListRowsColumnInlineSize = "80%";
399
401
  export const utrechtDataListRowsItemMarginBlockStart = "16px";
400
402
  export const utrechtDataListRowsItemValueMarginBlockStart = "8px";
401
- export const utrechtDataListRowsColumnInlineSize = "80%";
402
- export const utrechtDataListRowsColumnMinInlineSize = "25ch";
403
403
  export const utrechtDataPlaceholderBackgroundColor = "hsl(0 0% 40%)";
404
404
  export const utrechtDocumentBackgroundColor = "hsl(0 0% 100%)";
405
405
  export const utrechtDocumentColor = "hsl(0 0% 0%)";
@@ -418,8 +418,8 @@ export const utrechtDrawerPaddingInlineStart = "16px";
418
418
  export const utrechtDrawerPaddingInlineEnd = "16px";
419
419
  export const utrechtEmphasisStrongFontWeight = "700";
420
420
  export const utrechtFigureCaptionColor = "#727272";
421
- export const utrechtFigureCaptionFontSize = "14px";
422
- export const utrechtFigureCaptionLineHeight = "20px";
421
+ export const utrechtFigureCaptionFontSize = "0.875rem";
422
+ export const utrechtFigureCaptionLineHeight = "1.5";
423
423
  export const utrechtFocusBackgroundColor = "hsl(48 100% 60%)";
424
424
  export const utrechtFocusOutlineColor = "hsl(0 0% 0%)";
425
425
  export const utrechtFocusOutlineStyle = "dotted";
@@ -439,12 +439,12 @@ export const utrechtFormControlPaddingInlineEnd = "12px";
439
439
  export const utrechtFormControlPaddingInlineStart = "12px";
440
440
  export const utrechtFormControlPlaceholderColor = "hsl(0 0% 40%)";
441
441
  export const utrechtFormControlPlaceholderFontStyle = "normal";
442
- export const utrechtFormControlBlockSize = "42px";
443
442
  export const utrechtFormControlFocusBorderColor = "hsl(0 0% 80%)";
444
443
  export const utrechtFormControlInvalidBorderColor = "#990000";
445
444
  export const utrechtFormControlReadOnlyBackgroundColor = "hsl(0 0% 90%)";
446
- export const utrechtFormControlReadOnlyColor = "hsl(0 0% 20%)";
447
445
  export const utrechtFormControlReadOnlyBorderColor = "transparent";
446
+ export const utrechtFormControlReadOnlyColor = "hsl(0 0% 20%)";
447
+ export const utrechtFormControlBlockSize = "42px";
448
448
  export const utrechtFormFieldDescriptionInvalidColor = "#990000";
449
449
  export const utrechtFormFieldDescriptionValidColor = "hsl(90 30% 50%)";
450
450
  export const utrechtFormFieldDescriptionWarningColor = "hsl(48 100% 50%)";
@@ -463,7 +463,7 @@ export const utrechtFormFieldsetSectionBackgroundColor = "hsl(0 0% 80%)";
463
463
  export const utrechtFormFieldsetSectionColor = "hsl(0 0% 0%)";
464
464
  export const utrechtFormFieldsetLegendFontSize = "1rem";
465
465
  export const utrechtFormFieldsetLegendFontWeight = "700";
466
- export const utrechtFormFieldsetLegendLineHeight = "1.4";
466
+ export const utrechtFormFieldsetLegendLineHeight = "1.5";
467
467
  export const utrechtFormFieldsetLegendMarginBlockEnd = "12px";
468
468
  export const utrechtFormFieldsetLegendMarginBlockStart = "24px";
469
469
  export const utrechtFormFieldsetLegendDisabledColor = "hsl(0 0% 40%)";
@@ -471,7 +471,7 @@ export const utrechtFormLabelFontWeight = "700";
471
471
  export const utrechtFormLabelFontSize = "1em";
472
472
  export const utrechtFormLabelCheckboxFontWeight = "400";
473
473
  export const utrechtFormLabelRadioFontWeight = "400";
474
- export const utrechtFormToggleAccentColor = "hsla(0, 0%, 48%, 1)";
474
+ export const utrechtFormToggleAccentColor = "hsla(0 0% 48% / 100%)";
475
475
  export const utrechtFormToggleBackgroundColor = "hsl(0 0% 100%)";
476
476
  export const utrechtFormToggleBorderColor = "transparent";
477
477
  export const utrechtFormToggleBorderStyle = "solid";
@@ -543,19 +543,19 @@ export const utrechtLinkListLinkFontWeight = "700";
543
543
  export const utrechtLinkListLinkTextDecoration = "none";
544
544
  export const utrechtLinkListIconSize = "14px";
545
545
  export const utrechtLinkSocialBackgroundColor = "hsl(0 100% 40%)";
546
- export const utrechtLinkSocialBorderWidth = "2px";
547
546
  export const utrechtLinkSocialBorderColor = "hsl(0 0% 100%)";
548
- export const utrechtLinkSocialSize = "40px";
549
- export const utrechtLinkSocialMarginInlineStart = "12px";
547
+ export const utrechtLinkSocialBorderWidth = "2px";
550
548
  export const utrechtLinkSocialColor = "hsl(0 0% 100%)";
551
- export const utrechtLinkSocialHoverTransformScale = "1.1";
549
+ export const utrechtLinkSocialMarginInlineStart = "12px";
550
+ export const utrechtLinkSocialSize = "40px";
552
551
  export const utrechtLinkSocialIconSize = "26px";
552
+ export const utrechtLinkSocialHoverTransformScale = "1.1";
553
553
  export const utrechtLinkColor = "hsl(211 60% 35%)";
554
554
  export const utrechtLinkTextDecoration = "underline";
555
555
  export const utrechtLinkTextUnderlineOffset = "3px";
556
556
  export const utrechtLinkActiveColor = "hsl(211 60% 35%)";
557
557
  export const utrechtLinkFocusColor = "hsl(211 60% 40%)";
558
- export const utrechtLinkFocusTextDecoration = "none";
558
+ export const utrechtLinkFocusVisibleTextDecoration = "none";
559
559
  export const utrechtLinkHoverColor = "hsl(211 60% 40%)";
560
560
  export const utrechtLinkHoverTextDecoration = "underline";
561
561
  export const utrechtLinkHoverTextDecorationThickness = "3px";
@@ -596,31 +596,31 @@ export const utrechtMapMarkerBorderWidth = "3px";
596
596
  export const utrechtMapMarkerBorderColor = "hsl(0 0% 100%)";
597
597
  export const utrechtMapMarkerBoxShadowColor = "rgb(0 0 0 / 20%)";
598
598
  export const utrechtMapMarkerIconSize = "30px";
599
- export const utrechtMapcontrolbuttonBorderWidth = "1px";
600
- export const utrechtMapcontrolbuttonMinBlockSize = "32px";
601
- export const utrechtMapcontrolbuttonMinInlineSize = "32px";
602
- export const utrechtMapcontrolbuttonMarginBlockStart = "8px";
603
- export const utrechtMapcontrolbuttonMarginBlockEnd = "8px";
604
- export const utrechtMapcontrolbuttonMarginInlineStart = "0";
605
- export const utrechtMapcontrolbuttonMarginInlineEnd = "0";
606
- export const utrechtMapcontrolbuttonPaddingBlockStart = "4px";
607
- export const utrechtMapcontrolbuttonPaddingBlockEnd = "4px";
608
- export const utrechtMapcontrolbuttonPaddingInlineStart = "4px";
609
- export const utrechtMapcontrolbuttonPaddingInlineEnd = "4px";
610
- export const utrechtMapcontrolbuttonDisabledColor = "hsl(0 0% 80%)";
611
- export const utrechtMapcontrolbuttonDisabledBackgroundColor = "hsl(0 0% 90%)";
612
- export const utrechtMapcontrolbuttonDisabledBorderColor = "hsl(0 0% 80%)";
613
599
  export const utrechtMapcontrolbuttonBackgroundColor = "hsl(0 0% 100%)";
614
600
  export const utrechtMapcontrolbuttonBorderColor = "hsl(0 0% 40%)";
615
601
  export const utrechtMapcontrolbuttonBorderRadius = "2px";
616
602
  export const utrechtMapcontrolbuttonBorderStyle = "solid";
603
+ export const utrechtMapcontrolbuttonBorderWidth = "1px";
617
604
  export const utrechtMapcontrolbuttonColor = "hsl(0 0% 40%)";
618
- export const utrechtMapcontrolbuttonLabelMarginInlineStart = "8px";
619
- export const utrechtMapcontrolbuttonLabelMarginInlineEnd = "8px";
605
+ export const utrechtMapcontrolbuttonMinBlockSize = "32px";
606
+ export const utrechtMapcontrolbuttonMinInlineSize = "32px";
607
+ export const utrechtMapcontrolbuttonDisabledBackgroundColor = "hsl(0 0% 90%)";
608
+ export const utrechtMapcontrolbuttonDisabledBorderColor = "hsl(0 0% 80%)";
609
+ export const utrechtMapcontrolbuttonDisabledColor = "hsl(0 0% 80%)";
620
610
  export const utrechtMapcontrolbuttonFocusColor = "hsl(0 0% 0%)";
621
611
  export const utrechtMapcontrolbuttonFocusTextDecoration = "none";
622
612
  export const utrechtMapcontrolbuttonHoverBackgroundColor = "hsl(0 0% 90%)";
623
613
  export const utrechtMapcontrolbuttonHoverColor = "hsl(0 0% 100%)";
614
+ export const utrechtMapcontrolbuttonLabelMarginInlineStart = "8px";
615
+ export const utrechtMapcontrolbuttonLabelMarginInlineEnd = "8px";
616
+ export const utrechtMapcontrolbuttonMarginBlockEnd = "8px";
617
+ export const utrechtMapcontrolbuttonMarginBlockStart = "8px";
618
+ export const utrechtMapcontrolbuttonMarginInlineEnd = "0";
619
+ export const utrechtMapcontrolbuttonMarginInlineStart = "0";
620
+ export const utrechtMapcontrolbuttonPaddingBlockEnd = "4px";
621
+ export const utrechtMapcontrolbuttonPaddingBlockStart = "4px";
622
+ export const utrechtMapcontrolbuttonPaddingInlineEnd = "4px";
623
+ export const utrechtMapcontrolbuttonPaddingInlineStart = "4px";
624
624
  export const utrechtMarkBackgroundColor = "hsl(48 100% 60%)";
625
625
  export const utrechtMarkColor = "hsl(0 0% 0%)";
626
626
  export const utrechtNavBarBackgroundColor = "hsl(0 0% 100%)";
@@ -650,6 +650,12 @@ export const utrechtTopnavLinkFocusTextDecoration = "none";
650
650
  export const utrechtTopnavLinkFocusBackgroundColor = "hsl(48 100% 80%)";
651
651
  export const utrechtTopnavLinkFocusOutlineColor = "hsl(0 0% 0%)";
652
652
  export const utrechtTopnavLinkHoverBackgroundColor = "hsl(0 0% 0%)";
653
+ export const utrechtNumberBadgeBackgroundColor = "hsl(0 100% 40%)";
654
+ export const utrechtNumberBadgeBorderRadius = "1rem";
655
+ export const utrechtNumberBadgeColor = "hsl(0 0% 100%)"; // Default text color for badge components
656
+ export const utrechtNumberBadgeFontSize = "1rem";
657
+ export const utrechtNumberBadgePaddingBlock = "1ex"; // Default block padding for badge components
658
+ export const utrechtNumberBadgePaddingInline = "1ex"; // Default inline padding color for badge components
653
659
  export const utrechtNumberDataPositiveColor = "green";
654
660
  export const utrechtNumberDataNegativeColor = "red";
655
661
  export const utrechtOrderedListMarginBlockStart = "0";
@@ -667,10 +673,10 @@ export const utrechtPageFooterPaddingInlineEnd = "28px";
667
673
  export const utrechtPageFooterPaddingInlineStart = "28px";
668
674
  export const utrechtPageFooterPaddingBlockEnd = "48px";
669
675
  export const utrechtPageFooterPaddingBlockStart = "48px";
676
+ export const utrechtPageHeaderPaddingBlockStart = "1.8em";
670
677
  export const utrechtPageHeaderPaddingBlockEnd = "1em";
671
- export const utrechtPageHeaderPaddingInlineEnd = "2.4em";
672
678
  export const utrechtPageHeaderPaddingInlineStart = "2em";
673
- export const utrechtPageHeaderPaddingBlockStart = "1.8em";
679
+ export const utrechtPageHeaderPaddingInlineEnd = "2.4em";
674
680
  export const utrechtPageBackgroundColor = "hsl(0 0% 100%)";
675
681
  export const utrechtPageColor = "hsl(0 0% 0%)";
676
682
  export const utrechtPageMarginInlineStart = "2em";
@@ -680,10 +686,11 @@ export const utrechtPagePaddingBlockStart = "1.8em";
680
686
  export const utrechtPagePaddingInlineEnd = "2em";
681
687
  export const utrechtPagePaddingBlockEnd = "1em";
682
688
  export const utrechtPagePaddingInlineStart = "2em";
683
- export const utrechtPaginationFontSize = "14px";
689
+ export const utrechtPaginationFontSize = "0.875rem";
684
690
  export const utrechtPaginationMarginBlockStart = "0";
685
691
  export const utrechtPaginationMarginBlockEnd = "1em";
686
692
  export const utrechtPaginationPageLinkBackgroundColor = "transparent";
693
+ export const utrechtPaginationPageLinkBorderColor = "transparent";
687
694
  export const utrechtPaginationPageLinkBorderWidth = "2px";
688
695
  export const utrechtPaginationPageLinkColor = "hsl(211 60% 35%)";
689
696
  export const utrechtPaginationPageLinkFontWeight = "700";
@@ -699,8 +706,8 @@ export const utrechtPaginationPageLinkDistancedMarginInlineStart = "0.5em";
699
706
  export const utrechtPaginationPageLinkHoverBackgroundColor = "hsl(211 60% 35%)";
700
707
  export const utrechtPaginationPageLinkHoverBorderColor = "hsl(211 60% 35%)";
701
708
  export const utrechtPaginationPageLinkHoverColor = "hsl(0 0% 100%)";
702
- export const utrechtPaginationPageLinkBorderColor = "transparent";
703
709
  export const utrechtPaginationRelativeLinkBackgroundColor = "hsl(0 0% 100%)";
710
+ export const utrechtPaginationRelativeLinkBorderColor = "hsl(211 60% 35%)";
704
711
  export const utrechtPaginationRelativeLinkBorderWidth = "2px";
705
712
  export const utrechtPaginationRelativeLinkColor = "hsl(211 60% 35%)";
706
713
  export const utrechtPaginationRelativeLinkFontWeight = "700";
@@ -715,7 +722,6 @@ export const utrechtPaginationRelativeLinkDistancedMarginInlineStart = "0.5em";
715
722
  export const utrechtPaginationRelativeLinkHoverBackgroundColor = "hsl(211 60% 35%)";
716
723
  export const utrechtPaginationRelativeLinkHoverBorderColor = "hsl(211 60% 35%)";
717
724
  export const utrechtPaginationRelativeLinkHoverColor = "hsl(0 0% 100%)";
718
- export const utrechtPaginationRelativeLinkBorderColor = "hsl(211 60% 35%)";
719
725
  export const utrechtParagraphFontFamily = "\"Lucida Grande\", \"Lucida Sans Unicode\", \"Lucida Sans\", \"Arial\", sans-serif";
720
726
  export const utrechtParagraphFontSize = "1rem";
721
727
  export const utrechtParagraphFontWeight = "400";
@@ -733,10 +739,11 @@ export const utrechtRadioButtonBackgroundColor = "hsl(0 0% 100%)";
733
739
  export const utrechtRadioButtonBorderColor = "hsl(0 0% 30%)";
734
740
  export const utrechtRadioButtonBorderWidth = "2px";
735
741
  export const utrechtRadioButtonSize = "24px";
742
+ export const utrechtRadioButtonMarginInlineEnd = "12px";
736
743
  export const utrechtRadioButtonIconSize = "42%";
737
744
  export const utrechtRadioButtonActiveBackgroundColor = "hsl(211 60% 80%)";
738
- export const utrechtRadioButtonCheckedBorderColor = "hsl(211 60% 40%)";
739
745
  export const utrechtRadioButtonCheckedBackgroundColor = "hsl(211 60% 40%)";
746
+ export const utrechtRadioButtonCheckedBorderColor = "hsl(211 60% 40%)";
740
747
  export const utrechtRadioButtonCheckedActiveBackgroundColor = "hsl(211 60% 40%)";
741
748
  export const utrechtRadioButtonCheckedActiveColor = "hsl(211 60% 80%)";
742
749
  export const utrechtRadioButtonCheckedHoverBackgroundColor = "hsl(211 60% 40%)";
@@ -744,14 +751,13 @@ export const utrechtRadioButtonCheckedHoverColor = "hsl(211 60% 90%)";
744
751
  export const utrechtRadioButtonCheckedFocusBorderColor = "hsl(211 60% 20%)";
745
752
  export const utrechtRadioButtonHoverBackgroundColor = "hsl(211 60% 90%)";
746
753
  export const utrechtRadioButtonFocusBorderColor = "hsl(211 60% 40%)";
747
- export const utrechtRadioButtonDisabledBorderColor = "hsl(0 0% 80%)";
748
754
  export const utrechtRadioButtonDisabledBackgroundColor = "hsl(0 0% 80%)";
755
+ export const utrechtRadioButtonDisabledBorderColor = "hsl(0 0% 80%)";
749
756
  export const utrechtRadioButtonDisabledColor = "hsl(0 0% 100%)";
750
757
  export const utrechtRadioButtonInvalidBorderColor = "#990000";
751
758
  export const utrechtRadioButtonInvalidBorderWidth = "2px";
752
759
  export const utrechtRadioButtonColor = "hsl(0 0% 100%)";
753
760
  export const utrechtRadioButtonBorderRadius = "0";
754
- export const utrechtRadioButtonMarginInlineEnd = "12px";
755
761
  export const utrechtRichTextStrangerMarginBlockEnd = "32px";
756
762
  export const utrechtRichTextAcquaintanceMarginBlockEnd = "16px";
757
763
  export const utrechtRichTextFriendMarginBlockEnd = "8px";
@@ -760,8 +766,8 @@ export const utrechtRichTextConfidantMarginBlockEnd = 0;
760
766
  export const utrechtSearchBarButtonBackgroundColor = "hsl(0 100% 40%)";
761
767
  export const utrechtSearchBarButtonBorderColor = "hsl(0 100% 40%)";
762
768
  export const utrechtSearchBarButtonColor = "hsl(0 0% 100%)";
763
- export const utrechtSearchBarButtonFontWeight = "700";
764
769
  export const utrechtSearchBarButtonFontSize = "0.875rem";
770
+ export const utrechtSearchBarButtonFontWeight = "700";
765
771
  export const utrechtSearchBarButtonHoverBackgroundColor = "hsl(359 65% 58%)";
766
772
  export const utrechtSearchBarButtonHoverScale = "1";
767
773
  export const utrechtSearchBarInputBorderColor = "hsl(0 100% 40%)";
@@ -796,9 +802,9 @@ export const utrechtSkipLinkPaddingBlockEnd = "8px";
796
802
  export const utrechtSkipLinkPaddingInlineStart = "16px";
797
803
  export const utrechtSkipLinkPaddingInlineEnd = "16px";
798
804
  export const utrechtSkipLinkTextDecoration = "underline";
799
- export const utrechtSkipLinkFocusColor = "hsl(0 0% 0%)";
800
805
  export const utrechtSkipLinkFocusBackgroundColor = "hsl(48 100% 80%)";
801
- export const utrechtSkipLinkFocusTextDecoration = "none";
806
+ export const utrechtSkipLinkFocusColor = "hsl(0 0% 0%)";
807
+ export const utrechtSkipLinkFocusVisibleTextDecoration = "none";
802
808
  export const utrechtSpotlightSectionBackgroundColor = "hsl(0 0% 90%)";
803
809
  export const utrechtSpotlightSectionColor = "hsl(0 0% 0%)";
804
810
  export const utrechtSpotlightSectionPaddingBlockStart = "16px";
@@ -807,12 +813,14 @@ export const utrechtSpotlightSectionPaddingInlineStart = "16px";
807
813
  export const utrechtSpotlightSectionPaddingInlineEnd = "16px";
808
814
  export const utrechtSpotlightSectionInfoBackgroundColor = "hsl(211 60% 90%)";
809
815
  export const utrechtSpotlightSectionWarningBackgroundColor = "hsl(48 100% 80%)";
816
+ export const utrechtSpotlightSectionErrorBackgroundColor = "hsl(0 100% 95%)";
817
+ export const utrechtSpotlightSectionOkBackgroundColor = "hsl(90 30% 90%)";
810
818
  export const utrechtSurfaceBackgroundColor = "hsl(0 0% 95%)";
811
819
  export const utrechtSurfaceColor = "hsl(0 0% 10%)";
812
820
  export const utrechtTableMarginBlockEnd = "0";
813
821
  export const utrechtTableMarginBlockStart = "16px";
814
822
  export const utrechtTableCaptionFontWeight = "700";
815
- export const utrechtTableCaptionFontSize = "1.125em";
823
+ export const utrechtTableCaptionFontSize = "1.125rem";
816
824
  export const utrechtTableCaptionTextAlign = "start";
817
825
  export const utrechtTableCaptionMarginBlockEnd = "1em";
818
826
  export const utrechtTableHeaderFontWeight = "700";
@@ -822,24 +830,25 @@ export const utrechtTableHeaderStickyBackgroundColor = "hsl(0 0% 100%)";
822
830
  export const utrechtTableHeaderStickyColor = "hsl(0 0% 0%)";
823
831
  export const utrechtTableHeaderStickyBorderBlockEndColor = "hsl(0 100% 40%)";
824
832
  export const utrechtTableHeaderStickyBorderBlockEndWidth = "2px";
825
- export const utrechtTableCellLineHeight = "24px";
833
+ export const utrechtTableFooterStickyBackgroundColor = "hsl(0 0% 100%)";
834
+ export const utrechtTableFooterStickyColor = "hsl(0 0% 0%)";
835
+ export const utrechtTableFooterStickyBorderBlockStartColor = "hsl(0 100% 40%)";
836
+ export const utrechtTableFooterStickyBorderBlockStartWidth = "2px";
837
+ export const utrechtTableCellLineHeight = "1.5rem";
826
838
  export const utrechtTableCellPaddingBlockEnd = "0.5em";
827
839
  export const utrechtTableCellPaddingBlockStart = "0.5em";
828
840
  export const utrechtTableCellPaddingInlineEnd = "0.4em";
829
841
  export const utrechtTableCellPaddingInlineStart = "0.4em";
830
- export const utrechtTableCellIconSize = "1em";
831
842
  export const utrechtTableCellSelectedBackgroundColor = "hsl(211 60% 90%)";
832
843
  export const utrechtTableCellSelectedColor = "hsl(0 0% 0%)";
844
+ export const utrechtTableCellIconSize = "1em";
833
845
  export const utrechtTableRowBorderBlockEndColor = "hsl(0 0% 90%)";
834
846
  export const utrechtTableRowBorderBlockEndWidth = "1px";
835
847
  export const utrechtTableRowAlternateOddBackgroundColor = "hsl(0 0% 100%)";
836
848
  export const utrechtTableRowAlternateOddColor = "hsl(0 0% 0%)";
837
849
  export const utrechtTableRowAlternateEvenBackgroundColor = "hsl(0 0% 95%)";
838
850
  export const utrechtTableRowAlternateEvenColor = "hsl(0 0% 0%)";
839
- export const utrechtTableFooterStickyBackgroundColor = "hsl(0 0% 100%)";
840
- export const utrechtTableFooterStickyColor = "hsl(0 0% 0%)";
841
- export const utrechtTableFooterStickyBorderBlockStartColor = "hsl(0 100% 40%)";
842
- export const utrechtTableFooterStickyBorderBlockStartWidth = "2px";
851
+ export const utrechtTextareaBorderBlockEndWidth = "3px";
843
852
  export const utrechtTextareaBorderBottomWidth = "3px";
844
853
  export const utrechtTextareaLineHeight = "1.5";
845
854
  export const utrechtTextboxBorderBottomWidth = "3px";
@@ -997,4 +1006,4 @@ export const ofLayoutBg = "hsl(0 0% 100%)";
997
1006
  export const ofPageFooterBg = "hsl(0 100% 40%)";
998
1007
  export const ofPageFooterFg = "hsl(0 0% 100%)";
999
1008
  export const ofProgressIndicatorBackgroundColor = "hsl(0 0% 100%)";
1000
- export const ofProgressIndicatorMobileBoxShadow = "0px 0px 2px 0px rgba(0, 0, 0, 0.2)";
1009
+ export const ofProgressIndicatorMobileBoxShadow = "0px 0px 2px 0px rgba(0 0 0 / 20%)";