@amsterdam/design-system-tokens 0.13.0 → 0.15.0

package/src/components/ams/file-list.tokens.json

@@ -0,0 +1,21 @@
+{
+  "ams": {
+    "file-list": {
+      "gap": { "value": "{ams.space.m}" },
+      "padding-block": { "value": "{ams.space.m}" },
+      "file": {
+        "font-family": { "value": "{ams.typography.font-family}" },
+        "font-size": { "value": "{ams.typography.body-text.small.font-size}" },
+        "font-weight": { "value": "{ams.typography.body-text.font-weight}" },
+        "gap": { "value": "{ams.space.s}" },
+        "line-height": { "value": "{ams.typography.body-text.small.line-height}" },
+        "details": {
+          "color": { "value": "{ams.color.text.secondary}" }
+        },
+        "preview": {
+          "width": { "value": "clamp(2.5rem, 10vw, 5rem)" }
+        }
+      }
+    }
+  }
+}

package/src/components/ams/footer.tokens.json

@@ -0,0 +1,30 @@
+{
+  "ams": {
+    "footer": {
+      "menu": {
+        "column-gap": { "value": "{ams.space.l}" },
+        "padding-block": { "value": "{ams.space.l}" },
+        "padding-inline": { "value": "{ams.grid.padding-inline}" },
+        "row-gap": { "value": "{ams.space.xs}" },
+        "link": {
+          "color": { "value": "{ams.links.color}" },
+          "font-family": { "value": "{ams.typography.font-family}" },
+          "font-size": { "value": "{ams.typography.body-text.small.font-size}" },
+          "font-weight": { "value": "{ams.typography.body-text.font-weight}" },
+          "line-height": { "value": "{ams.typography.body-text.small.line-height}" },
+          "outline-offset": { "value": "{ams.focus.outline-offset}" },
+          "text-decoration-line": { "value": "{ams.links.subtle.text-decoration-line}" },
+          "text-decoration-thickness": { "value": "{ams.links.text-decoration-thickness}" },
+          "text-underline-offset": { "value": "{ams.links.text-underline-offset}" },
+          "hover": {
+            "color": { "value": "{ams.links.hover.color}" },
+            "text-decoration-line": { "value": "{ams.links.subtle.hover.text-decoration-line}" }
+          }
+        }
+      },
+      "spotlight": {
+        "background-color": { "value": "#004699" }
+      }
+    }
+  }
+}

package/src/components/ams/grid.compact.tokens.json

@@ -1,7 +1,7 @@
 {
   "ams": {
     "grid": {
-      "padding-inline": { "value": "{ams.space.grid.md}" }
+      "padding-inline": { "value": "{ams.space.xl}" }
     }
   }
 }

package/src/components/ams/grid.tokens.json

@@ -2,23 +2,25 @@
   "ams": {
     "grid": {
       "column-count": { "value": "4" },
-      "column-gap": { "value": "{ams.space.grid.md}" },
+      "column-gap": { "value": "{ams.space.xl}" },
       "padding-block": {
-        "sm": { "value": "{ams.space.grid.sm}" },
-        "md": { "value": "{ams.space.grid.md}" },
-        "lg": { "value": "{ams.space.grid.lg}" }
+        "s": { "value": "{ams.space.l}" },
+        "m": { "value": "{ams.space.xl}" },
+        "l": { "value": "{ams.space.2xl}" }
       },
-      "padding-inline": { "value": "{ams.space.grid.lg}" },
+      "padding-inline": { "value": "{ams.space.l}" },
       "row-gap": {
-        "sm": { "value": "{ams.space.grid.sm}" },
-        "md": { "value": "{ams.space.grid.md}" },
-        "lg": { "value": "{ams.space.grid.lg}" }
+        "s": { "value": "{ams.space.l}" },
+        "m": { "value": "{ams.space.xl}" },
+        "l": { "value": "{ams.space.2xl}" }
       },
       "medium": {
-        "column-count": { "value": "8" }
+        "column-count": { "value": "8" },
+        "padding-inline": { "value": "{ams.space.xl}" }
       },
       "wide": {
-        "column-count": { "value": "12" }
+        "column-count": { "value": "12" },
+        "padding-inline": { "value": "{ams.space.2xl}" }
       }
     }
   }

package/src/components/ams/header.tokens.json

