@utrecht/design-tokens 6.2.0 → 6.2.1

package/dist/dark/variables.mjs

@@ -470,6 +470,7 @@ export const utrechtSpaceColumn2xl = "28px"; // Extra Large 2
 export const utrechtSpaceColumn3xl = "32px"; // Extra Large 3
 export const utrechtSpaceColumn4xl = "48px"; // Extra Large 4
 export const utrechtSpaceColumn5xl = "64px"; // Extra Large 5
+export const utrechtTextboxBorderBottomWidth = "3px";
 export const utrechtDataListMarginBlockEnd = "16px";
 export const utrechtDataListMarginBlockStart = "16px";
 export const utrechtDataListItemKeyFontWeight = "700";
@@ -848,6 +849,10 @@ export const utrechtOrderedListPaddingInlineStart = "28.8px";
 export const utrechtOrderedListItemMarginBlockStart = "0.25em";
 export const utrechtOrderedListItemMarginBlockEnd = "0.25em";
 export const utrechtOrderedListItemPaddingInlineStart = "0";
+export const utrechtPageBodyPaddingBlockStart = "0";
+export const utrechtPageBodyPaddingBlockEnd = "0";
+export const utrechtPageBodyPaddingInlineStart = "0";
+export const utrechtPageBodyPaddingInlineEnd = "0";
 export const utrechtPageBodyContentBackgroundColor = "hsl(0 0% 100%)";
 export const utrechtPageBodyContentColor = "hsl(0 0% 0%)";
 export const utrechtPageBodyContentPaddingBlockStart = "0";
@@ -855,20 +860,16 @@ export const utrechtPageBodyContentPaddingBlockEnd = "1em";
 export const utrechtPageBodyContentPaddingInlineStart = "2em";
 export const utrechtPageBodyContentPaddingInlineEnd = "2.4em";
 export const utrechtPageBodyContentMaxInlineSize = "1184px";
-export const utrechtPageBodyPaddingInlineEnd = "0";
-export const utrechtPageBodyPaddingInlineStart = "0";
-export const utrechtPageBodyPaddingBlockEnd = "0";
-export const utrechtPageBodyPaddingBlockStart = "0";
 export const utrechtPageContentPaddingBlockStart = "2em";
 export const utrechtPageContentPaddingBlockEnd = "2em";
 export const utrechtPageFooterColor = "hsl(0 0% 100%)";
 export const utrechtPageFooterBackgroundColor = "hsl(0 100% 40%)";
 export const utrechtPageFooterBackgroundImage =
   "linear-gradient(45deg, hsl(0 100% 40%), hsl(0 100% 40%) 50%, #d63433 50%);";
+export const utrechtPageFooterContentPaddingInline = "28px";
 export const utrechtPageFooterContentPaddingBlockEnd = "48px";
 export const utrechtPageFooterContentPaddingBlockStart = "48px";
 export const utrechtPageFooterContentMaxInlineSize = "1184px";
-export const utrechtPageFooterContentPaddingInline = "28px";
 export const utrechtPageHeaderPaddingBlockStart = "0";
 export const utrechtPageHeaderPaddingBlockEnd = "0";
 export const utrechtPageHeaderPaddingInlineStart = "0";
@@ -877,10 +878,10 @@ export const utrechtPageHeaderContentBackgroundColor = "hsl(0 0% 100%)";
 export const utrechtPageHeaderContentColor = "hsl(0 0% 0%)";
 export const utrechtPageHeaderContentPaddingBlockStart = "1.8em";
 export const utrechtPageHeaderContentPaddingBlockEnd = "1em";
-export const utrechtPageHeaderContentPaddingInlineStart = "2em";
-export const utrechtPageHeaderContentPaddingInlineEnd = "2.4em";
-export const utrechtPageHeaderContentMaxInlineSize = "1184px";
 export const utrechtPageHeaderContentPaddingInline = "2em";
+export const utrechtPageHeaderContentMaxInlineSize = "1184px";
+export const utrechtPageHeaderContentPaddingInlineEnd = "2.4em";
+export const utrechtPageHeaderContentPaddingInlineStart = "2em";
 export const utrechtPageBackgroundColor = "hsl(0 0% 15%)";
 export const utrechtPageColor = "hsl(0 0% 95%)";
 export const utrechtPageMarginInlineStart = "2em";
