@conduction/theme 1.0.19 → 1.0.21

package/municipalities/tubbergen-design-tokens/src/brand/tubbergen/color.tokens.json

@@ -25,70 +25,94 @@
       "alert-info-background": { "value": "{tubbergen.color.green.89}" },
 
       "green": {
-        "89": {
-          "value": "#d5efdf"
-        },
-        "76": { "value": "#b0d4be" },
-        "24": {
-          "value": "#067432"
+        "11": {
+          "value": "#063318"
         },
         "21": {
           "value": "#0b612d",
           "comment": "Base/Green"
         },
-        "11": {
-          "value": "#063318"
+        "24": {
+          "value": "#067432"
+        },
+        "76": {
+          "value": "#b0d4be"
+        },
+        "89": {
+          "value": "#d5efdf"
         }
       },
 
       "blue": {
+        "48": {
+          "value": "#2e79c6"
+        },
         "84": {
           "value": "#ccd4df",
           "comment": "Base/Blue"
         },
-        "96": { "value": "#f2f4f7" },
-        "94": { "value": "#edeff2" },
-        "48": {
-          "value": "#2e79c6"
+        "94": {
+          "value": "#edeff2"
+        },
+        "96": {
+          "value": "#f2f4f7"
         }
       },
 
       "white": {
+        "98": {
+          "value": "#fafafa"
+        },
         "100": {
           "value": "#ffffff",
           "comment": "Base/White"
-        },
-        "98": {
-          "value": "#fafafa"
         }
       },
 
       "black": {
-        "0": { "value": "#000000" },
-        "13": { "value": "#222222", "comment": "Base/Black" },
-        "20": { "value": "#333333" },
-        "33": { "value": "#555555" }
+        "0": {
+          "value": "#000000"
+        },
+        "13": {
+          "value": "#222222",
+          "comment": "Base/Black"
+        },
+        "20": {
+          "value": "#333333"
+        },
+        "33": {
+          "value": "#555555"
+        }
       },
 
       "yellow": {
-        "0": { "value": "#f0b700", "comment": "Base/Yellow" }
+        "0": {
+          "value": "#f0b700",
+          "comment": "Base/Yellow"
+        }
       },
 
       "grey": {
-        "64": {
-          "value": "#9aa1ab",
-          "comment": "Base/Grey"
-        },
         "42": {
           "value": "#6b6b6b"
         },
         "46": {
           "value": "#767676"
+        },
+        "64": {
+          "value": "#9aa1ab",
+          "comment": "Base/Grey"
         }
       },
 
       "lightgrey": {
-        "89": { "value": "#e4e4e4", "comment": "Base/LightGrey" }
+        "89": {
+          "value": "#e4e4e4",
+          "comment": "Base/LightGrey"
+        },
+        "96": {
+          "value": "#f5f5f5"
+        }
       }
     }
   }

package/municipalities/tubbergen-design-tokens/src/component/conduction/alert.tokens.json

@@ -0,0 +1,9 @@
+{
+  "utrecht": {
+    "alert": {
+      "icon": {
+        "gap": { "value": "{tubbergen.size.xs}" }
+      }
+    }
+  }
+}

package/municipalities/tubbergen-design-tokens/src/component/conduction/icon.tokens.json

@@ -0,0 +1,7 @@
+{
+  "utrecht": {
+    "icon": {
+      "gap": { "value": "{tubbergen.size.xs}" }
+    }
+  }
+}

package/municipalities/tubbergen-design-tokens/src/component/conduction/page-footer.tokens.json

@@ -0,0 +1,11 @@
+{
+  "utrecht": {
+    "page-footer": {
+      "min-height": { "value": "300px" },
+      "logo": {
+        "max-height": { "value": "100px" },
+        "max-width": { "value": "220px" }
+      }
+    }
+  }
+}

package/municipalities/tubbergen-design-tokens/src/component/conduction/page-header.tokens.json

@@ -0,0 +1,10 @@
+{
+  "utrecht": {
+    "page-header": {
+      "logo": {
+        "max-height": {},
+        "max-width": { "value": "150px" }
+      }
+    }
+  }
+}

package/municipalities/tubbergen-design-tokens/src/component/utrecht/alert.tokens.json

@@ -34,7 +34,6 @@
         "error": {
           "color": { "value": "{tubbergen.color.alert-error}" }
         },
-        "gap": { "value": "{tubbergen.size.xs}" },
         "warning": {
           "color": { "value": "{tubbergen.color.alert-warning}" }
         },

package/municipalities/tubbergen-design-tokens/src/component/utrecht/code.tokens.json

@@ -1,7 +1,7 @@
 {
   "utrecht": {
     "code": {
-      "background-color": { "value": "{tubbergen.color.lightgrey.89}" },
+      "background-color": { "value": "{tubbergen.color.lightgrey.96}" },
       "color": { "value": "{utrecht.document.color}" },
       "font-family": { "value": "{tubbergen.typography.monospace.font-family}" },
       "font-size": { "value": "inherit" },
@@ -9,7 +9,7 @@
     },
 
     "code-block": {
-      "background-color": { "value": "{tubbergen.color.lightgrey.89}" },
+      "background-color": { "value": "{tubbergen.color.lightgrey.96}" },
       "color": { "value": "{utrecht.document.color}" },
       "font-family": { "value": "{tubbergen.typography.monospace.font-family}" },
       "font-size": { "value": "{tubbergen.font-size.md}" },

package/municipalities/tubbergen-design-tokens/src/component/utrecht/icon.tokens.json

@@ -2,7 +2,6 @@
   "utrecht": {
     "icon": {
       "color": {},
-      "gap": { "value": "{tubbergen.size.xs}" },
       "size": {},
       "inset-block-start": {},
       "baseline": {

package/municipalities/tubbergen-design-tokens/src/component/utrecht/page-footer.tokens.json

@@ -9,8 +9,7 @@
       "padding-inline-end": { "value": "{tubbergen.size.sm}" },
       "padding-inline-start": { "value": "{tubbergen.size.sm}" },
       "padding-block-end": { "value": "{tubbergen.size.2xl}" },
-      "padding-block-start": { "value": "{tubbergen.size.2xl}" },
-      "min-height": { "value": "300px" }
+      "padding-block-start": { "value": "{tubbergen.size.2xl}" }
     }
   }
 }

package/municipalities/xxllnc-design-tokens/dist/design-tokens.css

@@ -1,14 +1,12 @@
 /**
  * Do not edit directly
- * Generated on Tue, 15 Aug 2023 08:23:16 GMT
+ * Generated on Wed, 16 Aug 2023 08:06:28 GMT
  */
 
 .xxllnc-theme {
   --conduction-input-select-padding-block-start: 0;
   --conduction-input-select-padding-block-end: 0;
   --conduction-input-select-border-focus: unset;
-  --utrecht-textbox-font-size: 15px;
-  --utrecht-textbox-border-radius: 6px;
   --utrecht-table-header-cell-text-transform: unset;
   --utrecht-table-header-text-transform: unset;
   --utrecht-table-margin-block-end: 0;
@@ -16,7 +14,6 @@
   --utrecht-paragraph-margin-block-start: 0;
   --utrecht-paragraph-line-height: 1.5em;
   --utrecht-page-max-inline-size: 1140px;
-  --utrecht-page-footer-background-image: unset;
   --utrecht-unordered-list-item-padding-inline-start: 1ch;
   --utrecht-unordered-list-padding-inline-start: 2ch;
   --utrecht-unordered-list-margin-block-end: 0;
@@ -26,8 +23,6 @@
   --utrecht-link-text-decoration-thickness: 0;
   --utrecht-link-text-decoration-color: unset;
   --utrecht-link-text-decoration: none;
-  --utrecht-form-input-font-size: 15px;
-  --utrecht-form-input-border-radius: 6px;
   --utrecht-code-block-margin-inline-end: 0;
   --utrecht-code-block-margin-inline-start: 0;
   --utrecht-code-font-size: inherit;
@@ -37,6 +32,14 @@
   --utrecht-button-font-size: inherit;
   --utrecht-button-border-width: 0;
   --utrecht-button-border-radius: 16px;
+  --utrecht-textbox-font-size: 15px;
+  --utrecht-textbox-border-radius: 6px;
+  --utrecht-page-header-logo-max-width: 150px;
+  --utrecht-page-footer-background-image: unset;
+  --utrecht-page-footer-logo-max-width: 100px;
+  --utrecht-page-footer-logo-max-height: 100px;
+  --utrecht-form-input-font-size: 15px;
+  --utrecht-form-input-border-radius: 6px;
   --utrecht-card-border-width: unset;
   --utrecht-card-border-radius: 16px;
   --utrecht-action-submit-cursor: pointer;
@@ -70,13 +73,13 @@
   --xxllnc-font-size-2xs: 10px;
   --xxllnc-font-size-3xs: 8px;
   --xxllnc-font-size-4xs: 5px;
-  --xxllnc-color-lightgrey: #f5f5f5;
+  --xxllnc-color-lightgrey-96: #f5f5f5;
   --xxllnc-color-grey-90-hover: #e5e5e5cc; /* Grey with 80% transparency */
   --xxllnc-color-grey-92: #eaeaea; /* Base/Grey */
   --xxllnc-color-grey-90: #e5e5e5;
   --xxllnc-color-grey-43: #6d6d6d;
-  --xxllnc-color-black-0-22t: #00000038; /* Black with 22% transparency */
   --xxllnc-color-black-17-hover: #2b2b2bcc; /* Black with 80% transparency */
+  --xxllnc-color-black-0-22t: #00000038; /* Black with 22% transparency */
   --xxllnc-color-black-21: #333338;
   --xxllnc-color-black-17: #2b2b2b;
   --xxllnc-color-black-16: #28282c; /* Base/Black */
@@ -98,18 +101,8 @@
   --conduction-input-select-border-radius: var(--utrecht-form-input-border-radius);
   --conduction-input-select-border: 1px solid var(--xxllnc-color-grey-92);
   --conduction-input-select-background-color: var(--xxllnc-color-white-100);
-  --utrecht-textbox-placeholder-color: var(--xxllnc-color-grey-43);
-  --utrecht-textbox-padding-inline-start: var(--xxllnc-size-sm);
-  --utrecht-textbox-padding-inline-end: var(--xxllnc-size-sm);
-  --utrecht-textbox-padding-block-start: var(--xxllnc-size-xs);
-  --utrecht-textbox-padding-block-end: var(--xxllnc-size-xs);
-  --utrecht-textbox-font-family: var(--xxllnc-typography-sans-serif-font-family);
-  --utrecht-textbox-color: var(--xxllnc-color-grey-43);
-  --utrecht-textbox-border-width: var(--xxllnc-size-4xs);
-  --utrecht-textbox-border-color: var(--xxllnc-color-black-0-22t);
-  --utrecht-textbox-background-color: var(--xxllnc-color-white-100-0t);
   --utrecht-table-row-border-block-end-width: var(--xxllnc-size-4xs);
-  --utrecht-table-row-border-block-end-color: var(--xxllnc-color-lightgrey);
+  --utrecht-table-row-border-block-end-color: var(--xxllnc-color-lightgrey-96);
   --utrecht-table-cell-padding-inline-start: var(--xxllnc-size-md);
   --utrecht-table-cell-padding-inline-end: var(--xxllnc-size-md);
   --utrecht-table-cell-padding-block-start: var(--xxllnc-size-md);
@@ -118,22 +111,12 @@
   --utrecht-table-header-font-weight: var(--xxllnc-typography-font-weight-bold);
   --utrecht-table-margin-block-start: var(--xxllnc-size-md);
   --utrecht-table-border-width: var(--xxllnc-size-4xs);
-  --utrecht-table-border-color: var(--xxllnc-color-lightgrey);
+  --utrecht-table-border-color: var(--xxllnc-color-lightgrey-96);
   --utrecht-paragraph-font-weight: var(--xxllnc-typography-font-weight-normal);
   --utrecht-paragraph-font-size: var(--xxllnc-font-size-md);
   --utrecht-paragraph-font-family: var(--xxllnc-typography-sans-serif-font-family);
   --utrecht-page-padding-inline-end: var(--xxllnc-size-lg);
   --utrecht-page-padding-inline-start: var(--xxllnc-size-lg);
-  --utrecht-page-header-padding-block-end: var(--xxllnc-size-sm);
-  --utrecht-page-header-padding-block-start: var(--xxllnc-size-sm);
-  --utrecht-page-header-color: var(--xxllnc-color-black-16);
-  --utrecht-page-header-background-color: var(--xxllnc-color-grey-92);
-  --utrecht-page-footer-padding-block-start: var(--xxllnc-size-2xl);
-  --utrecht-page-footer-padding-block-end: var(--xxllnc-size-2xl);
-  --utrecht-page-footer-padding-inline-start: var(--xxllnc-size-sm);
-  --utrecht-page-footer-padding-inline-end: var(--xxllnc-size-sm);
-  --utrecht-page-footer-color: var(--xxllnc-color-primary);
-  --utrecht-page-footer-background-color: var(--xxllnc-color-white-100);
   --utrecht-unordered-list-marker-color: var(--xxllnc-color-primary);
   --utrecht-unordered-list-item-margin-block-end: var(--xxllnc-size-xs);
   --utrecht-unordered-list-item-margin-block-start: var(--xxllnc-size-xs);
@@ -148,7 +131,6 @@
   --utrecht-link-hover-color: var(--xxllnc-color-primary-hover);
   --utrecht-link-text-underline-offset: var(--xxllnc-size-3xs);
   --utrecht-link-color: var(--xxllnc-color-primary);
-  --utrecht-icon-gap: var(--xxllnc-size-xs);
   --utrecht-heading-5-margin-block-start: var(--xxllnc-size-md);
   --utrecht-heading-5-margin-block-end: var(--xxllnc-size-lg);
   --utrecht-heading-5-font-weight: var(--xxllnc-typography-font-weight-light);
@@ -174,16 +156,6 @@
   --utrecht-heading-1-font-weight: var(--xxllnc-typography-font-weight-normal);
   --utrecht-heading-1-font-size: var(--xxllnc-font-size-3xl);
   --utrecht-heading-1-font-family: var(--xxllnc-typography-sans-serif-font-family);
-  --utrecht-form-input-placeholder-color: var(--xxllnc-color-grey-43);
-  --utrecht-form-input-padding-inline-start: var(--xxllnc-size-sm);
-  --utrecht-form-input-padding-inline-end: var(--xxllnc-size-sm);
-  --utrecht-form-input-padding-block-start: var(--xxllnc-size-xs);
-  --utrecht-form-input-padding-block-end: var(--xxllnc-size-xs);
-  --utrecht-form-input-font-family: var(--xxllnc-typography-sans-serif-font-family);
-  --utrecht-form-input-color: var(--xxllnc-color-grey-43);
-  --utrecht-form-input-border-width: var(--xxllnc-size-4xs);
-  --utrecht-form-input-border-color: var(--xxllnc-color-black-0-22t);
-  --utrecht-form-input-background-color: var(--xxllnc-color-white-100-0t);
   --utrecht-document-font-size: var(--xxllnc-font-size-md);
   --utrecht-document-font-family: var(--xxllnc-typography-sans-serif-font-family);
   --utrecht-document-color: var(--xxllnc-color-black-16);
@@ -198,10 +170,10 @@
   --utrecht-code-block-font-size: var(--xxllnc-font-size-md);
   --utrecht-code-block-font-family: var(--xxllnc-typography-monospace-font-family);
   --utrecht-code-block-color: var(--xxllnc-color-black-16);
-  --utrecht-code-block-background-color: var(--xxllnc-color-lightgrey);
+  --utrecht-code-block-background-color: var(--xxllnc-color-lightgrey-96);
   --utrecht-code-font-family: var(--xxllnc-typography-monospace-font-family);
   --utrecht-code-color: var(--xxllnc-color-black-16);
-  --utrecht-code-background-color: var(--xxllnc-color-lightgrey);
+  --utrecht-code-background-color: var(--xxllnc-color-lightgrey-96);
   --utrecht-button-secondary-action-hover-color: var(--xxllnc-color-black-17-hover);
   --utrecht-button-secondary-action-hover-border-color: var(--xxllnc-color-black-17-hover);
   --utrecht-button-secondary-action-hover-background-color: var(--xxllnc-color-white-100);
@@ -224,10 +196,47 @@
   --utrecht-button-font-family: var(--xxllnc-typography-inter-font-family);
   --utrecht-button-color: var(--xxllnc-color-grey-90);
   --utrecht-button-background-color: var(--xxllnc-color-black-17);
-  --utrecht-alert-icon-ok-color: var(--xxllnc-color-alert-succes);
-  --utrecht-alert-icon-warning-color: var(--xxllnc-color-alert-warning);
-  --utrecht-alert-icon-gap: var(--xxllnc-size-xs);
-  --utrecht-alert-icon-error-color: var(--xxllnc-color-alert-error);
+  --utrecht-blockquote-content-font-size: var(--xxllnc-font-size-md);
+  --utrecht-blockquote-content-color: var(--xxllnc-color-black-16);
+  --utrecht-blockquote-margin-inline-end: var(--xxllnc-size-xl);
+  --utrecht-blockquote-margin-inline-start: var(--xxllnc-size-xl);
+  --utrecht-textbox-placeholder-color: var(--xxllnc-color-grey-43);
+  --utrecht-textbox-padding-inline-start: var(--xxllnc-size-sm);
+  --utrecht-textbox-padding-inline-end: var(--xxllnc-size-sm);
+  --utrecht-textbox-padding-block-start: var(--xxllnc-size-xs);
+  --utrecht-textbox-padding-block-end: var(--xxllnc-size-xs);
+  --utrecht-textbox-font-family: var(--xxllnc-typography-sans-serif-font-family);
+  --utrecht-textbox-color: var(--xxllnc-color-grey-43);
+  --utrecht-textbox-border-width: var(--xxllnc-size-4xs);
+  --utrecht-textbox-border-color: var(--xxllnc-color-black-0-22t);
+  --utrecht-textbox-background-color: var(--xxllnc-color-white-100-0t);
+  --utrecht-page-header-padding-block-end: var(--xxllnc-size-sm);
+  --utrecht-page-header-padding-block-start: var(--xxllnc-size-sm);
+  --utrecht-page-header-color: var(--xxllnc-color-black-16);
+  --utrecht-page-header-background-color: var(--xxllnc-color-grey-92);
+  --utrecht-page-footer-padding-block-start: var(--xxllnc-size-2xl);
+  --utrecht-page-footer-padding-block-end: var(--xxllnc-size-2xl);
+  --utrecht-page-footer-padding-inline-start: var(--xxllnc-size-sm);
+  --utrecht-page-footer-padding-inline-end: var(--xxllnc-size-sm);
+  --utrecht-page-footer-color: var(--xxllnc-color-primary);
+  --utrecht-page-footer-background-color: var(--xxllnc-color-white-100);
+  --utrecht-icon-gap: var(--xxllnc-size-xs);
+  --utrecht-form-input-placeholder-color: var(--xxllnc-color-grey-43);
+  --utrecht-form-input-padding-inline-start: var(--xxllnc-size-sm);
+  --utrecht-form-input-padding-inline-end: var(--xxllnc-size-sm);
+  --utrecht-form-input-padding-block-start: var(--xxllnc-size-xs);
+  --utrecht-form-input-padding-block-end: var(--xxllnc-size-xs);
+  --utrecht-form-input-font-family: var(--xxllnc-typography-sans-serif-font-family);
+  --utrecht-form-input-color: var(--xxllnc-color-grey-43);
+  --utrecht-form-input-border-width: var(--xxllnc-size-4xs);
+  --utrecht-form-input-border-color: var(--xxllnc-color-black-0-22t);
+  --utrecht-form-input-background-color: var(--xxllnc-color-white-100-0t);
+  --utrecht-card-padding-block-start: var(--xxllnc-size-md);
+  --utrecht-card-padding-block-end: var(--xxllnc-size-md);
+  --utrecht-card-padding-inline-start: var(--xxllnc-size-md);
+  --utrecht-card-padding-inline-end: var(--xxllnc-size-md);
+  --utrecht-card-color: var(--xxllnc-color-white-95);
+  --utrecht-card-background-color: var(--xxllnc-color-black-21);
   --utrecht-alert-ok-color: var(--xxllnc-color-alert-succes);
   --utrecht-alert-ok-background-color: var(--xxllnc-color-alert-succes-background);
   --utrecht-alert-error-color: var(--xxllnc-color-alert-error);
@@ -238,12 +247,10 @@
   --utrecht-alert-padding-inline-start: var(--xxllnc-size-lg);
   --utrecht-alert-padding-block-end: var(--xxllnc-size-lg);
   --utrecht-alert-padding-block-start: var(--xxllnc-size-lg);
-  --utrecht-card-padding-block-start: var(--xxllnc-size-md);
-  --utrecht-card-padding-block-end: var(--xxllnc-size-md);
-  --utrecht-card-padding-inline-start: var(--xxllnc-size-md);
-  --utrecht-card-padding-inline-end: var(--xxllnc-size-md);
-  --utrecht-card-color: var(--xxllnc-color-white-95);
-  --utrecht-card-background-color: var(--xxllnc-color-black-21);
+  --utrecht-alert-icon-ok-color: var(--xxllnc-color-alert-succes);
+  --utrecht-alert-icon-warning-color: var(--xxllnc-color-alert-warning);
+  --utrecht-alert-icon-error-color: var(--xxllnc-color-alert-error);
+  --utrecht-alert-icon-gap: var(--xxllnc-size-xs);
   --utrecht-space-inline-3xl: var(--xxllnc-size-3xl);
   --utrecht-space-inline-2xl: var(--xxllnc-size-2xl);
   --utrecht-space-inline-xl: var(--xxllnc-size-xl);
@@ -284,7 +291,7 @@
   --utrecht-paragraph-color: var(--utrecht-document-color);
   --utrecht-unordered-list-font-size: var(--utrecht-document-font-size);
   --utrecht-ordered-list-font-size: var(--utrecht-document-font-size);
-  --utrecht-alert-icon-color: var(--xxllnc-color-alert-info);
   --utrecht-alert-color: var(--xxllnc-color-alert-info);
   --utrecht-alert-background-color: var(--xxllnc-color-alert-info-background);
+  --utrecht-alert-icon-color: var(--xxllnc-color-alert-info);
 }

package/municipalities/xxllnc-design-tokens/dist/index.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Tue, 15 Aug 2023 08:23:15 GMT
+ * Generated on Wed, 16 Aug 2023 08:06:27 GMT
  */
 
 export const xxllncColorPrimary = "#000000ad"; // Primary with 68% transparency
@@ -23,13 +23,13 @@ export const xxllncColorWhite1000t = "#ffffff"; // White with 0% transparency
 export const xxllncColorBlack16 = "#28282c"; // Base/Black
 export const xxllncColorBlack17 = "#2b2b2b";
 export const xxllncColorBlack21 = "#333338";
-export const xxllncColorBlack17Hover = "#2b2b2bcc"; // Black with 80% transparency
 export const xxllncColorBlack022t = "#00000038"; // Black with 22% transparency
+export const xxllncColorBlack17Hover = "#2b2b2bcc"; // Black with 80% transparency
 export const xxllncColorGrey43 = "#6d6d6d";
 export const xxllncColorGrey90 = "#e5e5e5";
 export const xxllncColorGrey92 = "#eaeaea"; // Base/Grey
 export const xxllncColorGrey90Hover = "#e5e5e5cc"; // Grey with 80% transparency
-export const xxllncColorLightgrey = "#f5f5f5";
+export const xxllncColorLightgrey96 = "#f5f5f5";
 export const xxllncFontSize4xs = "5px";
 export const xxllncFontSize3xs = "8px";
 export const xxllncFontSize2xs = "10px";
@@ -90,14 +90,11 @@ export const utrechtSpaceInlineLg = "24px";
 export const utrechtSpaceInlineXl = "32px";
 export const utrechtSpaceInline2xl = "48px";
 export const utrechtSpaceInline3xl = "72px";
-export const utrechtCardBackgroundColor = "#333338";
-export const utrechtCardBorderRadius = "16px";
-export const utrechtCardBorderWidth = "unset";
-export const utrechtCardColor = "#f1f1f1";
-export const utrechtCardPaddingInlineEnd = "18px";
-export const utrechtCardPaddingInlineStart = "18px";
-export const utrechtCardPaddingBlockEnd = "18px";
-export const utrechtCardPaddingBlockStart = "18px";
+export const utrechtAlertIconGap = "8px";
+export const utrechtAlertIconColor = "#28282c";
+export const utrechtAlertIconErrorColor = "#721c24";
+export const utrechtAlertIconWarningColor = "#856404";
+export const utrechtAlertIconOkColor = "#155724";
 export const utrechtAlertBackgroundColor = "#eaeaea";
 export const utrechtAlertColor = "#28282c";
 export const utrechtAlertPaddingBlockStart = "24px";
@@ -110,11 +107,57 @@ export const utrechtAlertErrorBackgroundColor = "#f8d7da";
 export const utrechtAlertErrorColor = "#721c24";
 export const utrechtAlertOkBackgroundColor = "#d4edda";
 export const utrechtAlertOkColor = "#155724";
-export const utrechtAlertIconColor = "#28282c";
-export const utrechtAlertIconErrorColor = "#721c24";
-export const utrechtAlertIconGap = "8px";
-export const utrechtAlertIconWarningColor = "#856404";
-export const utrechtAlertIconOkColor = "#155724";
+export const utrechtCardBackgroundColor = "#333338";
+export const utrechtCardBorderRadius = "16px";
+export const utrechtCardBorderWidth = "unset";
+export const utrechtCardColor = "#f1f1f1";
+export const utrechtCardPaddingInlineEnd = "18px";
+export const utrechtCardPaddingInlineStart = "18px";
+export const utrechtCardPaddingBlockEnd = "18px";
+export const utrechtCardPaddingBlockStart = "18px";
+export const utrechtFormInputBackgroundColor = "#ffffff";
+export const utrechtFormInputBorderColor = "#00000038";
+export const utrechtFormInputBorderRadius = "6px";
+export const utrechtFormInputBorderWidth = "1px";
+export const utrechtFormInputColor = "#6d6d6d";
+export const utrechtFormInputFontFamily = "neue-haas-grotesk-text, sans-serif";
+export const utrechtFormInputFontSize = "15px";
+export const utrechtFormInputPaddingBlockEnd = "8px";
+export const utrechtFormInputPaddingBlockStart = "8px";
+export const utrechtFormInputPaddingInlineEnd = "14px";
+export const utrechtFormInputPaddingInlineStart = "14px";
+export const utrechtFormInputPlaceholderColor = "#6d6d6d";
+export const utrechtIconGap = "8px";
+export const utrechtPageFooterLogoMaxHeight = "100px";
+export const utrechtPageFooterLogoMaxWidth = "100px";
+export const utrechtPageFooterBackgroundColor = "#ffffff";
+export const utrechtPageFooterBackgroundImage = "unset";
+export const utrechtPageFooterColor = "#000000ad";
+export const utrechtPageFooterPaddingInlineEnd = "14px";
+export const utrechtPageFooterPaddingInlineStart = "14px";
+export const utrechtPageFooterPaddingBlockEnd = "48px";
+export const utrechtPageFooterPaddingBlockStart = "48px";
+export const utrechtPageHeaderLogoMaxWidth = "150px";
+export const utrechtPageHeaderBackgroundColor = "#eaeaea";
+export const utrechtPageHeaderColor = "#28282c";
+export const utrechtPageHeaderPaddingBlockStart = "14px";
+export const utrechtPageHeaderPaddingBlockEnd = "14px";
+export const utrechtTextboxBackgroundColor = "#ffffff";
+export const utrechtTextboxBorderColor = "#00000038";
+export const utrechtTextboxBorderRadius = "6px";
+export const utrechtTextboxBorderWidth = "1px";
+export const utrechtTextboxColor = "#6d6d6d";
+export const utrechtTextboxFontFamily = "neue-haas-grotesk-text, sans-serif";
+export const utrechtTextboxFontSize = "15px";
+export const utrechtTextboxPaddingBlockEnd = "8px";
+export const utrechtTextboxPaddingBlockStart = "8px";
+export const utrechtTextboxPaddingInlineEnd = "14px";
+export const utrechtTextboxPaddingInlineStart = "14px";
+export const utrechtTextboxPlaceholderColor = "#6d6d6d";
+export const utrechtBlockquoteMarginInlineStart = "32px";
+export const utrechtBlockquoteMarginInlineEnd = "32px";
+export const utrechtBlockquoteContentColor = "#28282c";
+export const utrechtBlockquoteContentFontSize = "16px";
 export const utrechtButtonBackgroundColor = "#2b2b2b";
 export const utrechtButtonBorderRadius = "16px";
 export const utrechtButtonBorderWidth = 0;
@@ -164,18 +207,6 @@ export const utrechtDocumentBackgroundColor = "#ffffff";
 export const utrechtDocumentColor = "#28282c";
 export const utrechtDocumentFontFamily = "neue-haas-grotesk-text, sans-serif";
 export const utrechtDocumentFontSize = "16px";
-export const utrechtFormInputBackgroundColor = "#ffffff";
-export const utrechtFormInputBorderColor = "#00000038";
-export const utrechtFormInputBorderRadius = "6px";
-export const utrechtFormInputBorderWidth = "1px";
-export const utrechtFormInputColor = "#6d6d6d";
-export const utrechtFormInputFontFamily = "neue-haas-grotesk-text, sans-serif";
-export const utrechtFormInputFontSize = "15px";
-export const utrechtFormInputPaddingBlockEnd = "8px";
-export const utrechtFormInputPaddingBlockStart = "8px";
-export const utrechtFormInputPaddingInlineEnd = "14px";
-export const utrechtFormInputPaddingInlineStart = "14px";
-export const utrechtFormInputPlaceholderColor = "#6d6d6d";
 export const utrechtHeading1FontFamily = "neue-haas-grotesk-text, sans-serif";
 export const utrechtHeading1FontSize = "48px";
 export const utrechtHeading1FontWeight = "400";
@@ -201,7 +232,6 @@ export const utrechtHeading5FontSize = "16px";
 export const utrechtHeading5FontWeight = "100";
 export const utrechtHeading5MarginBlockEnd = "24px";
 export const utrechtHeading5MarginBlockStart = "18px";
-export const utrechtIconGap = "8px";
 export const utrechtLinkColor = "#000000ad";
 export const utrechtLinkTextDecoration = "none";
 export const utrechtLinkTextDecorationColor = "unset";
@@ -227,17 +257,6 @@ export const utrechtUnorderedListItemMarginBlockStart = "8px";
 export const utrechtUnorderedListItemMarginBlockEnd = "8px";
 export const utrechtUnorderedListItemPaddingInlineStart = "1ch";
 export const utrechtUnorderedListMarkerColor = "#000000ad";
-export const utrechtPageFooterBackgroundColor = "#ffffff";
-export const utrechtPageFooterBackgroundImage = "unset";
-export const utrechtPageFooterColor = "#000000ad";
-export const utrechtPageFooterPaddingInlineEnd = "14px";
-export const utrechtPageFooterPaddingInlineStart = "14px";
-export const utrechtPageFooterPaddingBlockEnd = "48px";
-export const utrechtPageFooterPaddingBlockStart = "48px";
-export const utrechtPageHeaderBackgroundColor = "#eaeaea";
-export const utrechtPageHeaderColor = "#28282c";
-export const utrechtPageHeaderPaddingBlockStart = "14px";
-export const utrechtPageHeaderPaddingBlockEnd = "14px";
 export const utrechtPagePaddingInlineStart = "24px";
 export const utrechtPagePaddingInlineEnd = "24px";
 export const utrechtPageMaxInlineSize = "1140px";
@@ -267,18 +286,6 @@ export const utrechtTableCellPaddingInlineEnd = "18px";
 export const utrechtTableCellPaddingInlineStart = "18px";
 export const utrechtTableRowBorderBlockEndColor = "#f5f5f5";
 export const utrechtTableRowBorderBlockEndWidth = "1px";
-export const utrechtTextboxBackgroundColor = "#ffffff";
-export const utrechtTextboxBorderColor = "#00000038";
-export const utrechtTextboxBorderRadius = "6px";
-export const utrechtTextboxBorderWidth = "1px";
-export const utrechtTextboxColor = "#6d6d6d";
-export const utrechtTextboxFontFamily = "neue-haas-grotesk-text, sans-serif";
-export const utrechtTextboxFontSize = "15px";
-export const utrechtTextboxPaddingBlockEnd = "8px";
-export const utrechtTextboxPaddingBlockStart = "8px";
-export const utrechtTextboxPaddingInlineEnd = "14px";
-export const utrechtTextboxPaddingInlineStart = "14px";
-export const utrechtTextboxPlaceholderColor = "#6d6d6d";
 export const conductionInputSelectBackgroundColor = "#ffffff";
 export const conductionInputSelectBorder = "1px solid #eaeaea";
 export const conductionInputSelectBorderFocus = "unset";