@@ -1,13 +1,59 @@
 {
   "ams": {
     "header": {
-      "column-gap": {
-        "value": "{ams.space.grid.md}",
-        "comment": "Must have the same value as `ams.grid.column-gap`."
+      "font-family": { "value": "{ams.typography.font-family}" },
+      "padding-block": { "value": "{ams.space.l}" },
+      "padding-inline": {
+        "value": "{ams.grid.padding-inline}",
+        "comment": "Must be the Grid inline padding, to make sure Header and Grid line up"
       },
-      "padding-block": { "value": "{ams.space.md}" },
       "logo-link": {
+        "column-gap": { "value": "{ams.space.m}" },
         "outline-offset": { "value": "{ams.focus.outline-offset}" }
+      },
+      "brand-name": {
+        "color": { "value": "{ams.color.text.default}" },
+        "font-size": { "value": "{ams.typography.heading.4.font-size}" },
+        "font-weight": { "value": "{ams.typography.heading.font-weight}" }
+      },
+      "mega-menu": {
+        "button": {
+          "cursor": { "value": "{ams.cursor.interactive}" },
+          "label": {
+            "open": {
+              "font-weight": { "value": "{ams.typography.body-text.bold.font-weight}" }
+            }
+          }
+        }
+      },
+      "menu": {
+        "column-gap": { "value": "{ams.space.l}" },
+        "row-gap": { "value": "{ams.space.xs}" },
+        "item": {
+          "color": { "value": "{ams.links.color}" },
+          "column-gap": { "value": "{ams.space.xs}" },
+          "font-family": { "value": "{ams.typography.font-family}" },
+          "font-size": { "value": "{ams.typography.body-text.font-size}" },
+          "font-weight": { "value": "{ams.typography.body-text.font-weight}" },
+          "line-height": { "value": "{ams.typography.body-text.line-height}" },
+          "outline-offset": { "value": "{ams.focus.outline-offset}" },
+          "padding-block": { "value": "{ams.space.xs}" },
+          "hover": {
+            "color": { "value": "{ams.links.hover.color}" }
+          }
+        },
+        "link": {
+          "text-decoration-line": { "value": "{ams.links.subtle.text-decoration-line}" },
+          "text-decoration-thickness": { "value": "{ams.links.text-decoration-thickness}" },
+          "text-underline-offset": { "value": "{ams.links.text-underline-offset}" },
+          "hover": {
+            "text-decoration-line": { "value": "{ams.links.subtle.hover.text-decoration-line}" }
+          }
+        }
+      },
+      "navigation": {
+        "column-gap": { "value": "{ams.space.l}" },
+        "row-gap": { "value": "{ams.space.s}" }
       }
     }
   }

package/src/components/ams/heading.tokens.json

@@ -1,35 +1,35 @@
 {
   "ams": {
     "heading": {
-      "color": { "value": "{ams.color.primary-black}" },
-      "font-family": { "value": "{ams.text.font-family}" },
-      "font-weight": { "value": "{ams.text.font-weight.bold}" },
-      "inverse-color": { "value": "{ams.color.primary-white}" },
-      "level": {
-        "1": {
-          "font-size": { "value": "{ams.text.level.1.font-size}" },
-          "line-height": { "value": "{ams.text.level.1.line-height}" }
-        },
-        "2": {
-          "font-size": { "value": "{ams.text.level.2.font-size}" },
-          "line-height": { "value": "{ams.text.level.2.line-height}" }
-        },
-        "3": {
-          "font-size": { "value": "{ams.text.level.3.font-size}" },
-          "line-height": { "value": "{ams.text.level.3.line-height}" }
-        },
-        "4": {
-          "font-size": { "value": "{ams.text.level.4.font-size}" },
-          "line-height": { "value": "{ams.text.level.4.line-height}" }
-        },
-        "5": {
-          "font-size": { "value": "{ams.text.level.5.font-size}" },
-          "line-height": { "value": "{ams.text.level.5.line-height}" }
-        },
-        "6": {
-          "font-size": { "value": "{ams.text.level.6.font-size}" },
-          "line-height": { "value": "{ams.text.level.6.line-height}" }
-        }
+      "color": { "value": "{ams.color.text.default}" },
+      "font-family": { "value": "{ams.typography.font-family}" },
+      "font-weight": { "value": "{ams.typography.heading.font-weight}" },
+      "inverse": {
+        "color": { "value": "{ams.color.text.inverse}" }
+      },
+      "1": {
+        "font-size": { "value": "{ams.typography.heading.1.font-size}" },
+        "line-height": { "value": "{ams.typography.heading.1.line-height}" }
+      },
+      "2": {
+        "font-size": { "value": "{ams.typography.heading.2.font-size}" },
+        "line-height": { "value": "{ams.typography.heading.2.line-height}" }
+      },
+      "3": {
+        "font-size": { "value": "{ams.typography.heading.3.font-size}" },
+        "line-height": { "value": "{ams.typography.heading.3.line-height}" }
+      },
+      "4": {
+        "font-size": { "value": "{ams.typography.heading.4.font-size}" },
+        "line-height": { "value": "{ams.typography.heading.4.line-height}" }
+      },
+      "5": {
+        "font-size": { "value": "{ams.typography.heading.5.font-size}" },
+        "line-height": { "value": "{ams.typography.heading.5.line-height}" }
+      },
+      "6": {
+        "font-size": { "value": "{ams.typography.heading.6.font-size}" },
+        "line-height": { "value": "{ams.typography.heading.6.line-height}" }
       }
     }
   }

package/src/components/ams/hint.tokens.json

@@ -1,7 +1,7 @@
 {
   "ams": {
     "hint": {
-      "color": { "value": "{ams.color.neutral-grey3}" }
+      "color": { "value": "{ams.color.text.secondary}" }
     }
   }
 }

package/src/components/ams/icon-button.tokens.json

@@ -1,35 +1,37 @@
 {
   "ams": {
     "icon-button": {
-      "color": { "value": "{ams.color.primary-blue}" },
+      "color": { "value": "{ams.color.interactive.default}" },
+      "cursor": { "value": "{ams.cursor.interactive}" },
       "outline-offset": { "value": "{ams.focus.outline-offset}" },
       "hover": {
-        "background-color": { "value": "rgba(0, 70, 153, 0.125)" },
-        "color": { "value": "{ams.color.dark-blue}" }
+        "background-color": { "value": "rgb(0 70 153 / 12.5%)" },
+        "color": { "value": "{ams.color.interactive.hover}" }
       },
       "disabled": {
-        "color": { "value": "{ams.color.neutral-grey2}" }
+        "color": { "value": "{ams.color.interactive.disabled}" },
+        "cursor": { "value": "{ams.cursor.disabled}" }
       },
-      "contrast-color": {
-        "color": { "value": "{ams.color.primary-black}" },
+      "contrast": {
+        "color": { "value": "{ams.color.interactive.contrast}" },
         "hover": {
-          "background-color": { "value": "rgba(0, 0, 0, 0.125)" },
-          "color": { "value": "{ams.color.primary-black}" }
+          "background-color": { "value": "rgb(0 0 0 / 12.5%)" },
+          "color": { "value": "{ams.color.interactive.contrast}" }
         },
         "disabled": {
-          "color": { "value": "{ams.color.neutral-grey2}" }
+          "color": { "value": "{ams.color.interactive.disabled}" }
         }
       },
-      "inverse-color": {
-        "background-color": { "value": "{ams.color.primary-blue}" },
-        "color": { "value": "{ams.color.primary-white}" },
+      "inverse": {
+        "background-color": { "value": "{ams.color.interactive.default}" },
+        "color": { "value": "{ams.color.interactive.inverse}" },
         "hover": {
-          "background-color": { "value": "{ams.color.dark-blue}" },
-          "color": { "value": "{ams.color.primary-white}" }
+          "background-color": { "value": "{ams.color.interactive.hover}" },
+          "color": { "value": "{ams.color.interactive.inverse}" }
         },
         "disabled": {
-          "color": { "value": "{ams.color.primary-white}" },
-          "background-color": { "value": "{ams.color.neutral-grey2}" }
+          "color": { "value": "{ams.color.interactive.inverse}" },
+          "background-color": { "value": "{ams.color.interactive.disabled}" }
         }
       }
     }

package/src/components/ams/icon.tokens.json

@@ -1,21 +1,34 @@
 {
   "ams": {
     "icon": {
-      "size-3": {
-        "font-size": { "value": "{ams.text.level.3.font-size}" },
-        "line-height": { "value": "{ams.text.level.3.line-height}" }
+      "font-size": { "value": "{ams.typography.body-text.font-size}" },
+      "line-height": { "value": "{ams.typography.body-text.line-height}" },
+      "small": {
+        "font-size": { "value": "{ams.typography.body-text.small.font-size}" },
+        "line-height": { "value": "{ams.typography.body-text.small.line-height}" }
       },
-      "size-4": {
-        "font-size": { "value": "{ams.text.level.4.font-size}" },
-        "line-height": { "value": "{ams.text.level.4.line-height}" }
+      "large": {
+        "font-size": { "value": "{ams.typography.body-text.large.font-size}" },
+        "line-height": { "value": "{ams.typography.body-text.large.line-height}" }
       },
-      "size-5": {
-        "font-size": { "value": "{ams.text.level.5.font-size}" },
-        "line-height": { "value": "{ams.text.level.5.line-height}" }
+      "heading-3": {
+        "font-size": { "value": "{ams.typography.heading.3.font-size}" },
+        "line-height": { "value": "{ams.typography.heading.3.line-height}" }
       },
-      "size-6": {
-        "font-size": { "value": "{ams.text.level.6.font-size}" },
-        "line-height": { "value": "{ams.text.level.6.line-height}" }
+      "heading-4": {
+        "font-size": { "value": "{ams.typography.heading.4.font-size}" },
+        "line-height": { "value": "{ams.typography.heading.4.line-height}" }
+      },
+      "heading-5": {
+        "font-size": { "value": "{ams.typography.heading.5.font-size}" },
+        "line-height": { "value": "{ams.typography.heading.5.line-height}" }
+      },
+      "heading-6": {
+        "font-size": { "value": "{ams.typography.heading.6.font-size}" },
+        "line-height": { "value": "{ams.typography.heading.6.line-height}" }
+      },
+      "inverse": {
+        "color": { "value": "{ams.color.text.inverse}" }
       }
     }
   }

package/src/components/ams/image-slider.tokens.json

@@ -10,7 +10,7 @@
         "gap": { "value": "{ams.space.xs}" },
         "thumbnail": {
           "background-color": { "value": "transparent" },
-          "cursor": { "value": "{ams.action.activate.cursor}" },
+          "cursor": { "value": "{ams.cursor.interactive}" },
           "opacity": { "value": "40%" },
           "outline-offset": { "value": "{ams.focus.outline-offset}" },
           "in-view": {

package/src/components/ams/image.tokens.json

@@ -0,0 +1,7 @@
+{
+  "ams": {
+    "image": {
+      "aspect-ratio": { "value": "{ams.aspect-ratio.16-9}" }
+    }
+  }
+}

package/src/components/ams/{form-error-list.tokens.json → invalid-form-alert.tokens.json}

@@ -1,6 +1,6 @@
 {
   "ams": {
-    "form-error-list": {
+    "invalid-form-alert": {
       "outline-offset": { "value": "{ams.focus.outline-offset}" }
     }
   }

package/src/components/ams/label.tokens.json

@@ -1,11 +1,11 @@
 {
   "ams": {
     "label": {
-      "color": { "value": "{ams.color.primary-black}" },
-      "font-family": { "value": "{ams.text.font-family}" },
-      "font-size": { "value": "{ams.text.level.4.font-size}" },
-      "font-weight": { "value": "{ams.text.font-weight.bold}" },
-      "line-height": { "value": "{ams.text.level.4.line-height}" }
+      "color": { "value": "{ams.color.text.default}" },
+      "font-family": { "value": "{ams.typography.font-family}" },
+      "font-size": { "value": "{ams.typography.heading.4.font-size}" },
+      "font-weight": { "value": "{ams.typography.heading.font-weight}" },
+      "line-height": { "value": "{ams.typography.heading.4.line-height}" }
     }
   }
 }

package/src/components/ams/link-list.tokens.json

@@ -1,40 +1,40 @@
 {
   "ams": {
     "link-list": {
-      "gap": { "value": "{ams.space.sm}" },
+      "gap": { "value": "{ams.space.s}" },
       "link": {
-        "color": { "value": "{ams.link-appearance.color}" },
-        "font-family": { "value": "{ams.text.font-family}" },
-        "font-size": { "value": "{ams.text.level.5.font-size}" },
-        "font-weight": { "value": "{ams.text.font-weight.normal}" },
-        "gap": { "value": "{ams.space.sm}" },
-        "line-height": { "value": "{ams.text.level.5.line-height}" },
+        "color": { "value": "{ams.links.color}" },
+        "font-family": { "value": "{ams.typography.font-family}" },
+        "font-size": { "value": "{ams.typography.body-text.font-size}" },
+        "font-weight": { "value": "{ams.typography.body-text.font-weight}" },
+        "gap": { "value": "{ams.space.s}" },
+        "line-height": { "value": "{ams.typography.body-text.line-height}" },
         "outline-offset": { "value": "{ams.focus.outline-offset}" },
-        "text-decoration-line": { "value": "{ams.link-appearance.subtle.text-decoration-line}" },
-        "text-decoration-thickness": { "value": "{ams.link-appearance.text-decoration-thickness}" },
-        "text-underline-offset": { "value": "{ams.link-appearance.text-underline-offset}" },
+        "text-decoration-line": { "value": "{ams.links.subtle.text-decoration-line}" },
+        "text-decoration-thickness": { "value": "{ams.links.text-decoration-thickness}" },
+        "text-underline-offset": { "value": "{ams.links.text-underline-offset}" },
         "small": {
-          "font-size": { "value": "{ams.text.level.6.font-size}" },
-          "line-height": { "value": "{ams.text.level.6.line-height}" }
+          "font-size": { "value": "{ams.typography.body-text.small.font-size}" },
+          "line-height": { "value": "{ams.typography.body-text.small.line-height}" }
         },
         "large": {
-          "font-size": { "value": "{ams.text.level.4.font-size}" },
-          "line-height": { "value": "{ams.text.level.4.line-height}" }
+          "font-size": { "value": "{ams.typography.body-text.large.font-size}" },
+          "line-height": { "value": "{ams.typography.body-text.large.line-height}" }
         },
         "hover": {
-          "color": { "value": "{ams.link-appearance.hover.color}" },
-          "text-decoration-line": { "value": "{ams.link-appearance.subtle.hover.text-decoration-line}" }
+          "color": { "value": "{ams.links.hover.color}" },
+          "text-decoration-line": { "value": "{ams.links.subtle.hover.text-decoration-line}" }
         },
-        "contrast-color": {
-          "color": { "value": "{ams.link-appearance.contrast.color}" },
+        "contrast": {
+          "color": { "value": "{ams.links.contrast.color}" },
           "hover": {
-            "color": { "value": "{ams.link-appearance.contrast.hover.color}" }
+            "color": { "value": "{ams.links.contrast.hover.color}" }
           }
         },
-        "inverse-color": {
-          "color": { "value": "{ams.link-appearance.inverse.color}" },
+        "inverse": {
+          "color": { "value": "{ams.links.inverse.color}" },
           "hover": {
-            "color": { "value": "{ams.link-appearance.inverse.hover.color}" }
+            "color": { "value": "{ams.links.inverse.hover.color}" }
           }
         }
       }

package/src/components/ams/link.tokens.json

@@ -1,59 +1,48 @@
 {
   "ams": {
     "link": {
-      "color": { "value": "{ams.link-appearance.color}" },
-      "font-family": { "value": "{ams.text.font-family}" },
-      "font-weight": { "value": "{ams.text.font-weight.normal}" },
+      "color": { "value": "{ams.links.color}" },
+      "font-family": { "value": "{ams.typography.font-family}" },
+      "font-weight": { "value": "{ams.typography.body-text.font-weight}" },
       "outline-offset": { "value": "{ams.focus.outline-offset}" },
       "hover": {
-        "color": { "value": "{ams.link-appearance.hover.color}" }
+        "color": { "value": "{ams.links.hover.color}" }
       },
       "inline": {
-        "text-decoration-line": { "value": "{ams.link-appearance.regular.text-decoration-line}" },
-        "text-decoration-thickness": { "value": "{ams.link-appearance.text-decoration-thickness}" },
-        "text-underline-offset": { "value": "{ams.link-appearance.text-underline-offset}" },
+        "text-decoration-thickness": { "value": "{ams.links.text-decoration-thickness}" },
+        "text-underline-offset": { "value": "{ams.links.text-underline-offset}" },
         "font-family": { "value": "inherit" },
         "font-size": { "value": "inherit" },
         "line-height": { "value": "inherit" },
         "hover": {
           "text-decoration-thickness": {
-            "value": "{ams.link-appearance.regular.hover.text-decoration-thickness}"
+            "value": "{ams.links.hover.text-decoration-thickness}"
           },
-          "text-underline-offset": { "value": "{ams.link-appearance.regular.hover.text-underline-offset}" }
-        },
-        "visited": {
-          "color": { "value": "{ams.color.purple}" }
+          "text-underline-offset": { "value": "{ams.links.hover.text-underline-offset}" }
         }
       },
       "standalone": {
-        "font-size": { "value": "{ams.text.level.5.font-size}" },
-        "line-height": { "value": "{ams.text.level.5.line-height}" },
-        "text-decoration-line": { "value": "{ams.link-appearance.regular.text-decoration-line}" },
-        "text-decoration-thickness": { "value": "{ams.link-appearance.text-decoration-thickness}" },
-        "text-underline-offset": { "value": "{ams.link-appearance.text-underline-offset}" },
+        "font-size": { "value": "{ams.typography.body-text.font-size}" },
+        "line-height": { "value": "{ams.typography.body-text.line-height}" },
+        "text-decoration-thickness": { "value": "{ams.links.text-decoration-thickness}" },
+        "text-underline-offset": { "value": "{ams.links.text-underline-offset}" },
         "hover": {
           "text-decoration-thickness": {
-            "value": "{ams.link-appearance.regular.hover.text-decoration-thickness}"
+            "value": "{ams.links.hover.text-decoration-thickness}"
           },
-          "text-underline-offset": { "value": "{ams.link-appearance.regular.hover.text-underline-offset}" }
+          "text-underline-offset": { "value": "{ams.links.hover.text-underline-offset}" }
         }
       },
-      "contrast-color": {
-        "color": { "value": "{ams.link-appearance.contrast.color}" },
+      "contrast": {
+        "color": { "value": "{ams.links.contrast.color}" },
         "hover": {
-          "color": { "value": "{ams.link-appearance.contrast.hover.color}" }
-        },
-        "visited": {
-          "color": { "value": "{ams.link-appearance.contrast.visited.color}" }
+          "color": { "value": "{ams.links.contrast.hover.color}" }
         }
       },
-      "inverse-color": {
-        "color": { "value": "{ams.link-appearance.inverse.color}" },
+      "inverse": {
+        "color": { "value": "{ams.links.inverse.color}" },
         "hover": {
-          "color": { "value": "{ams.link-appearance.inverse.hover.color}" }
-        },
-        "visited": {
-          "color": { "value": "{ams.link-appearance.inverse.visited.color}" }
+          "color": { "value": "{ams.links.inverse.hover.color}" }
         }
       }
     }

package/src/components/ams/logo.tokens.json

@@ -1,10 +1,17 @@
 {
   "ams": {
     "logo": {
-      "block-size": { "value": "2.5rem" },
-      "emblem": { "color": { "value": "{ams.color.primary-red}" } },
-      "title": { "color": { "value": "{ams.color.primary-red}" } },
-      "subsite": { "color": { "value": "{ams.color.primary-black}" } }
+      "block-size": { "value": "{ams.space.xl}" },
+      "min-block-size": { "value": "2.5rem" },
+      "emblem": {
+        "color": { "value": "#ec0000" }
+      },
+      "subsite": {
+        "color": { "value": "{ams.color.text.default}" }
+      },
+      "title": {
+        "color": { "value": "#ec0000" }
+      }
     }
   }
 }

package/src/components/ams/mark.tokens.json

@@ -1,7 +1,7 @@
 {
   "ams": {
     "mark": {
-      "background-color": { "value": "{ams.color.yellow}" }
+      "background-color": { "value": "{ams.color.highlight.yellow}" }
     }
   }
 }

package/src/components/ams/mega-menu.tokens.json

@@ -3,13 +3,13 @@
     "mega-menu": {
       "list-category": {
         "column-gap": {
-          "value": "{ams.space.grid.md}",
+          "value": "{ams.space.xl}",
           "comment": "Must have the same value as `ams.grid.column-gap`."
         },
         "column-width": { "value": "20rem" },
-        "padding-block-start": { "value": "{ams.space.md}" },
+        "padding-block-start": { "value": "{ams.space.m}" },
         "padding-block-end": {
-          "value": "{ams.space.grid.md}",
+          "value": "{ams.space.xl}",
           "comment": "Must have the same value as `ams.grid.row-gap.md`."
         }
       }