@rijkshuisstijl-community/design-tokens 5.0.0 → 6.0.0

package/dist/koop/index.json

@@ -247,19 +247,6 @@
   "utrechtFormLabelRadioFontWeight": 400,
   "utrechtFormLabelCheckedFontWeight": 400,
   "utrechtFormLabelDisabledColor": "#94A3B8",
-  "utrechtNumberBadgeLineHeight": "125%",
-  "utrechtNumberBadgeBackgroundColor": "#154273",
-  "utrechtNumberBadgeBorderColor": "transparent",
-  "utrechtNumberBadgeBorderRadius": "999px",
-  "utrechtNumberBadgeBorderWidth": "0px",
-  "utrechtNumberBadgeColor": "#fff",
-  "utrechtNumberBadgeFontFamily": "RijksSans, Arial, Verdana, sans-serif",
-  "utrechtNumberBadgeFontSize": "1.25rem",
-  "utrechtNumberBadgeFontWeight": 700,
-  "utrechtNumberBadgeMinBlockSize": "24px",
-  "utrechtNumberBadgeMinInlineSize": "24px",
-  "utrechtNumberBadgePaddingBlock": "0.125rem",
-  "utrechtNumberBadgePaddingInline": "0.5rem",
   "utrechtFigureCaptionBorderColor": "#CBD5E1",
   "utrechtFigureCaptionBorderWidth": "4px",
   "utrechtFigureCaptionPaddingBlockEnd": "0.5rem",
@@ -272,6 +259,18 @@
   "utrechtFigureImgBorderEndStartRadius": 0,
   "utrechtFigureImgBorderStartEndRadius": 0,
   "utrechtFigureImgBorderStartStartRadius": 0,
+  "utrechtNumberBadgeBackgroundColor": "#154273",
+  "utrechtNumberBadgeBorderColor": "transparent",
+  "utrechtNumberBadgeBorderRadius": "999px",
+  "utrechtNumberBadgeBorderWidth": "0px",
+  "utrechtNumberBadgeColor": "#fff",
+  "utrechtNumberBadgeFontFamily": "RijksSans, Arial, Verdana, sans-serif",
+  "utrechtNumberBadgeFontSize": "1.25rem",
+  "utrechtNumberBadgeFontWeight": 700,
+  "utrechtNumberBadgeMinBlockSize": "24px",
+  "utrechtNumberBadgeMinInlineSize": "24px",
+  "utrechtNumberBadgePaddingBlock": "0.125rem",
+  "utrechtNumberBadgePaddingInline": "0.5rem",
   "utrechtBlockquoteBorderBlockEndWidth": 0,
   "utrechtBlockquoteBorderBlockStartWidth": 0,
   "utrechtBlockquoteBorderEndEndRadius": 0,
@@ -327,13 +326,6 @@
   "utrechtBlockquoteRowGap": "0.75rem",
   "utrechtBlockquoteAttributionColor": "#154273",
   "utrechtBlockquoteAttributionFontSize": "1.25rem",
-  "utrechtAlertHeadingFontFamily": "RijksSans, Arial, Verdana, sans-serif",
-  "utrechtAlertHeadingFontSize": "1.25rem",
-  "utrechtAlertHeadingFontWeight": 700,
-  "utrechtAlertHeadingLineHeight": "150%",
-  "utrechtAlertMessageColumnGap": "0.5rem",
-  "utrechtAlertMessageLineHeight": "150%",
-  "utrechtAlertMessageRowGap": "0rem",
   "utrechtAlertBackgroundColor": "#d9ebf7",
   "utrechtAlertBorderColor": "transparent",
   "utrechtAlertBorderRadius": "5px",
@@ -353,6 +345,7 @@
   "utrechtAlertInfoBackgroundColor": "#d9ebf7",
   "utrechtAlertInfoBorderColor": "transparent",
   "utrechtAlertInfoColor": "#000",
+  "utrechtAlertMessageRowGap": "0rem",
   "utrechtAlertOkBackgroundColor": "#e1eddb",
   "utrechtAlertOkBorderColor": "transparent",
   "utrechtAlertOkColor": "#000",