@@ -1100,7 +1101,6 @@ export const utrechtTableRowAlternateEvenColor = "hsl(0 0% 0%)";
 export const utrechtTextareaBorderBlockEndWidth = "3px";
 export const utrechtTextareaBorderBottomWidth = "3px";
 export const utrechtTextareaLineHeight = "1.5";
-export const utrechtTextboxBorderBottomWidth = "3px";
 export const utrechtTooltipBackgroundColor = "hsl(0 0% 100%)";
 export const utrechtTooltipBorderColor = "hsl(0 0% 40%)";
 export const utrechtTooltipBorderRadius = "0";

package/dist/index.cjs

@@ -418,6 +418,7 @@ module.exports = {
   utrechtSpaceColumn3xl: "32px",
   utrechtSpaceColumn4xl: "48px",
   utrechtSpaceColumn5xl: "64px",
+  utrechtTextboxBorderBottomWidth: "3px",
   utrechtDataListMarginBlockEnd: "16px",
   utrechtDataListMarginBlockStart: "16px",
   utrechtDataListItemKeyFontWeight: "700",
@@ -782,6 +783,10 @@ module.exports = {
   utrechtOrderedListItemMarginBlockStart: "0.25em",
   utrechtOrderedListItemMarginBlockEnd: "0.25em",
   utrechtOrderedListItemPaddingInlineStart: "0",
+  utrechtPageBodyPaddingBlockStart: "0",
+  utrechtPageBodyPaddingBlockEnd: "0",
+  utrechtPageBodyPaddingInlineStart: "0",
+  utrechtPageBodyPaddingInlineEnd: "0",
   utrechtPageBodyContentBackgroundColor: "hsl(0 0% 100%)",
   utrechtPageBodyContentColor: "hsl(0 0% 0%)",
   utrechtPageBodyContentPaddingBlockStart: "0",
@@ -789,20 +794,16 @@ module.exports = {
   utrechtPageBodyContentPaddingInlineStart: "2em",
   utrechtPageBodyContentPaddingInlineEnd: "2.4em",
   utrechtPageBodyContentMaxInlineSize: "1184px",
-  utrechtPageBodyPaddingInlineEnd: "0",
-  utrechtPageBodyPaddingInlineStart: "0",
-  utrechtPageBodyPaddingBlockEnd: "0",
-  utrechtPageBodyPaddingBlockStart: "0",
   utrechtPageContentPaddingBlockStart: "2em",
   utrechtPageContentPaddingBlockEnd: "2em",
   utrechtPageFooterColor: "hsl(0 0% 100%)",
   utrechtPageFooterBackgroundColor: "hsl(0 100% 40%)",
   utrechtPageFooterBackgroundImage:
     "linear-gradient(45deg, hsl(0 100% 40%), hsl(0 100% 40%) 50%, #d63433 50%);",
+  utrechtPageFooterContentPaddingInline: "28px",
   utrechtPageFooterContentPaddingBlockEnd: "48px",
   utrechtPageFooterContentPaddingBlockStart: "48px",
   utrechtPageFooterContentMaxInlineSize: "1184px",
-  utrechtPageFooterContentPaddingInline: "28px",
   utrechtPageHeaderPaddingBlockStart: "0",
   utrechtPageHeaderPaddingBlockEnd: "0",
   utrechtPageHeaderPaddingInlineStart: "0",
@@ -811,10 +812,10 @@ module.exports = {
   utrechtPageHeaderContentColor: "hsl(0 0% 0%)",
   utrechtPageHeaderContentPaddingBlockStart: "1.8em",
   utrechtPageHeaderContentPaddingBlockEnd: "1em",
-  utrechtPageHeaderContentPaddingInlineStart: "2em",
-  utrechtPageHeaderContentPaddingInlineEnd: "2.4em",
-  utrechtPageHeaderContentMaxInlineSize: "1184px",
   utrechtPageHeaderContentPaddingInline: "2em",
+  utrechtPageHeaderContentMaxInlineSize: "1184px",
+  utrechtPageHeaderContentPaddingInlineEnd: "2.4em",
+  utrechtPageHeaderContentPaddingInlineStart: "2em",
   utrechtPageBackgroundColor: "hsl(0 0% 100%)",
   utrechtPageColor: "hsl(0 0% 0%)",
   utrechtPageMarginInlineStart: "2em",
@@ -1025,7 +1026,6 @@ module.exports = {
   utrechtTextareaBorderBlockEndWidth: "3px",
   utrechtTextareaBorderBottomWidth: "3px",
   utrechtTextareaLineHeight: "1.5",
-  utrechtTextboxBorderBottomWidth: "3px",
   utrechtTooltipBackgroundColor: "hsl(0 0% 100%)",
   utrechtTooltipBorderColor: "hsl(0 0% 40%)",
   utrechtTooltipBorderRadius: "0",

package/dist/index.css

@@ -168,6 +168,7 @@
   --utrecht-space-column-3xl: 32px; /** Extra Large 3 */
   --utrecht-space-column-4xl: 48px; /** Extra Large 4 */
   --utrecht-space-column-5xl: 64px; /** Extra Large 5 */
+  --utrecht-textbox-border-bottom-width: 3px;
   --utrecht-data-list-rows-column-min-inline-size: 25ch;
   --utrecht-data-list-rows-column-inline-size: 80%;
   --utrecht-document-line-height: 1.4;
@@ -288,15 +289,15 @@
   --utrecht-ordered-list-item-margin-block-start: 0.25em;
   --utrecht-ordered-list-item-margin-block-end: 0.25em;
   --utrecht-ordered-list-item-padding-inline-start: 0;
+  --utrecht-page-body-padding-block-start: 0;
+  --utrecht-page-body-padding-block-end: 0;
+  --utrecht-page-body-padding-inline-start: 0;
+  --utrecht-page-body-padding-inline-end: 0;
   --utrecht-page-body-content-padding-block-start: 0;
   --utrecht-page-body-content-padding-block-end: 1em;
   --utrecht-page-body-content-padding-inline-start: 2em;
   --utrecht-page-body-content-padding-inline-end: 2.4em;
   --utrecht-page-body-content-max-inline-size: 1184px;
-  --utrecht-page-body-padding-inline-end: 0;
-  --utrecht-page-body-padding-inline-start: 0;
-  --utrecht-page-body-padding-block-end: 0;
-  --utrecht-page-body-padding-block-start: 0;
   --utrecht-page-content-padding-block-start: 2em;
   --utrecht-page-content-padding-block-end: 2em;
   --utrecht-page-footer-content-max-inline-size: 1184px;
@@ -306,10 +307,10 @@
   --utrecht-page-header-padding-inline-end: 0;
   --utrecht-page-header-content-padding-block-start: 1.8em;
   --utrecht-page-header-content-padding-block-end: 1em;
-  --utrecht-page-header-content-padding-inline-start: 2em;
-  --utrecht-page-header-content-padding-inline-end: 2.4em;
-  --utrecht-page-header-content-max-inline-size: 1184px;
   --utrecht-page-header-content-padding-inline: 2em;
+  --utrecht-page-header-content-max-inline-size: 1184px;
+  --utrecht-page-header-content-padding-inline-end: 2.4em;
+  --utrecht-page-header-content-padding-inline-start: 2em;
   --utrecht-page-margin-inline-start: 2em;
   --utrecht-page-margin-inline-end: 2em;
   --utrecht-page-max-inline-size: 1184px;
@@ -370,7 +371,6 @@
   --utrecht-table-cell-icon-size: 1em;
   --utrecht-textarea-border-block-end-width: 3px;
   --utrecht-textarea-border-bottom-width: 3px;
-  --utrecht-textbox-border-bottom-width: 3px;
   --utrecht-tooltip-border-radius: 0;
   --utrecht-tooltip-border-width: 1px;
   --utrecht-toptask-link-line-height: 1.2;
@@ -918,9 +918,9 @@
   --utrecht-page-footer-color: var(--utrecht-color-white);
   --utrecht-page-footer-background-color: var(--utrecht-color-red-40);
   --utrecht-page-footer-background-image: linear-gradient(45deg, var(--utrecht-color-red-40), var(--utrecht-color-red-40) 50%, #d63433 50%);
+  --utrecht-page-footer-content-padding-inline: var(--utrecht-space-inline-2xl);
   --utrecht-page-footer-content-padding-block-end: var(--utrecht-space-block-3xl);
   --utrecht-page-footer-content-padding-block-start: var(--utrecht-space-block-3xl);
-  --utrecht-page-footer-content-padding-inline: var(--utrecht-space-inline-2xl);
   --utrecht-page-header-content-background-color: var(--utrecht-color-white);
   --utrecht-page-header-content-color: var(--utrecht-color-black);
   --utrecht-page-background-color: var(--utrecht-color-white);
@@ -1460,6 +1460,7 @@
     --utrecht-space-column-3xl: 32px; /** Extra Large 3 */
     --utrecht-space-column-4xl: 48px; /** Extra Large 4 */
     --utrecht-space-column-5xl: 64px; /** Extra Large 5 */
+    --utrecht-textbox-border-bottom-width: 3px;
     --utrecht-data-list-rows-column-min-inline-size: 25ch;
     --utrecht-data-list-rows-column-inline-size: 80%;
     --utrecht-document-line-height: 1.4;
@@ -1581,15 +1582,15 @@
     --utrecht-ordered-list-item-margin-block-start: 0.25em;
     --utrecht-ordered-list-item-margin-block-end: 0.25em;
     --utrecht-ordered-list-item-padding-inline-start: 0;
+    --utrecht-page-body-padding-block-start: 0;
+    --utrecht-page-body-padding-block-end: 0;
+    --utrecht-page-body-padding-inline-start: 0;
+    --utrecht-page-body-padding-inline-end: 0;
     --utrecht-page-body-content-padding-block-start: 0;
     --utrecht-page-body-content-padding-block-end: 1em;
     --utrecht-page-body-content-padding-inline-start: 2em;
     --utrecht-page-body-content-padding-inline-end: 2.4em;
     --utrecht-page-body-content-max-inline-size: 1184px;
-    --utrecht-page-body-padding-inline-end: 0;
-    --utrecht-page-body-padding-inline-start: 0;
-    --utrecht-page-body-padding-block-end: 0;
-    --utrecht-page-body-padding-block-start: 0;
     --utrecht-page-content-padding-block-start: 2em;
     --utrecht-page-content-padding-block-end: 2em;
     --utrecht-page-footer-content-max-inline-size: 1184px;
@@ -1599,10 +1600,10 @@
     --utrecht-page-header-padding-inline-end: 0;
     --utrecht-page-header-content-padding-block-start: 1.8em;
     --utrecht-page-header-content-padding-block-end: 1em;
-    --utrecht-page-header-content-padding-inline-start: 2em;
-    --utrecht-page-header-content-padding-inline-end: 2.4em;
-    --utrecht-page-header-content-max-inline-size: 1184px;
     --utrecht-page-header-content-padding-inline: 2em;
+    --utrecht-page-header-content-max-inline-size: 1184px;
+    --utrecht-page-header-content-padding-inline-end: 2.4em;
+    --utrecht-page-header-content-padding-inline-start: 2em;
     --utrecht-page-margin-inline-start: 2em;
     --utrecht-page-margin-inline-end: 2em;
     --utrecht-page-max-inline-size: 1184px;
@@ -1663,7 +1664,6 @@
     --utrecht-table-cell-icon-size: 1em;
     --utrecht-textarea-border-block-end-width: 3px;
     --utrecht-textarea-border-bottom-width: 3px;
-    --utrecht-textbox-border-bottom-width: 3px;
     --utrecht-tooltip-border-radius: 0;
     --utrecht-tooltip-border-width: 1px;
     --utrecht-toptask-link-line-height: 1.2;
@@ -2208,9 +2208,9 @@
     --utrecht-page-footer-color: var(--utrecht-color-white);
     --utrecht-page-footer-background-color: var(--utrecht-color-red-40);
     --utrecht-page-footer-background-image: linear-gradient(45deg, var(--utrecht-color-red-40), var(--utrecht-color-red-40) 50%, #d63433 50%);
+    --utrecht-page-footer-content-padding-inline: var(--utrecht-space-inline-2xl);
     --utrecht-page-footer-content-padding-block-end: var(--utrecht-space-block-3xl);
     --utrecht-page-footer-content-padding-block-start: var(--utrecht-space-block-3xl);
-    --utrecht-page-footer-content-padding-inline: var(--utrecht-space-inline-2xl);
     --utrecht-page-header-content-background-color: var(--utrecht-color-white);
     --utrecht-page-header-content-color: var(--utrecht-color-black);
     --utrecht-page-background-color: var(--utrecht-color-grey-15);

package/dist/index.d.ts

@@ -481,6 +481,7 @@ export const utrechtSpaceColumn3xl: string;
 export const utrechtSpaceColumn4xl: string;
 /** Extra Large 5 */
 export const utrechtSpaceColumn5xl: string;
+export const utrechtTextboxBorderBottomWidth: string;
 export const utrechtDataListMarginBlockEnd: string;
 export const utrechtDataListMarginBlockStart: string;
 export const utrechtDataListItemKeyFontWeight: string;
@@ -851,6 +852,10 @@ export const utrechtOrderedListPaddingInlineStart: string;
 export const utrechtOrderedListItemMarginBlockStart: string;
 export const utrechtOrderedListItemMarginBlockEnd: string;
 export const utrechtOrderedListItemPaddingInlineStart: number;
+export const utrechtPageBodyPaddingBlockStart: number;
+export const utrechtPageBodyPaddingBlockEnd: number;
+export const utrechtPageBodyPaddingInlineStart: number;
+export const utrechtPageBodyPaddingInlineEnd: number;
 export const utrechtPageBodyContentBackgroundColor: string;
 export const utrechtPageBodyContentColor: string;
 export const utrechtPageBodyContentPaddingBlockStart: number;
@@ -858,19 +863,15 @@ export const utrechtPageBodyContentPaddingBlockEnd: string;
 export const utrechtPageBodyContentPaddingInlineStart: string;
 export const utrechtPageBodyContentPaddingInlineEnd: string;
 export const utrechtPageBodyContentMaxInlineSize: string;
-export const utrechtPageBodyPaddingInlineEnd: string;
-export const utrechtPageBodyPaddingInlineStart: string;
-export const utrechtPageBodyPaddingBlockEnd: string;
-export const utrechtPageBodyPaddingBlockStart: string;
 export const utrechtPageContentPaddingBlockStart: string;
 export const utrechtPageContentPaddingBlockEnd: string;
 export const utrechtPageFooterColor: string;
 export const utrechtPageFooterBackgroundColor: string;
 export const utrechtPageFooterBackgroundImage: string;
+export const utrechtPageFooterContentPaddingInline: string;
 export const utrechtPageFooterContentPaddingBlockEnd: string;
 export const utrechtPageFooterContentPaddingBlockStart: string;
 export const utrechtPageFooterContentMaxInlineSize: string;
-export const utrechtPageFooterContentPaddingInline: string;
 export const utrechtPageHeaderPaddingBlockStart: number;
 export const utrechtPageHeaderPaddingBlockEnd: number;
 export const utrechtPageHeaderPaddingInlineStart: number;
@@ -879,10 +880,10 @@ export const utrechtPageHeaderContentBackgroundColor: string;
 export const utrechtPageHeaderContentColor: string;
 export const utrechtPageHeaderContentPaddingBlockStart: string;
 export const utrechtPageHeaderContentPaddingBlockEnd: string;
-export const utrechtPageHeaderContentPaddingInlineStart: string;
-export const utrechtPageHeaderContentPaddingInlineEnd: string;
-export const utrechtPageHeaderContentMaxInlineSize: string;
 export const utrechtPageHeaderContentPaddingInline: string;
+export const utrechtPageHeaderContentMaxInlineSize: string;
+export const utrechtPageHeaderContentPaddingInlineEnd: string;
+export const utrechtPageHeaderContentPaddingInlineStart: string;
 export const utrechtPageBackgroundColor: string;
 export const utrechtPageColor: string;
 export const utrechtPageMarginInlineStart: string;
@@ -1093,7 +1094,6 @@ export const utrechtTableRowAlternateEvenColor: string;
 export const utrechtTextareaBorderBlockEndWidth: string;
 export const utrechtTextareaBorderBottomWidth: string;
 export const utrechtTextareaLineHeight: string;
-export const utrechtTextboxBorderBottomWidth: string;
 export const utrechtTooltipBackgroundColor: string;
 export const utrechtTooltipBorderColor: string;
 export const utrechtTooltipBorderRadius: number;

package/dist/index.json

@@ -23686,10 +23686,20 @@
   },
   {
     "key": "{utrecht.page-body.padding-block-end}",
+    "$extensions": {
+      "nl.nldesignsystem.css-property-syntax": "<length>",
+      "nl.nldesignsystem.figma-implementation": false
+    },
+    "$type": "dimension",
     "$value": "0",
     "filePath": "src/component/utrecht/page-body.tokens.json",
     "isSource": true,
     "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css-property-syntax": "<length>",
+        "nl.nldesignsystem.figma-implementation": false
+      },
+      "$type": "dimension",
       "$value": "0",
       "key": "{utrecht.page-body.padding-block-end}"
     },
@@ -23703,10 +23713,20 @@
   },
   {
     "key": "{utrecht.page-body.padding-block-start}",
+    "$extensions": {
+      "nl.nldesignsystem.css-property-syntax": "<length>",
+      "nl.nldesignsystem.figma-implementation": false
+    },
+    "$type": "dimension",
     "$value": "0",
     "filePath": "src/component/utrecht/page-body.tokens.json",
     "isSource": true,
     "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css-property-syntax": "<length>",
+        "nl.nldesignsystem.figma-implementation": false
+      },
+      "$type": "dimension",
       "$value": "0",
       "key": "{utrecht.page-body.padding-block-start}"
     },
@@ -23720,10 +23740,20 @@
   },
   {
     "key": "{utrecht.page-body.padding-inline-end}",
+    "$extensions": {
+      "nl.nldesignsystem.css-property-syntax": "<length>",
+      "nl.nldesignsystem.figma-implementation": false
+    },
+    "$type": "dimension",
     "$value": "0",
     "filePath": "src/component/utrecht/page-body.tokens.json",
     "isSource": true,
     "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css-property-syntax": "<length>",
+        "nl.nldesignsystem.figma-implementation": false
+      },
+      "$type": "dimension",
       "$value": "0",
       "key": "{utrecht.page-body.padding-inline-end}"
     },
@@ -23737,10 +23767,20 @@
   },
   {
     "key": "{utrecht.page-body.padding-inline-start}",
+    "$extensions": {
+      "nl.nldesignsystem.css-property-syntax": "<length>",
+      "nl.nldesignsystem.figma-implementation": false
+    },
+    "$type": "dimension",
     "$value": "0",
     "filePath": "src/component/utrecht/page-body.tokens.json",
     "isSource": true,
     "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css-property-syntax": "<length>",
+        "nl.nldesignsystem.figma-implementation": false
+      },
+      "$type": "dimension",
       "$value": "0",
       "key": "{utrecht.page-body.padding-inline-start}"
     },
