@conduction/theme 1.0.23 → 1.0.26

package/municipalities/leiden-design-tokens/src/component/conduction/{card.tokens.json → card-wrapper.tokens.json}

@@ -1,11 +1,15 @@
 {
-  "utrecht": {
-    "card": {
+  "conduction": {
+    "card-wrapper": {
       "background-color": { "value": "{leiden.color.lightgrey.89}" },
       "border-color": {},
+      "border-width": {},
+      "border-style": {},
       "border-radius": {},
-      "border-width": { "value": "unset" },
       "color": { "value": "{leiden.color.black.9}" },
+      "hover": {
+        "background-color": {}
+      },
       "padding-inline-end": { "value": "{leiden.size.xl}" },
       "padding-inline-start": { "value": "{leiden.size.xl}" },
       "padding-block-end": { "value": "{leiden.size.sm}" },

package/municipalities/leiden-design-tokens/src/component/utrecht/extra-tokens/table.tokens.json

@@ -0,0 +1,24 @@
+{
+  "utrecht": {
+    "table": {
+      "background-color": {},
+      "header": {
+        "border-block-end-color": {},
+        "border-block-end-width": {},
+        "font-family": {}
+      },
+      "row": {
+        "hover": {
+          "background-color": {},
+          "color": {}
+        }
+      },
+      "body": {
+        "border": {}
+      },
+      "caption": {
+        "font-style": {}
+      }
+    }
+  }
+}

package/municipalities/leiden-design-tokens/src/component/utrecht/list.tokens.json

@@ -24,6 +24,7 @@
         "margin-block-end": { "value": "{leiden.size.xs}" },
         "padding-inline-start": { "value": "1ch" }
       },
+
       "marker": {
         "color": { "value": "{leiden.color.primary}" }
       }

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

@@ -3,8 +3,8 @@
     "page": {
       "background-color": {},
       "color": {},
-      "padding-inline-start": { "value": "{leiden.size.lg}" },
-      "padding-inline-end": { "value": "{leiden.size.lg}" },
+      "margin-inline-start": { "value": "{leiden.size.lg}" },
+      "margin-inline-end": { "value": "{leiden.size.lg}" },
       "max-inline-size": { "value": "1140px" }
     }
   }

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

@@ -0,0 +1,129 @@
+/**
+ * Do not edit directly
+ * Generated on Tue, 22 Aug 2023 10:28:00 GMT
+ */
+
+.noaberkracht-theme {
+  --utrecht-page-max-inline-size: 1140px;
+  --utrecht-page-header-logo-max-width: 130px;
+  --utrecht-page-footer-background-image: unset;
+  --utrecht-page-footer-logo-max-width: 150px;
+  --utrecht-action-submit-cursor: pointer;
+  --utrecht-action-disabled-cursor: not-allowed;
+  --utrecht-action-busy-cursor: wait;
+  --noaberkracht-typography-font-weight-light: 100;
+  --noaberkracht-typography-font-weight-normal: 400;
+  --noaberkracht-typography-font-weight-bold: 700;
+  --noaberkracht-typography-monospace-font-family: Monospace, "Lucida Console";
+  --noaberkracht-typography-sans-serif-font-family: "Noto Sans", Arial, sans-serif;
+  --noaberkracht-typography-greycliff-cf-font-family: OceanWide;
+  --noaberkracht-size-4xl: 96px;
+  --noaberkracht-size-3xl: 72px;
+  --noaberkracht-size-2xl: 48px;
+  --noaberkracht-size-xl: 32px;
+  --noaberkracht-size-lg: 24px;
+  --noaberkracht-size-md: 18px;
+  --noaberkracht-size-sm: 14px;
+  --noaberkracht-size-xs: 8px;
+  --noaberkracht-size-2xs: 4px;
+  --noaberkracht-size-3xs: 2px;
+  --noaberkracht-size-4xs: 1px;
+  --noaberkracht-font-size-4xl: 84px;
+  --noaberkracht-font-size-3xl: 72px;
+  --noaberkracht-font-size-2xl: 60px;
+  --noaberkracht-font-size-xl: 48px;
+  --noaberkracht-font-size-lg: 36px;
+  --noaberkracht-font-size-md: 24px;
+  --noaberkracht-font-size-sm: 18px;
+  --noaberkracht-font-size-xs: 14px;
+  --noaberkracht-font-size-2xs: 12px;
+  --noaberkracht-font-size-3xs: 10x;
+  --noaberkracht-font-size-4xs: 8px;
+  --noaberkracht-color-black-0: #000000; /* Base/Black */
+  --noaberkracht-color-white-100: #ffffff; /* Base/White */
+  --noaberkracht-color-white-98: #fafafa;
+  --noaberkracht-color-lightgrey-96: #f5f5f5; /* Base/LightGrey */
+  --noaberkracht-color-yellow-47: #f0b800; /* Base/Yellow from Huisstijlhandboek, base color of website is #f0af00 */
+  --noaberkracht-color-blue-31: #012c9d99; /* Blue with 60% transparency */
+  --noaberkracht-color-blue-22: #003790; /* Base/Blue from Huisstijlhandboek, base color of website is #012c9d */
+  --noaberkracht-color-alert-info-background: #cce5ff;
+  --noaberkracht-color-alert-info: #004085;
+  --noaberkracht-color-alert-succes-background: #d4edda;
+  --noaberkracht-color-alert-succes: #155724;
+  --noaberkracht-color-succes: #28a745;
+  --noaberkracht-color-alert-warning-background: #fff3cd;
+  --noaberkracht-color-alert-warning: #856404;
+  --noaberkracht-color-warning: #ffc107;
+  --noaberkracht-color-alert-error-background: #f8d7da;
+  --noaberkracht-color-alert-error: #721c24;
+  --noaberkracht-color-error: #dc3545;
+  --noaberkracht-color-primary-hover: #2e5ed9;
+  --noaberkracht-color-primary: #4376fc;
+  --utrecht-page-margin-inline-end: var(--noaberkracht-size-lg);
+  --utrecht-page-margin-inline-start: var(--noaberkracht-size-lg);
+  --utrecht-page-header-padding-block-end: var(--noaberkracht-size-sm);
+  --utrecht-page-header-padding-block-start: var(--noaberkracht-size-sm);
+  --utrecht-page-header-color: var(--noaberkracht-color-white-100);
+  --utrecht-page-header-background-color: var(--noaberkracht-color-blue-31);
+  --utrecht-page-footer-padding-block-start: var(--noaberkracht-size-2xl);
+  --utrecht-page-footer-padding-block-end: var(--noaberkracht-size-2xl);
+  --utrecht-page-footer-padding-inline-start: var(--noaberkracht-size-sm);
+  --utrecht-page-footer-padding-inline-end: var(--noaberkracht-size-sm);
+  --utrecht-page-footer-color: var(--noaberkracht-color-white-100);
+  --utrecht-page-footer-background-color: var(--noaberkracht-color-yellow-47);
+  --utrecht-document-font-size: var(--noaberkracht-font-size-md);
+  --utrecht-document-font-family: var(--noaberkracht-typography-greycliff-cf-font-family);
+  --utrecht-document-color: var(--noaberkracht-color-black-0);
+  --utrecht-document-background-color: var(--noaberkracht-color-white-98);
+  --utrecht-blockquote-content-font-size: var(--noaberkracht-font-size-md);
+  --utrecht-blockquote-content-color: var(--noaberkracht-color-black-0);
+  --utrecht-blockquote-margin-inline-end: var(--noaberkracht-size-xl);
+  --utrecht-blockquote-margin-inline-start: var(--noaberkracht-size-xl);
+  --utrecht-alert-icon-gap: var(--noaberkracht-size-xs);
+  --utrecht-alert-icon-ok-color: var(--noaberkracht-color-alert-succes);
+  --utrecht-alert-icon-warning-color: var(--noaberkracht-color-alert-warning);
+  --utrecht-alert-icon-error-color: var(--noaberkracht-color-alert-error);
+  --utrecht-alert-icon-color: var(--noaberkracht-color-alert-info);
+  --utrecht-alert-ok-color: var(--noaberkracht-color-alert-succes);
+  --utrecht-alert-ok-background-color: var(--noaberkracht-color-alert-succes-background);
+  --utrecht-alert-error-color: var(--noaberkracht-color-alert-error);
+  --utrecht-alert-error-background-color: var(--noaberkracht-color-alert-error-background);
+  --utrecht-alert-warning-color: var(--noaberkracht-color-alert-warning);
+  --utrecht-alert-warning-background-color: var(--noaberkracht-color-alert-warning-background);
+  --utrecht-alert-padding-inline-end: var(--noaberkracht-size-lg);
+  --utrecht-alert-padding-inline-start: var(--noaberkracht-size-lg);
+  --utrecht-alert-padding-block-end: var(--noaberkracht-size-lg);
+  --utrecht-alert-padding-block-start: var(--noaberkracht-size-lg);
+  --utrecht-alert-color: var(--noaberkracht-color-alert-info);
+  --utrecht-alert-background-color: var(--noaberkracht-color-alert-info-background);
+  --utrecht-space-inline-3xl: var(--noaberkracht-size-3xl);
+  --utrecht-space-inline-2xl: var(--noaberkracht-size-2xl);
+  --utrecht-space-inline-xl: var(--noaberkracht-size-xl);
+  --utrecht-space-inline-lg: var(--noaberkracht-size-lg);
+  --utrecht-space-inline-md: var(--noaberkracht-size-md);
+  --utrecht-space-inline-sm: var(--noaberkracht-size-sm);
+  --utrecht-space-inline-xs: var(--noaberkracht-size-xs);
+  --utrecht-space-inline-2xs: var(--noaberkracht-size-2xs);
+  --utrecht-space-inline-3xs: var(--noaberkracht-size-3xs);
+  --utrecht-space-block-3xl: var(--noaberkracht-size-3xl);
+  --utrecht-space-block-2xl: var(--noaberkracht-size-2xl);
+  --utrecht-space-block-xl: var(--noaberkracht-size-xl);
+  --utrecht-space-block-lg: var(--noaberkracht-size-lg);
+  --utrecht-space-block-md: var(--noaberkracht-size-md);
+  --utrecht-space-block-sm: var(--noaberkracht-size-sm);
+  --utrecht-space-block-xs: var(--noaberkracht-size-xs);
+  --utrecht-space-block-2xs: var(--noaberkracht-size-2xs);
+  --utrecht-space-block-3xs: var(--noaberkracht-size-3xs);
+  --noaberkracht-typography-scale-4xl: var(--noaberkracht-font-size-4xl);
+  --noaberkracht-typography-scale-3xl: var(--noaberkracht-font-size-3xl);
+  --noaberkracht-typography-scale-2xl: var(--noaberkracht-font-size-2xl);
+  --noaberkracht-typography-scale-xl: var(--noaberkracht-font-size-xl);
+  --noaberkracht-typography-scale-lg: var(--noaberkracht-font-size-lg);
+  --noaberkracht-typography-scale-md: var(--noaberkracht-font-size-md);
+  --noaberkracht-typography-scale-sm: var(--noaberkracht-font-size-sm);
+  --noaberkracht-typography-scale-xs: var(--noaberkracht-font-size-xs);
+  --noaberkracht-typography-scale-2xs: var(--noaberkracht-font-size-2xs);
+  --noaberkracht-typography-scale-3xs: var(--noaberkracht-font-size-3xs);
+  --noaberkracht-typography-scale-4xs: var(--noaberkracht-font-size-4xs);
+  --noaberkracht-color-info: var(--noaberkracht-color-primary);
+}

package/municipalities/noaberkracht-design-tokens/dist/font.css

@@ -0,0 +1,5 @@
+/* Place any @font-face definitions here */
+@font-face {
+  font-family: "greycliff-cf";
+  src: url("../src/font/GreycliffCF-Regular.woff2") format("woff2");
+}

package/municipalities/noaberkracht-design-tokens/dist/index.css

@@ -0,0 +1,7 @@
+/**
+ * @license SEE LICENSE.md
+ * Copyright (c) 2021 NL Design System Community
+ * All rights reserved
+ */
+@import "./design-tokens.css";
+@import "./font.css";

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

@@ -0,0 +1,127 @@
+/**
+ * Do not edit directly
+ * Generated on Tue, 22 Aug 2023 10:27:59 GMT
+ */
+
+export const noaberkrachtColorPrimary = "#4376fc";
+export const noaberkrachtColorPrimaryHover = "#2e5ed9";
+export const noaberkrachtColorError = "#dc3545";
+export const noaberkrachtColorAlertError = "#721c24";
+export const noaberkrachtColorAlertErrorBackground = "#f8d7da";
+export const noaberkrachtColorWarning = "#ffc107";
+export const noaberkrachtColorAlertWarning = "#856404";
+export const noaberkrachtColorAlertWarningBackground = "#fff3cd";
+export const noaberkrachtColorSucces = "#28a745";
+export const noaberkrachtColorAlertSucces = "#155724";
+export const noaberkrachtColorAlertSuccesBackground = "#d4edda";
+export const noaberkrachtColorInfo = "#4376fc";
+export const noaberkrachtColorAlertInfo = "#004085";
+export const noaberkrachtColorAlertInfoBackground = "#cce5ff";
+export const noaberkrachtColorBlue22 = "#003790"; // Base/Blue from Huisstijlhandboek, base color of website is #012c9d
+export const noaberkrachtColorBlue31 = "#012c9d99"; // Blue with 60% transparency
+export const noaberkrachtColorYellow47 = "#f0b800"; // Base/Yellow from Huisstijlhandboek, base color of website is #f0af00
+export const noaberkrachtColorLightgrey96 = "#f5f5f5"; // Base/LightGrey
+export const noaberkrachtColorWhite98 = "#fafafa";
+export const noaberkrachtColorWhite100 = "#ffffff"; // Base/White
+export const noaberkrachtColorBlack0 = "#000000"; // Base/Black
+export const noaberkrachtFontSize4xs = "8px";
+export const noaberkrachtFontSize3xs = "10x";
+export const noaberkrachtFontSize2xs = "12px";
+export const noaberkrachtFontSizeXs = "14px";
+export const noaberkrachtFontSizeSm = "18px";
+export const noaberkrachtFontSizeMd = "24px";
+export const noaberkrachtFontSizeLg = "36px";
+export const noaberkrachtFontSizeXl = "48px";
+export const noaberkrachtFontSize2xl = "60px";
+export const noaberkrachtFontSize3xl = "72px";
+export const noaberkrachtFontSize4xl = "84px";
+export const noaberkrachtSize4xs = "1px";
+export const noaberkrachtSize3xs = "2px";
+export const noaberkrachtSize2xs = "4px";
+export const noaberkrachtSizeXs = "8px";
+export const noaberkrachtSizeSm = "14px";
+export const noaberkrachtSizeMd = "18px";
+export const noaberkrachtSizeLg = "24px";
+export const noaberkrachtSizeXl = "32px";
+export const noaberkrachtSize2xl = "48px";
+export const noaberkrachtSize3xl = "72px";
+export const noaberkrachtSize4xl = "96px";
+export const noaberkrachtTypographyGreycliffCfFontFamily = "OceanWide";
+export const noaberkrachtTypographySansSerifFontFamily = "\"Noto Sans\", Arial, sans-serif";
+export const noaberkrachtTypographyMonospaceFontFamily = "Monospace, \"Lucida Console\"";
+export const noaberkrachtTypographyFontWeightBold = "700";
+export const noaberkrachtTypographyFontWeightNormal = "400";
+export const noaberkrachtTypographyFontWeightLight = "100";
+export const noaberkrachtTypographyScale4xs = "8px";
+export const noaberkrachtTypographyScale3xs = "10x";
+export const noaberkrachtTypographyScale2xs = "12px";
+export const noaberkrachtTypographyScaleXs = "14px";
+export const noaberkrachtTypographyScaleSm = "18px";
+export const noaberkrachtTypographyScaleMd = "24px";
+export const noaberkrachtTypographyScaleLg = "36px";
+export const noaberkrachtTypographyScaleXl = "48px";
+export const noaberkrachtTypographyScale2xl = "60px";
+export const noaberkrachtTypographyScale3xl = "72px";
+export const noaberkrachtTypographyScale4xl = "84px";
+export const utrechtActionBusyCursor = "wait";
+export const utrechtActionDisabledCursor = "not-allowed";
+export const utrechtActionSubmitCursor = "pointer";
+export const utrechtSpaceBlock3xs = "2px";
+export const utrechtSpaceBlock2xs = "4px";
+export const utrechtSpaceBlockXs = "8px";
+export const utrechtSpaceBlockSm = "14px";
+export const utrechtSpaceBlockMd = "18px";
+export const utrechtSpaceBlockLg = "24px";
+export const utrechtSpaceBlockXl = "32px";
+export const utrechtSpaceBlock2xl = "48px";
+export const utrechtSpaceBlock3xl = "72px";
+export const utrechtSpaceInline3xs = "2px";
+export const utrechtSpaceInline2xs = "4px";
+export const utrechtSpaceInlineXs = "8px";
+export const utrechtSpaceInlineSm = "14px";
+export const utrechtSpaceInlineMd = "18px";
+export const utrechtSpaceInlineLg = "24px";
+export const utrechtSpaceInlineXl = "32px";
+export const utrechtSpaceInline2xl = "48px";
+export const utrechtSpaceInline3xl = "72px";
+export const utrechtAlertBackgroundColor = "#cce5ff";
+export const utrechtAlertColor = "#004085";
+export const utrechtAlertPaddingBlockStart = "24px";
+export const utrechtAlertPaddingBlockEnd = "24px";
+export const utrechtAlertPaddingInlineStart = "24px";
+export const utrechtAlertPaddingInlineEnd = "24px";
+export const utrechtAlertWarningBackgroundColor = "#fff3cd";
+export const utrechtAlertWarningColor = "#856404";
+export const utrechtAlertErrorBackgroundColor = "#f8d7da";
+export const utrechtAlertErrorColor = "#721c24";
+export const utrechtAlertOkBackgroundColor = "#d4edda";
+export const utrechtAlertOkColor = "#155724";
+export const utrechtAlertIconColor = "#004085";
+export const utrechtAlertIconErrorColor = "#721c24";
+export const utrechtAlertIconWarningColor = "#856404";
+export const utrechtAlertIconOkColor = "#155724";
+export const utrechtAlertIconGap = "8px";
+export const utrechtBlockquoteMarginInlineStart = "32px";
+export const utrechtBlockquoteMarginInlineEnd = "32px";
+export const utrechtBlockquoteContentColor = "#000000";
+export const utrechtBlockquoteContentFontSize = "24px";
+export const utrechtDocumentBackgroundColor = "#fafafa";
+export const utrechtDocumentColor = "#000000";
+export const utrechtDocumentFontFamily = "OceanWide";
+export const utrechtDocumentFontSize = "24px";
+export const utrechtPageFooterLogoMaxWidth = "150px";
+export const utrechtPageFooterBackgroundColor = "#f0b800";
+export const utrechtPageFooterBackgroundImage = "unset";
+export const utrechtPageFooterColor = "#ffffff";
+export const utrechtPageFooterPaddingInlineEnd = "14px";
+export const utrechtPageFooterPaddingInlineStart = "14px";
+export const utrechtPageFooterPaddingBlockEnd = "48px";
+export const utrechtPageFooterPaddingBlockStart = "48px";
+export const utrechtPageHeaderLogoMaxWidth = "130px";
+export const utrechtPageHeaderBackgroundColor = "#012c9d99";
+export const utrechtPageHeaderColor = "#ffffff";
+export const utrechtPageHeaderPaddingBlockStart = "14px";
+export const utrechtPageHeaderPaddingBlockEnd = "14px";
+export const utrechtPageMarginInlineStart = "24px";
+export const utrechtPageMarginInlineEnd = "24px";
+export const utrechtPageMaxInlineSize = "1140px";