@@ -366,13 +359,15 @@
   "utrechtAlertIconInfoColor": "#007bc7",
   "utrechtAlertIconOkColor": "#39870c",
   "utrechtAlertIconWarningColor": "#ffb612",
-  "utrechtAccordionButtonActiveRowGap": 0,
-  "utrechtAccordionButtonActiveBackgroundColor": "#F1F5F9",
-  "utrechtAccordionButtonActiveBorderColor": "transparent",
-  "utrechtAccordionButtonActiveColor": "#0F172A",
-  "utrechtAccordionButtonFocusBackgroundColor": "#dce3ea",
-  "utrechtAccordionButtonFocusBorderColor": "#154273",
-  "utrechtAccordionButtonFocusColor": "#0F172A",
+  "utrechtAccordionMarginBlockEnd": "0rem",
+  "utrechtAccordionMarginBlockStart": "0rem",
+  "utrechtAccordionRowGap": "0rem",
+  "utrechtAccordionPanelBorderColor": "transparent",
+  "utrechtAccordionPanelBorderWidth": "1px",
+  "utrechtAccordionPanelPaddingBlockEnd": "1.5rem",
+  "utrechtAccordionPanelPaddingBlockStart": "1rem",
+  "utrechtAccordionPanelPaddingInlineEnd": "1rem",
+  "utrechtAccordionPanelPaddingInlineStart": "1rem",
   "utrechtAccordionButtonBackgroundColor": "#fff",
   "utrechtAccordionButtonBorderColor": "transparent",
   "utrechtAccordionButtonBorderRadius": "0px",
@@ -384,6 +379,9 @@
   "utrechtAccordionButtonPaddingInlineEnd": "1rem",
   "utrechtAccordionButtonPaddingInlineStart": "1rem",
   "utrechtAccordionButtonIconSize": "24px",
+  "utrechtAccordionButtonActiveBackgroundColor": "#F1F5F9",
+  "utrechtAccordionButtonActiveBorderColor": "transparent",
+  "utrechtAccordionButtonActiveColor": "#0F172A",
   "utrechtAccordionButtonHoverBackgroundColor": "#F8FAFC",
   "utrechtAccordionButtonHoverBorderColor": "transparent",
   "utrechtAccordionButtonHoverColor": "#0F172A",
@@ -391,49 +389,11 @@
   "utrechtAccordionButtonFocusVisibleBorderColor": "transparent",
   "utrechtAccordionButtonFocusVisibleBorderWidth": "1px",
   "utrechtAccordionButtonFocusVisibleColor": "#0F172A",
-  "utrechtAccordionMarginBlockEnd": "0rem",
-  "utrechtAccordionMarginBlockStart": "0rem",
-  "utrechtAccordionRowGap": "0rem",
-  "utrechtAccordionPanelBorderColor": "transparent",
-  "utrechtAccordionPanelBorderWidth": "1px",
-  "utrechtAccordionPanelPaddingBlockEnd": "1.5rem",
-  "utrechtAccordionPanelPaddingBlockStart": "1rem",
-  "utrechtAccordionPanelPaddingInlineEnd": "1rem",
-  "utrechtAccordionPanelPaddingInlineStart": "1rem",
   "utrechtAccordionSectionBorderColor": "#94A3B8",
   "utrechtAccordionSectionHoverBorderColor": "#94A3B8",
   "utrechtAccordionSectionBorderWidth": "1px",
   "utrechtAccordionSectionMarginBlockEnd": "0rem",
   "utrechtAccordionSectionMarginBlockStart": "0rem",