@@ -23990,10 +24030,20 @@
   },
   {
     "key": "{utrecht.page-footer.content.padding-inline}",
+    "$extensions": {
+      "nl.nldesignsystem.css-property-syntax": "<length>",
+      "nl.nldesignsystem.figma-implementation": false
+    },
+    "$type": "dimension",
     "$value": "28px",
     "filePath": "src/component/utrecht/page-footer.tokens.json",
     "isSource": true,
     "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css-property-syntax": "<length>",
+        "nl.nldesignsystem.figma-implementation": false
+      },
+      "$type": "dimension",
       "$value": "{utrecht.space.inline.2xl}",
       "key": "{utrecht.page-footer.content.padding-inline}"
     },
@@ -24138,10 +24188,20 @@
   },
   {
     "key": "{utrecht.page-header.content.padding-inline}",
+    "$extensions": {
+      "nl.nldesignsystem.css-property-syntax": "<length>",
+      "nl.nldesignsystem.figma-implementation": false
+    },
+    "$type": "dimension",
     "$value": "2em",
     "filePath": "src/component/utrecht/page-header.tokens.json",
     "isSource": true,
     "original": {
+      "$extensions": {
+        "nl.nldesignsystem.css-property-syntax": "<length>",
+        "nl.nldesignsystem.figma-implementation": false
+      },
+      "$type": "dimension",
       "$value": "2em",
       "key": "{utrecht.page-header.content.padding-inline}"
     },
@@ -24156,21 +24216,11 @@
   },
   {
     "key": "{utrecht.page-header.content.padding-inline-end}",
-    "$extensions": {
-      "nl.nldesignsystem.css-property-syntax": "<length>",
-      "nl.nldesignsystem.figma-implementation": false
-    },
-    "$type": "dimension",
     "$value": "2.4em",
     "$comment": "Legacy design token",
     "filePath": "src/component/utrecht/page-header.tokens.json",
     "isSource": true,
     "original": {
-      "$extensions": {
-        "nl.nldesignsystem.css-property-syntax": "<length>",
-        "nl.nldesignsystem.figma-implementation": false
-      },
-      "$type": "dimension",
       "$value": "2.4em",
       "$comment": "Legacy design token",
       "key": "{utrecht.page-header.content.padding-inline-end}"
@@ -24186,21 +24236,11 @@
   },
   {
     "key": "{utrecht.page-header.content.padding-inline-start}",
-    "$extensions": {
-      "nl.nldesignsystem.css-property-syntax": "<length>",
-      "nl.nldesignsystem.figma-implementation": false
-    },
-    "$type": "dimension",
     "$value": "2em",
     "$comment": "Legacy design token",
     "filePath": "src/component/utrecht/page-header.tokens.json",
     "isSource": true,
     "original": {
-      "$extensions": {
-        "nl.nldesignsystem.css-property-syntax": "<length>",
-        "nl.nldesignsystem.figma-implementation": false
-      },
-      "$type": "dimension",
       "$value": "2em",
       "$comment": "Legacy design token",
       "key": "{utrecht.page-header.content.padding-inline-start}"

package/dist/index.mjs

@@ -457,6 +457,7 @@ export const utrechtSpaceColumn2xl = "28px"; // Extra Large 2
 export const utrechtSpaceColumn3xl = "32px"; // Extra Large 3
 export const utrechtSpaceColumn4xl = "48px"; // Extra Large 4
 export const utrechtSpaceColumn5xl = "64px"; // Extra Large 5
+export const utrechtTextboxBorderBottomWidth = "3px";
 export const utrechtDataListMarginBlockEnd = "16px";
 export const utrechtDataListMarginBlockStart = "16px";
 export const utrechtDataListItemKeyFontWeight = "700";
@@ -835,6 +836,10 @@ export const utrechtOrderedListPaddingInlineStart = "28.8px";
 export const utrechtOrderedListItemMarginBlockStart = "0.25em";
 export const utrechtOrderedListItemMarginBlockEnd = "0.25em";
 export const utrechtOrderedListItemPaddingInlineStart = "0";
+export const utrechtPageBodyPaddingBlockStart = "0";
+export const utrechtPageBodyPaddingBlockEnd = "0";
+export const utrechtPageBodyPaddingInlineStart = "0";
+export const utrechtPageBodyPaddingInlineEnd = "0";
 export const utrechtPageBodyContentBackgroundColor = "hsl(0 0% 100%)";
 export const utrechtPageBodyContentColor = "hsl(0 0% 0%)";
 export const utrechtPageBodyContentPaddingBlockStart = "0";
@@ -842,20 +847,16 @@ export const utrechtPageBodyContentPaddingBlockEnd = "1em";
 export const utrechtPageBodyContentPaddingInlineStart = "2em";
 export const utrechtPageBodyContentPaddingInlineEnd = "2.4em";
 export const utrechtPageBodyContentMaxInlineSize = "1184px";
-export const utrechtPageBodyPaddingInlineEnd = "0";
-export const utrechtPageBodyPaddingInlineStart = "0";
-export const utrechtPageBodyPaddingBlockEnd = "0";
-export const utrechtPageBodyPaddingBlockStart = "0";
 export const utrechtPageContentPaddingBlockStart = "2em";
 export const utrechtPageContentPaddingBlockEnd = "2em";
 export const utrechtPageFooterColor = "hsl(0 0% 100%)";
 export const utrechtPageFooterBackgroundColor = "hsl(0 100% 40%)";
 export const utrechtPageFooterBackgroundImage =
   "linear-gradient(45deg, hsl(0 100% 40%), hsl(0 100% 40%) 50%, #d63433 50%);";
+export const utrechtPageFooterContentPaddingInline = "28px";
 export const utrechtPageFooterContentPaddingBlockEnd = "48px";
 export const utrechtPageFooterContentPaddingBlockStart = "48px";
 export const utrechtPageFooterContentMaxInlineSize = "1184px";
-export const utrechtPageFooterContentPaddingInline = "28px";
 export const utrechtPageHeaderPaddingBlockStart = "0";
 export const utrechtPageHeaderPaddingBlockEnd = "0";
 export const utrechtPageHeaderPaddingInlineStart = "0";
@@ -864,10 +865,10 @@ export const utrechtPageHeaderContentBackgroundColor = "hsl(0 0% 100%)";
 export const utrechtPageHeaderContentColor = "hsl(0 0% 0%)";
 export const utrechtPageHeaderContentPaddingBlockStart = "1.8em";
 export const utrechtPageHeaderContentPaddingBlockEnd = "1em";
-export const utrechtPageHeaderContentPaddingInlineStart = "2em";
-export const utrechtPageHeaderContentPaddingInlineEnd = "2.4em";
-export const utrechtPageHeaderContentMaxInlineSize = "1184px";
 export const utrechtPageHeaderContentPaddingInline = "2em";
+export const utrechtPageHeaderContentMaxInlineSize = "1184px";
+export const utrechtPageHeaderContentPaddingInlineEnd = "2.4em";
+export const utrechtPageHeaderContentPaddingInlineStart = "2em";
 export const utrechtPageBackgroundColor = "hsl(0 0% 100%)";
 export const utrechtPageColor = "hsl(0 0% 0%)";
 export const utrechtPageMarginInlineStart = "2em";
@@ -1085,7 +1086,6 @@ export const utrechtTableRowAlternateEvenColor = "hsl(0 0% 0%)";
 export const utrechtTextareaBorderBlockEndWidth = "3px";
 export const utrechtTextareaBorderBottomWidth = "3px";
 export const utrechtTextareaLineHeight = "1.5";
-export const utrechtTextboxBorderBottomWidth = "3px";
 export const utrechtTooltipBackgroundColor = "hsl(0 0% 100%)";
 export const utrechtTooltipBorderColor = "hsl(0 0% 40%)";
 export const utrechtTooltipBorderRadius = "0";

package/dist/index.tokens.json

@@ -735,6 +735,9 @@
         "5xl": "64px"
       }
     },
+    "textbox": {
+      "border-bottom-width": "3px"
+    },
     "data-list": {
       "margin-block-end": "16px",
       "margin-block-start": "16px",
@@ -1398,6 +1401,10 @@
       }
     },
     "page-body": {
+      "padding-block-start": "0",
+      "padding-block-end": "0",
+      "padding-inline-start": "0",
+      "padding-inline-end": "0",
       "content": {
         "background-color": "hsl(0 0% 100%)",
         "color": "hsl(0 0% 0%)",
@@ -1406,11 +1413,7 @@
         "padding-inline-start": "2em",
         "padding-inline-end": "2.4em",
         "max-inline-size": "1184px"
-      },
-      "padding-inline-end": "0",
-      "padding-inline-start": "0",
-      "padding-block-end": "0",
-      "padding-block-start": "0"
+      }
     },
     "page-content": {
       "padding-block-start": "2em",
@@ -1421,10 +1424,10 @@
       "background-color": "hsl(0 100% 40%)",
       "background-image": "linear-gradient(45deg, hsl(0 100% 40%), hsl(0 100% 40%) 50%, #d63433 50%);",
       "content": {
+        "padding-inline": "28px",
         "padding-block-end": "48px",
         "padding-block-start": "48px",
-        "max-inline-size": "1184px",
-        "padding-inline": "28px"
+        "max-inline-size": "1184px"
       }
     },
     "page-header": {
@@ -1437,10 +1440,10 @@
         "color": "hsl(0 0% 0%)",
         "padding-block-start": "1.8em",
         "padding-block-end": "1em",
-        "padding-inline-start": "2em",
-        "padding-inline-end": "2.4em",
+        "padding-inline": "2em",
         "max-inline-size": "1184px",
-        "padding-inline": "2em"
+        "padding-inline-end": "2.4em",
+        "padding-inline-start": "2em"
       }
     },
     "page": {
@@ -1801,9 +1804,6 @@
       "border-bottom-width": "3px",
       "line-height": "1.5"
     },
-    "textbox": {
-      "border-bottom-width": "3px"
-    },
     "tooltip": {
       "background-color": "hsl(0 0% 100%)",
       "border-color": "hsl(0 0% 40%)",