@amsterdam/design-system-tokens 0.1.4 → 0.1.5

package/dist/variables.less

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Fri, 08 Sep 2023 12:12:55 GMT
+// Generated on Wed, 04 Oct 2023 10:51:08 GMT
 
 @utrecht-button-subtle-disabled-background-color: transparent;
 @utrecht-button-subtle-background-color: transparent;
@@ -18,6 +18,7 @@
 @amsterdam-unordered-list-item-margin-inline-start: 1.625rem; // Divide your total indentation width over margin and padding to position the marker.
 @amsterdam-unordered-list-list-style-type: '\2022';
 @amsterdam-unordered-list-gap: 0.75rem;
+@amsterdam-page-menu-item-hover-text-decoration: underline;
 @amsterdam-page-menu-item-text-decoration: none;
 @amsterdam-page-menu-item-gap: 0.5rem;
 @amsterdam-page-menu-row-gap: 0.5rem;
@@ -58,29 +59,29 @@
 @amsterdam-border-width-md: 2px;
 @amsterdam-border-width-sm: 1px;
 @amsterdam-typography-text-level-7-line-height: 1.6;
-@amsterdam-typography-text-level-7-wide-font-size: clamp(1.0625rem, 1.0625rem + (0.0625 * (100vw - 53.375rem)) / 36.625, 1.125rem);
-@amsterdam-typography-text-level-7-narrow-font-size: clamp(1rem, 1rem + (0.0625 * (100vw - 20rem)) / 33.3125, 1.0625rem);
+@amsterdam-typography-text-level-7-wide-font-size: clamp(1.0625rem, calc(1.0625rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.125rem);
+@amsterdam-typography-text-level-7-narrow-font-size: clamp(1rem, calc(1rem + (0.0625 * (100vw - 20rem)) / 33.3125), 1.0625rem);
 @amsterdam-typography-text-level-6-line-height: 1.6;
-@amsterdam-typography-text-level-6-wide-font-size: clamp(1.3125rem, 1.3125rem + (0.0625 * (100vw - 53.375rem)) / 36.625, 1.375rem);
-@amsterdam-typography-text-level-6-narrow-font-size: clamp(1.125rem, 1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125, 1.3125rem);
+@amsterdam-typography-text-level-6-wide-font-size: clamp(1.3125rem, calc(1.3125rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.375rem);
+@amsterdam-typography-text-level-6-narrow-font-size: clamp(1.125rem, calc(1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.3125rem);
 @amsterdam-typography-text-level-5-line-height: 1.5;
-@amsterdam-typography-text-level-5-wide-font-size: clamp(1.625rem, 1.625rem + (0.125 * (100vw - 53.375rem)) / 36.625, 1.75rem);
-@amsterdam-typography-text-level-5-narrow-font-size: clamp(1.375rem, 1.375rem + (0.25 * (100vw - 20rem)) / 33.3125, 1.625rem);
+@amsterdam-typography-text-level-5-wide-font-size: clamp(1.625rem, calc(1.625rem + (0.125 * (100vw - 53.375rem)) / 36.625), 1.75rem);
+@amsterdam-typography-text-level-5-narrow-font-size: clamp(1.375rem, calc(1.375rem + (0.25 * (100vw - 20rem)) / 33.3125), 1.625rem);
 @amsterdam-typography-text-level-4-line-height: 1.4;
-@amsterdam-typography-text-level-4-wide-font-size: clamp(1.4375rem, 1.4375rem + (0.125 * (100vw - 53.375rem)) / 36.625, 1.5625rem);
-@amsterdam-typography-text-level-4-narrow-font-size: clamp(1.25rem, 1.25rem + (0.1875 * (100vw - 20rem)) / 33.3125, 1.4375rem);
+@amsterdam-typography-text-level-4-wide-font-size: clamp(1.4375rem, calc(1.4375rem + (0.125 * (100vw - 53.375rem)) / 36.625), 1.5625rem);
+@amsterdam-typography-text-level-4-narrow-font-size: clamp(1.25rem, calc(1.25rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.4375rem);
 @amsterdam-typography-text-level-3-line-height: 1.4;
-@amsterdam-typography-text-level-3-wide-font-size: clamp(1.8125rem, 1.8125rem + (0.1875 * (100vw - 53.375rem)) / 36.625, 2rem);
-@amsterdam-typography-text-level-3-narrow-font-size: clamp(1.5rem, 1.5rem + (0.3125 * (100vw - 20rem)) / 33.3125, 1.8125rem);
+@amsterdam-typography-text-level-3-wide-font-size: clamp(1.8125rem, calc(1.8125rem + (0.1875 * (100vw - 53.375rem)) / 36.625), 2rem);
+@amsterdam-typography-text-level-3-narrow-font-size: clamp(1.5rem, calc(1.5rem + (0.3125 * (100vw - 20rem)) / 33.3125), 1.8125rem);
 @amsterdam-typography-text-level-2-line-height: 1.3;
-@amsterdam-typography-text-level-2-wide-font-size: clamp(2.25rem, 2.25rem + (0.25 * (100vw - 53.375rem)) / 36.625, 2.5rem);
-@amsterdam-typography-text-level-2-narrow-font-size: clamp(1.75rem, 1.75rem + (0.5 * (100vw - 20rem)) / 33.3125, 2.25rem);
+@amsterdam-typography-text-level-2-wide-font-size: clamp(2.25rem, calc(2.25rem + (0.25 * (100vw - 53.375rem)) / 36.625), 2.5rem);
+@amsterdam-typography-text-level-2-narrow-font-size: clamp(1.75rem, calc(1.75rem + (0.5 * (100vw - 20rem)) / 33.3125), 2.25rem);
 @amsterdam-typography-text-level-1-line-height: 1.2;
-@amsterdam-typography-text-level-1-wide-font-size: clamp(3rem, 3rem + (0.5 * (100vw - 53.375rem)) / 36.625, 3.5rem);
-@amsterdam-typography-text-level-1-narrow-font-size: clamp(2rem, 2rem + (1 * (100vw - 20rem)) / 33.3125, 3rem);
+@amsterdam-typography-text-level-1-wide-font-size: clamp(3rem, calc(3rem + (0.5 * (100vw - 53.375rem)) / 36.625), 3.5rem);
+@amsterdam-typography-text-level-1-narrow-font-size: clamp(2rem, calc(2rem + (1 * (100vw - 20rem)) / 33.3125), 3rem);
 @amsterdam-typography-text-level-0-line-height: 1.1;
-@amsterdam-typography-text-level-0-wide-font-size: clamp(4rem, 4rem + (1 * (100vw - 53.375rem)) / 36.625, 5rem);
-@amsterdam-typography-text-level-0-narrow-font-size: clamp(2rem, 2rem + (2 * (100vw - 20rem)) / 33.3125, 4rem);
+@amsterdam-typography-text-level-0-wide-font-size: clamp(4rem, calc(4rem + (1 * (100vw - 53.375rem)) / 36.625), 5rem);
+@amsterdam-typography-text-level-0-narrow-font-size: clamp(2rem, calc(2rem + (2 * (100vw - 20rem)) / 33.3125), 4rem);
 @amsterdam-typography-font-weight-bold: 800;
 @amsterdam-typography-font-weight-normal: 400;
 @amsterdam-typography-font-family: 'Amsterdam Sans', Arial, sans-serif;
@@ -157,7 +158,7 @@
 @amsterdam-paragraph-font-weight: 400;
 @amsterdam-paragraph-font-family: @amsterdam-typography-font-family;
 @amsterdam-paragraph-color: @amsterdam-color-primary-black;
-@amsterdam-page-menu-item-hover-color: @amsterdam-color-dark-blue;
+@amsterdam-page-menu-item-hover-color: @amsterdam-color-primary-black;
 @amsterdam-page-menu-item-wide-font-size: @amsterdam-typography-text-level-7-wide-font-size;
 @amsterdam-page-menu-item-narrow-font-size: @amsterdam-typography-text-level-7-narrow-font-size;
 @amsterdam-page-menu-item-line-height: @amsterdam-typography-text-level-7-line-height;

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.1.4",
+  "version": "0.1.5",
   "author": "Community for NL Design System",
   "description": "Design tokens for components for the City of Amsterdam based on the NL Design System architecture",
   "license": "SEE LICENSE IN LICENSE.md",
@@ -28,5 +28,5 @@
     "npm-run-all": "4.1.5",
     "style-dictionary": "3.8.0"
   },
-  "gitHead": "50bfbf67c103288ed6ba6713a6537252f0c25246"
+  "gitHead": "58764d2cd6d59d20fd0e3215f32461c6c580df1b"
 }

package/src/brand/amsterdam/typography.tokens.json

@@ -9,73 +9,85 @@
       "text-level": {
         "0": {
           "narrow": {
-            "font-size": { "value": "clamp(2rem, 2rem + (2 * (100vw - 20rem)) / 33.3125, 4rem)" }
+            "font-size": { "value": "clamp(2rem, calc(2rem + (2 * (100vw - 20rem)) / 33.3125), 4rem)" }
           },
           "wide": {
-            "font-size": { "value": "clamp(4rem, 4rem + (1 * (100vw - 53.375rem)) / 36.625, 5rem)" }
+            "font-size": { "value": "clamp(4rem, calc(4rem + (1 * (100vw - 53.375rem)) / 36.625), 5rem)" }
           },
           "line-height": { "value": "1.1" }
         },
         "1": {
           "narrow": {
-            "font-size": { "value": "clamp(2rem, 2rem + (1 * (100vw - 20rem)) / 33.3125, 3rem)" }
+            "font-size": { "value": "clamp(2rem, calc(2rem + (1 * (100vw - 20rem)) / 33.3125), 3rem)" }
           },
           "wide": {
-            "font-size": { "value": "clamp(3rem, 3rem + (0.5 * (100vw - 53.375rem)) / 36.625, 3.5rem)" }
+            "font-size": { "value": "clamp(3rem, calc(3rem + (0.5 * (100vw - 53.375rem)) / 36.625), 3.5rem)" }
           },
           "line-height": { "value": "1.2" }
         },
         "2": {
           "narrow": {
-            "font-size": { "value": "clamp(1.75rem, 1.75rem + (0.5 * (100vw - 20rem)) / 33.3125, 2.25rem)" }
+            "font-size": { "value": "clamp(1.75rem, calc(1.75rem + (0.5 * (100vw - 20rem)) / 33.3125), 2.25rem)" }
           },
           "wide": {
-            "font-size": { "value": "clamp(2.25rem, 2.25rem + (0.25 * (100vw - 53.375rem)) / 36.625, 2.5rem)" }
+            "font-size": { "value": "clamp(2.25rem, calc(2.25rem + (0.25 * (100vw - 53.375rem)) / 36.625), 2.5rem)" }
           },
           "line-height": { "value": "1.3" }
         },
         "3": {
           "narrow": {
-            "font-size": { "value": "clamp(1.5rem, 1.5rem + (0.3125 * (100vw - 20rem)) / 33.3125, 1.8125rem)" }
+            "font-size": { "value": "clamp(1.5rem, calc(1.5rem + (0.3125 * (100vw - 20rem)) / 33.3125), 1.8125rem)" }
           },
           "wide": {
-            "font-size": { "value": "clamp(1.8125rem, 1.8125rem + (0.1875 * (100vw - 53.375rem)) / 36.625, 2rem)" }
+            "font-size": {
+              "value": "clamp(1.8125rem, calc(1.8125rem + (0.1875 * (100vw - 53.375rem)) / 36.625), 2rem)"
+            }
           },
           "line-height": { "value": "1.4" }
         },
         "4": {
           "narrow": {
-            "font-size": { "value": "clamp(1.25rem, 1.25rem + (0.1875 * (100vw - 20rem)) / 33.3125, 1.4375rem)" }
+            "font-size": { "value": "clamp(1.25rem, calc(1.25rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.4375rem)" }
           },
           "wide": {
-            "font-size": { "value": "clamp(1.4375rem, 1.4375rem + (0.125 * (100vw - 53.375rem)) / 36.625, 1.5625rem)" }
+            "font-size": {
+              "value": "clamp(1.4375rem, calc(1.4375rem + (0.125 * (100vw - 53.375rem)) / 36.625), 1.5625rem)"
+            }
           },
           "line-height": { "value": "1.4" }
         },
         "5": {
           "narrow": {
-            "font-size": { "value": "clamp(1.375rem, 1.375rem + (0.25 * (100vw - 20rem)) / 33.3125, 1.625rem)" }
+            "font-size": { "value": "clamp(1.375rem, calc(1.375rem + (0.25 * (100vw - 20rem)) / 33.3125), 1.625rem)" }
           },
           "wide": {
-            "font-size": { "value": "clamp(1.625rem, 1.625rem + (0.125 * (100vw - 53.375rem)) / 36.625, 1.75rem)" }
+            "font-size": {
+              "value": "clamp(1.625rem, calc(1.625rem + (0.125 * (100vw - 53.375rem)) / 36.625), 1.75rem)"
+            }
           },
           "line-height": { "value": "1.5" }
         },
         "6": {
           "narrow": {
-            "font-size": { "value": "clamp(1.125rem, 1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125, 1.3125rem)" }
+            "font-size": {
+              "value": "clamp(1.125rem, calc(1.125rem + (0.1875 * (100vw - 20rem)) / 33.3125), 1.3125rem)"
+            }
           },
           "wide": {
-            "font-size": { "value": "clamp(1.3125rem, 1.3125rem + (0.0625 * (100vw - 53.375rem)) / 36.625, 1.375rem)" }
+            "font-size": {
+              "value": "clamp(1.3125rem, calc(1.3125rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.375rem)"
+            }
           },
           "line-height": { "value": "1.6" }
         },
         "7": {
           "narrow": {
-            "font-size": { "value": "clamp(1rem, 1rem + (0.0625 * (100vw - 20rem)) / 33.3125, 1.0625rem)" }
+            "font-size": { "value": "clamp(1rem, calc(1rem + (0.0625 * (100vw - 20rem)) / 33.3125), 1.0625rem)" }
           },
           "wide": {
-            "font-size": { "value": "clamp(1.0625rem, 1.0625rem + (0.0625 * (100vw - 53.375rem)) / 36.625, 1.125rem)" }
+            "font-size": {
+              "value": "clamp(1.0625rem, calc(1.0625rem + (0.0625 * (100vw - 53.375rem)) / 36.625), 1.125rem)"
+            }
           },
           "line-height": { "value": "1.6" }
         }

package/src/components/amsterdam/page-menu.tokens.json

@@ -17,7 +17,8 @@
           "font-size": { "value": "{amsterdam.typography.text-level.7.wide.font-size}" }
         },
         "hover": {
-          "color": { "value": "{amsterdam.color.dark-blue}" }
+          "color": { "value": "{amsterdam.color.primary-black}" },
+          "text-decoration": { "value": "underline" }
         }
       }
     }