-  "utrechtSkipLinkFocusTextDecoration": "None",
-  "utrechtSkipLinkFocusBorderColor": "#154273",
-  "utrechtSkipLinkFocusBorderWidth": "2px",
-  "utrechtSkipLinkFocusBorderStyle": "solid",
-  "utrechtSkipLinkFocusBackgroundColor": "#fff",
-  "utrechtSkipLinkFocusColor": "#01689b",
-  "utrechtSkipLinkBorderColor": "transparent",
-  "utrechtSkipLinkBoxBlockEndShadowColor": "#0000001a",
-  "utrechtSkipLinkBoxBlockEndShadowBlurRadius": "48px",
-  "utrechtSkipLinkBoxBlockEndShadowOffsetX": 0,
-  "utrechtSkipLinkBoxBlockEndShadowOffsetY": "16px",
-  "utrechtSkipLinkBoxBlockEndShadowSpreadRadius": 0,
-  "utrechtSkipLinkFocusVisibleOutlineColor": "#000",
-  "utrechtSkipLinkFocusVisibleTextDecoration": "underline",
-  "utrechtSkipLinkFontFamily": "RijksSans, Arial, Verdana, sans-serif",
-  "utrechtSkipLinkFontWeight": 700,
-  "utrechtSkipLinkLineHeight": "150%",
-  "utrechtSkipLinkBorderWidth": "2px",
-  "utrechtSkipLinkTextUnderlineOffset": "0.125rem",
-  "utrechtSkipLinkFontSize": "1.25rem",
-  "utrechtSkipLinkBackgroundColor": "#fff",
-  "utrechtSkipLinkColor": "#01689b",
-  "utrechtSkipLinkMinBlockSize": "48px",
-  "utrechtSkipLinkMinInlineSize": "48px",
-  "utrechtSkipLinkPaddingBlockEnd": "0.75rem",
-  "utrechtSkipLinkPaddingBlockStart": "0.75rem",
-  "utrechtSkipLinkPaddingInlineEnd": "1rem",
-  "utrechtSkipLinkPaddingInlineStart": "1rem",
-  "utrechtSkipLinkTextDecoration": "underline",
   "utrechtDataBadgeBackgroundColor": "#dce3ea",
   "utrechtDataBadgeBorderRadius": "10px",
   "utrechtDataBadgeColor": "#154273",
@@ -758,11 +718,9 @@
   "todoFigureRowGap": "0.5rem",
   "todoAccordionButtonFontFamily": "RijksSans, Arial, Verdana, sans-serif",
   "todoAccordionButtonFontSize": "1.25rem",
-  "todoAccordionButtonFontWeight": 400,
-  "todoAccordionButtonLineHeight": "150%",
+  "todoAccordionButtonFontWeight": 700,
+  "todoAccordionButtonLineHeight": "1.875rem",
   "todoLinkListLinkHoverTextDecoration": "underline",
-  "todoSkipLinkFontWeight": 700,
-  "nlNumberBadgeLineHeight": "125%",
   "nlNumberBadgeBackgroundColor": "#154273",
   "nlNumberBadgeBorderColor": "transparent",
   "nlNumberBadgeBorderRadius": "999px",
@@ -775,37 +733,6 @@
   "nlNumberBadgeMinInlineSize": "24px",
   "nlNumberBadgePaddingBlock": "0.125rem",
   "nlNumberBadgePaddingInline": "0.5rem",
-  "nlSkipLinkBorderColor": "transparent",
-  "nlSkipLinkBorderWidth": "2px",
-  "nlSkipLinkFontFamily": "RijksSans, Arial, Verdana, sans-serif",
-  "nlSkipLinkFontWeight": 700,
-  "nlSkipLinkPaddingBlockEnd": "0.75rem",
-  "nlSkipLinkPaddingBlockStart": "0.75rem",
-  "nlSkipLinkPaddingInlineEnd": "1rem",
-  "nlSkipLinkPaddingInlineStart": "1rem",
-  "nlSkipLinkBoxBlockEndShadowBlurRadius": "48px",
-  "nlSkipLinkBoxBlockEndShadowColor": "#0000001a",
-  "nlSkipLinkBoxBlockEndShadowOffsetX": 0,
-  "nlSkipLinkBoxBlockEndShadowOffsetY": "16px",
-  "nlSkipLinkBoxBlockEndShadowSpreadRadius": 0,
-  "nlSkipLinkFocusBackgroundColor": "#fff",
-  "nlSkipLinkFocusBorderColor": "#154273",
-  "nlSkipLinkFocusBorderStyle": "solid",
-  "nlSkipLinkFocusBorderWidth": "2px",
-  "nlSkipLinkFocusColor": "#0F172A",
-  "nlSkipLinkFocusTextDecoration": "None",
-  "nlSkipLinkFocusVisibleOutlineColor": "#000",
-  "nlSkipLinkTextDecoration": "underline",
-  "nlSkipLinkBackgroundColor": "#fff",
-  "nlSkipLinkColor": "#01689b",
-  "nlSkipLinkPaddingBlock": "0.75rem",
-  "nlSkipLinkPaddingInline": "1rem",
-  "nlSkipLinkMinBlockSize": "48px",
-  "nlSkipLinkMinInlineSize": "48px",
-  "nlSkipLinkTextDecorationThickness": "0.0625em",
-  "nlSkipLinkTextUnderlineOffset": "0.125rem",
-  "nlSkipLinkLineHeight": "150%",
-  "nlSkipLinkFontSize": "1.25rem",
   "nlLinkActiveColor": "#800080",
   "nlLinkFocusTextDecorationThickness": "1px",
   "nlLinkHoverTextDecorationLine": "underline",
@@ -820,6 +747,16 @@
   "nlLinkCurrentCursor": "default",
   "nlLinkDisabledColor": "#334155",
   "nlLinkDisabledCursor": "disabled",
+  "nlSkipLinkBackgroundColor": "#fff",
+  "nlSkipLinkColor": "#01689b",
+  "nlSkipLinkPaddingBlock": "0.75rem",
+  "nlSkipLinkPaddingInline": "1rem",
+  "nlSkipLinkMinBlockSize": "48px",
+  "nlSkipLinkMinInlineSize": "48px",
+  "nlSkipLinkTextDecorationThickness": "0.0625em",
+  "nlSkipLinkTextUnderlineOffset": "0.125rem",
+  "nlSkipLinkLineHeight": "150%",
+  "nlSkipLinkFontSize": "1.25rem",
   "nlParagraphColor": "#0F172A",
   "nlParagraphFontFamily": "RijksSans, Arial, Verdana, sans-serif",
   "nlParagraphFontSize": "1.25rem",
@@ -891,23 +828,6 @@
   "rhcKeepBottomLeftBorderRadiusTopRight": 0,
   "rhcKeepBottomLeftBorderRadiusBottomRight": 0,
   "rhcKeepBottomLeftBorderRadiusBottomLeft": "48px",
-  "rhcAccordionBorderRadius": "0px",
-  "rhcAccordionColor": "#0F172A",
-  "rhcAccordionHeaderMargin": 0,
-  "rhcAccordionSectionBorderBlockEndWidth": "1px",
-  "rhcAccordionSectionBorderColor": "#94A3B8",
-  "rhcAccordionSectionBorderWidth": "1px",
-  "rhcAccordionButtonPaddingBlockEnd": "0.75rem",
-  "rhcAccordionButtonPaddingBlockStart": "0.75rem",
-  "rhcAccordionButtonPaddingInlineEnd": "1rem",
-  "rhcAccordionButtonPaddingInlineStart": "1rem",
-  "rhcAccordionButtonExpandedBackgroundColor": "#fff",
-  "rhcAccordionButtonExpandedColor": "#0F172A",
-  "rhcAccordionButtonIconMarginBlock": "0.25rem",
-  "rhcAccordionButtonFontFamily": "RijksSans, Arial, Verdana, sans-serif",
-  "rhcAccordionButtonFontWeight": 400,
-  "rhcAccordionButtonFontSize": "1.25rem",
-  "rhcAccordionButtonLineHeight": "150%",
   "rhcDataBadgeButtonColumnGap": "0.125rem",
   "rhcDataBadgeButtonHoverBackgroundColor": "#154273",
   "rhcDataBadgeButtonHoverColor": "#fff",

package/dist/koop/index.tokens.json

@@ -370,21 +370,6 @@
         "color": "#94A3B8"
       }
     },
-    "number-badge": {
-      "line-height": "125%",
-      "background-color": "#154273",
-      "border-color": "transparent",
-      "border-radius": "999px",
-      "border-width": "0px",
-      "color": "#fff",
-      "font-family": "RijksSans, Arial, Verdana, sans-serif",
-      "font-size": "1.25rem",
-      "font-weight": 700,
-      "min-block-size": "24px",
-      "min-inline-size": "24px",
-      "padding-block": "0.125rem",
-      "padding-inline": "0.5rem"
-    },
     "figure": {
       "caption": {
         "border-color": "#CBD5E1",
@@ -403,6 +388,20 @@
         "border-start-start-radius": 0
       }
     },
+    "number-badge": {
+      "background-color": "#154273",
+      "border-color": "transparent",
+      "border-radius": "999px",
+      "border-width": "0px",
+      "color": "#fff",
+      "font-family": "RijksSans, Arial, Verdana, sans-serif",
+      "font-size": "1.25rem",
+      "font-weight": 700,
+      "min-block-size": "24px",
+      "min-inline-size": "24px",
+      "padding-block": "0.125rem",
+      "padding-inline": "0.5rem"
+    },
     "blockquote": {
       "border-block-end-width": 0,
       "border-block-start-width": 0,
@@ -475,17 +474,6 @@
       }
     },
     "alert": {
-      "heading": {
-        "font-family": "RijksSans, Arial, Verdana, sans-serif",
-        "font-size": "1.25rem",
-        "font-weight": 700,
-        "line-height": "150%"
-      },
-      "message": {
-        "column-gap": "0.5rem",
-        "line-height": "150%",
-        "row-gap": "0rem"
-      },
       "background-color": "#d9ebf7",
       "border-color": "transparent",
       "border-radius": "5px",
@@ -511,6 +499,9 @@
         "border-color": "transparent",
         "color": "#000"
       },
+      "message": {
+        "row-gap": "0rem"
+      },
       "ok": {
         "background-color": "#e1eddb",
         "border-color": "transparent",
@@ -540,18 +531,18 @@
       }
     },
     "accordion": {
+      "margin-block-end": "0rem",
+      "margin-block-start": "0rem",
+      "row-gap": "0rem",
+      "panel": {
+        "border-color": "transparent",
+        "border-width": "1px",
+        "padding-block-end": "1.5rem",
+        "padding-block-start": "1rem",
+        "padding-inline-end": "1rem",
+        "padding-inline-start": "1rem"
+      },
       "button": {
-        "active": {
-          "row-gap": 0,
-          "background-color": "#F1F5F9",
-          "border-color": "transparent",
-          "color": "#0F172A"
-        },
-        "focus": {
-          "background-color": "#dce3ea",
-          "border-color": "#154273",
-          "color": "#0F172A"
-        },
         "background-color": "#fff",
         "border-color": "transparent",
         "border-radius": "0px",
@@ -565,6 +556,11 @@
         "icon": {
           "size": "24px"
         },
+        "active": {
+          "background-color": "#F1F5F9",
+          "border-color": "transparent",
+          "color": "#0F172A"
+        },
         "hover": {
           "background-color": "#F8FAFC",
           "border-color": "transparent",
@@ -577,17 +573,6 @@
           "color": "#0F172A"
         }
       },
-      "margin-block-end": "0rem",
-      "margin-block-start": "0rem",
-      "row-gap": "0rem",
-      "panel": {
-        "border-color": "transparent",
-        "border-width": "1px",
-        "padding-block-end": "1.5rem",
-        "padding-block-start": "1rem",
-        "padding-inline-end": "1rem",
-        "padding-inline-start": "1rem"
-      },
       "section": {
         "border-color": "#94A3B8",
         "hover": {
@@ -598,43 +583,6 @@
         "margin-block-start": "0rem"
       }
     },
-    "skip-link": {
-      "focus": {
-        "text-decoration": "None",
-        "border-color": "#154273",
-        "border-width": "2px",
-        "border-style": "solid",
-        "background-color": "#fff",
-        "color": "#01689b"
-      },
-      "border-color": "transparent",
-      "box-block-end-shadow": {
-        "color": "#0000001a",
-        "blur-radius": "48px",
-        "offset-x": 0,
-        "offset-y": "16px",
-        "spread-radius": 0
-      },
-      "focus-visible": {
-        "outline-color": "#000",
-        "text-decoration": "underline"
-      },
-      "font-family": "RijksSans, Arial, Verdana, sans-serif",
-      "font-weight": 700,
-      "line-height": "150%",
-      "border-width": "2px",
-      "text-underline-offset": "0.125rem",
-      "font-size": "1.25rem",
-      "background-color": "#fff",
-      "color": "#01689b",
-      "min-block-size": "48px",
-      "min-inline-size": "48px",
-      "padding-block-end": "0.75rem",
-      "padding-block-start": "0.75rem",
-      "padding-inline-end": "1rem",
-      "padding-inline-start": "1rem",
-      "text-decoration": "underline"
-    },
     "data-badge": {
       "background-color": "#dce3ea",
       "border-radius": "10px",
@@ -1197,8 +1145,8 @@
       "button": {
         "font-family": "RijksSans, Arial, Verdana, sans-serif",
         "font-size": "1.25rem",
-        "font-weight": 400,
-        "line-height": "150%"
+        "font-weight": 700,
+        "line-height": "1.875rem"
       }
     },
     "link-list": {
@@ -1207,14 +1155,10 @@
           "text-decoration": "underline"
         }
       }
-    },
-    "skip-link": {
-      "font-weight": 700
     }
   },
   "nl": {
     "number-badge": {
-      "line-height": "125%",
       "background-color": "#154273",
       "border-color": "transparent",
       "border-radius": "999px",
@@ -1228,45 +1172,6 @@
       "padding-block": "0.125rem",
       "padding-inline": "0.5rem"
     },
-    "skip-link": {
-      "border-color": "transparent",
-      "border-width": "2px",
-      "font-family": "RijksSans, Arial, Verdana, sans-serif",
-      "font-weight": 700,
-      "padding-block-end": "0.75rem",
-      "padding-block-start": "0.75rem",
-      "padding-inline-end": "1rem",
-      "padding-inline-start": "1rem",
-      "box-block-end-shadow": {
-        "blur-radius": "48px",
-        "color": "#0000001a",
-        "offset-x": 0,
-        "offset-y": "16px",
-        "spread-radius": 0
-      },
-      "focus": {
-        "background-color": "#fff",
-        "border-color": "#154273",
-        "border-style": "solid",
-        "border-width": "2px",
-        "color": "#0F172A",
-        "text-decoration": "None"
-      },
-      "focus-visible": {
-        "outline-color": "#000"
-      },
-      "text-decoration": "underline",
-      "background-color": "#fff",
-      "color": "#01689b",
-      "padding-block": "0.75rem",
-      "padding-inline": "1rem",
-      "min-block-size": "48px",
-      "min-inline-size": "48px",
-      "text-decoration-thickness": "0.0625em",
-      "text-underline-offset": "0.125rem",
-      "line-height": "150%",
-      "font-size": "1.25rem"
-    },
     "link": {
       "active": {
         "color": "#800080"
@@ -1295,6 +1200,18 @@
         "cursor": "disabled"
       }
     },
+    "skip-link": {
+      "background-color": "#fff",
+      "color": "#01689b",
+      "padding-block": "0.75rem",
+      "padding-inline": "1rem",
+      "min-block-size": "48px",
+      "min-inline-size": "48px",
+      "text-decoration-thickness": "0.0625em",
+      "text-underline-offset": "0.125rem",
+      "line-height": "150%",
+      "font-size": "1.25rem"
+    },
     "paragraph": {
       "color": "#0F172A",
       "font-family": "RijksSans, Arial, Verdana, sans-serif",
@@ -1396,35 +1313,6 @@
         "borderRadiusBottomLeft": "48px"
       }
     },
-    "accordion": {
-      "border-radius": "0px",
-      "color": "#0F172A",
-      "header": {
-        "margin": 0
-      },
-      "section": {
-        "border-block-end-width": "1px",
-        "border-color": "#94A3B8",
-        "border-width": "1px"
-      },
-      "button": {
-        "padding-block-end": "0.75rem",
-        "padding-block-start": "0.75rem",
-        "padding-inline-end": "1rem",
-        "padding-inline-start": "1rem",
-        "expanded": {
-          "background-color": "#fff",
-          "color": "#0F172A"
-        },
-        "icon": {
-          "margin-block": "0.25rem"
-        },
-        "font-family": "RijksSans, Arial, Verdana, sans-serif",
-        "font-weight": 400,
-        "font-size": "1.25rem",
-        "line-height": "150%"
-      }
-    },
     "data-badge-button": {
       "column-gap": "0.125rem",
       "hover": {