From 7c365d66b69108f154db2e5eb46400a7537714d6 Mon Sep 17 00:00:00 2001 From: Vincent Smedinga Date: Fri, 22 Nov 2024 00:36:54 +0100 Subject: [PATCH 1/7] Introduce actually primitive brand typography tokens --- .../src/brand/ams/typography.tokens.json | 39 +++++++++++++++++++ 1 file changed, 39 insertions(+) create mode 100644 proprietary/tokens/src/brand/ams/typography.tokens.json diff --git a/proprietary/tokens/src/brand/ams/typography.tokens.json b/proprietary/tokens/src/brand/ams/typography.tokens.json new file mode 100644 index 0000000000..9a093e6eaa --- /dev/null +++ b/proprietary/tokens/src/brand/ams/typography.tokens.json @@ -0,0 +1,39 @@ +{ + "ams": { + "brand": { + "typography": { + "font-family": { + "body-text": { "value": "'Amsterdam Sans', Arial, sans-serif" }, + "headings": { "value": "'Amsterdam Sans', Arial, sans-serif" }, + "monospace": { "value": "monospace" } + }, + "font-size": { + "sm": { "value": "clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)" }, + "md": { "value": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)" }, + "lg": { "value": "clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)" }, + "xl": { "value": "clamp(1.5313rem, calc(1.3281rem + 1.0156vw), 2.3438rem)" }, + "2xl": { "value": "clamp(1.7865rem, calc(1.5007rem + 1.429vw), 2.9297rem)" }, + "3xl": { "value": "clamp(2.0842rem, calc(1.6897rem + 1.9724vw), 3.6621rem)" }, + "4xl": { "value": "clamp(2.4316rem, calc(1.8951rem + 2.6826vw), 4.5776rem)" } + }, + "font-weight": { + "light": { "value": 300 }, + "normal": { "value": 400 }, + "bold": { "value": 700 }, + "x-bold": { "value": 800 } + }, + "line-height": { + "5xs": { "value": "113.86%" }, + "4xs": { "value": "117.54%" }, + "3xs": { "value": "121.33%" }, + "2xs": { "value": "125.24%" }, + "xs": { "value": "129.28%" }, + "sm": { "value": "133.45%" }, + "md": { "value": "137.76%" }, + "2xl": { "value": "151.52%" }, + "5xl": { "value": "166.67%" } + } + } + } + } +} From e0c3640f7f5293be3b3c2435dba1fcf18abae237 Mon Sep 17 00:00:00 2001 From: Vincent Smedinga Date: Fri, 22 Nov 2024 00:37:52 +0100 Subject: [PATCH 2/7] Model heading and body scales in common tokens --- .../src/common/ams/typography.tokens.json | 61 +++++++++++++++++++ 1 file changed, 61 insertions(+) create mode 100644 proprietary/tokens/src/common/ams/typography.tokens.json diff --git a/proprietary/tokens/src/common/ams/typography.tokens.json b/proprietary/tokens/src/common/ams/typography.tokens.json new file mode 100644 index 0000000000..f3e0bf8cc4 --- /dev/null +++ b/proprietary/tokens/src/common/ams/typography.tokens.json @@ -0,0 +1,61 @@ +{ + "ams": { + "common": { + "typography": { + "body-text": { + "font-family": { "value": "{ams.brand.typography.font-family.body-text}" }, + "font-size": { "value": "{ams.brand.typography.font-size.md}" }, + "font-weight": { "value": "{ams.brand.typography.font-weight.normal}" }, + "line-height": { "value": "{ams.brand.typography.line-height.5xl}" }, + "sm": { + "font-size": { "value": "{ams.brand.typography.font-size.sm}" }, + "line-height": { "value": "{ams.brand.typography.line-height.2xl}" } + }, + "lg": { + "font-size": { "value": "{ams.brand.typography.font-size.lg}" }, + "line-height": { "value": "{ams.brand.typography.line-height.2xl}" } + }, + "xl": { + "font-size": { "value": "{ams.brand.typography.font-size.xl}" }, + "line-height": { "value": "{ams.brand.typography.line-height.md}" } + } + }, + "bold": { + "font-weight": { "value": "{ams.brand.typography.font-weight.bold}" } + }, + "headings": { + "font-family": { "value": "{ams.brand.typography.font-family.headings}" }, + "font-weight": { "value": "{ams.brand.typography.font-weight.x-bold}" }, + "level-0": { + "font-size": { "value": "{ams.brand.typography.font-size.4xl}" }, + "line-height": { "value": "{ams.brand.typography.line-height.5xs}" } + }, + "level-1": { + "font-size": { "value": "{ams.brand.typography.font-size.3xl}" }, + "line-height": { "value": "{ams.brand.typography.line-height.4xs}" } + }, + "level-2": { + "font-size": { "value": "{ams.brand.typography.font-size.2xl}" }, + "line-height": { "value": "{ams.brand.typography.line-height.3xs}" } + }, + "level-3": { + "font-size": { "value": "{ams.brand.typography.font-size.xl}" }, + "line-height": { "value": "{ams.brand.typography.line-height.2xs}" } + }, + "level-4": { + "font-size": { "value": "{ams.brand.typography.font-size.lg}" }, + "line-height": { "value": "{ams.brand.typography.line-height.xs}" } + }, + "level-5": { + "font-size": { "value": "{ams.brand.typography.font-size.md}" }, + "line-height": { "value": "{ams.brand.typography.line-height.sm}" } + }, + "level-6": { + "font-size": { "value": "{ams.brand.typography.font-size.sm}" }, + "line-height": { "value": "{ams.brand.typography.line-height.md}" } + } + } + } + } + } +} From ff36227a03fb75fd47b70c9970c064d36242c547 Mon Sep 17 00:00:00 2001 From: Vincent Smedinga Date: Fri, 22 Nov 2024 00:38:08 +0100 Subject: [PATCH 3/7] Apply new typography tokens to all components --- .../src/components/ams/accordion.tokens.json | 8 +-- .../src/components/ams/avatar.tokens.json | 8 +-- .../src/components/ams/badge.tokens.json | 10 ++-- .../src/components/ams/blockquote.tokens.json | 10 ++-- .../src/components/ams/breadcrumb.tokens.json | 8 +-- .../src/components/ams/button.tokens.json | 6 +-- .../ams/character-count.tokens.json | 8 +-- .../src/components/ams/checkbox.tokens.json | 8 +-- .../src/components/ams/date-input.tokens.json | 8 +-- .../ams/description-list.tokens.json | 10 ++-- .../components/ams/error-message.tokens.json | 8 +-- .../src/components/ams/field-set.tokens.json | 8 +-- .../src/components/ams/file-input.tokens.json | 8 +-- .../src/components/ams/heading.tokens.json | 52 +++++++++---------- .../src/components/ams/icon.tokens.json | 16 +++--- .../src/components/ams/label.tokens.json | 8 +-- .../src/components/ams/link-list.tokens.json | 16 +++--- .../src/components/ams/link.tokens.json | 8 +-- .../components/ams/ordered-list.tokens.json | 12 ++--- .../components/ams/page-heading.tokens.json | 8 +-- .../src/components/ams/page-menu.tokens.json | 8 +-- .../src/components/ams/pagination.tokens.json | 10 ++-- .../src/components/ams/paragraph.tokens.json | 16 +++--- .../components/ams/password-input.tokens.json | 8 +-- .../src/components/ams/radio.tokens.json | 8 +-- .../components/ams/search-field.tokens.json | 12 ++--- .../src/components/ams/select.tokens.json | 8 +-- .../src/components/ams/skip-link.tokens.json | 8 +-- .../src/components/ams/switch.tokens.json | 2 +- .../ams/table-of-contents.tokens.json | 14 ++--- .../src/components/ams/table.tokens.json | 12 ++--- .../src/components/ams/tabs.tokens.json | 8 +-- .../src/components/ams/text-area.tokens.json | 10 ++-- .../src/components/ams/text-input.tokens.json | 8 +-- .../src/components/ams/time-input.tokens.json | 8 +-- .../components/ams/top-task-link.tokens.json | 16 +++--- .../components/ams/unordered-list.tokens.json | 12 ++--- 37 files changed, 197 insertions(+), 199 deletions(-) diff --git a/proprietary/tokens/src/components/ams/accordion.tokens.json b/proprietary/tokens/src/components/ams/accordion.tokens.json index bee034f1fd..875047a332 100644 --- a/proprietary/tokens/src/components/ams/accordion.tokens.json +++ b/proprietary/tokens/src/components/ams/accordion.tokens.json @@ -4,11 +4,11 @@ "gap": { "value": "{ams.space.md}" }, "button": { "color": { "value": "{ams.brand.color.blue.60}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.bold}" }, + "font-family": { "value": "{ams.common.typography.headings.font-family}" }, + "font-size": { "value": "{ams.common.typography.headings.level-5.font-size}" }, + "font-weight": { "value": "{ams.common.typography.headings.font-weight}" }, "gap": { "value": "{ams.space.sm}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "line-height": { "value": "{ams.common.typography.headings.level-5.line-height}" }, "padding-block": { "value": "{ams.space.sm}" }, "padding-inline": { "value": "0" }, "focus": { diff --git a/proprietary/tokens/src/components/ams/avatar.tokens.json b/proprietary/tokens/src/components/ams/avatar.tokens.json index 63727d204b..af26e30351 100644 --- a/proprietary/tokens/src/components/ams/avatar.tokens.json +++ b/proprietary/tokens/src/components/ams/avatar.tokens.json @@ -2,10 +2,10 @@ "ams": { "avatar": { "aspect-ratio": { "value": "{ams.aspect-ratio.square}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.6.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, - "line-height": { "value": "{ams.text.level.6.line-height}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.sm.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, + "line-height": { "value": "{ams.common.typography.body-text.sm.line-height}" }, "padding-block": { "value": "{ams.space.xs}" }, "padding-inline": { "value": "{ams.space.xs}" }, "azure": { diff --git a/proprietary/tokens/src/components/ams/badge.tokens.json b/proprietary/tokens/src/components/ams/badge.tokens.json index e5b1914e71..6d16feb2da 100644 --- a/proprietary/tokens/src/components/ams/badge.tokens.json +++ b/proprietary/tokens/src/components/ams/badge.tokens.json @@ -1,11 +1,11 @@ { "ams": { "badge": { - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.bold}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, - "padding-inline": { "value": "{ams.space.xs}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "font-weight": { "value": "{ams.common.typography.bold.font-weight}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, + "padding-inline": { "value": "{ams.sspace.xs}" }, "azure": { "background-color": { "value": "{ams.brand.color.azure.60}" }, "color": { "value": "{ams.brand.color.neutral.100}" } diff --git a/proprietary/tokens/src/components/ams/blockquote.tokens.json b/proprietary/tokens/src/components/ams/blockquote.tokens.json index e139132b9e..5fde6c3eee 100644 --- a/proprietary/tokens/src/components/ams/blockquote.tokens.json +++ b/proprietary/tokens/src/components/ams/blockquote.tokens.json @@ -2,11 +2,11 @@ "ams": { "blockquote": { "color": { "value": "{ams.brand.color.neutral.100}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.3.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.bold}" }, - "line-height": { "value": "{ams.text.level.3.line-height}" }, - "inverse-color": { "value": "{ams.brand.color.neutral.0}" } + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.xl.font-size}" }, + "font-weight": { "value": "{ams.common.typography.bold.font-weight}" }, + "inverse-color": { "value": "{ams.brand.color.neutral.0}" }, + "line-height": { "value": "{ams.common.typography.body-text.xl.line-height}" } } } } diff --git a/proprietary/tokens/src/components/ams/breadcrumb.tokens.json b/proprietary/tokens/src/components/ams/breadcrumb.tokens.json index 53775d45c8..5f607b501c 100644 --- a/proprietary/tokens/src/components/ams/breadcrumb.tokens.json +++ b/proprietary/tokens/src/components/ams/breadcrumb.tokens.json @@ -1,10 +1,10 @@ { "ams": { "breadcrumb": { - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.6.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, - "line-height": { "value": "{ams.text.level.6.line-height}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.sm.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, + "line-height": { "value": "{ams.common.typography.body-text.sm.line-height}" }, "separator": { "background-image": { "value": "url(\"data:image/svg+xml;utf8,\")" diff --git a/proprietary/tokens/src/components/ams/button.tokens.json b/proprietary/tokens/src/components/ams/button.tokens.json index 6cd4cc6304..cd79e33cfd 100644 --- a/proprietary/tokens/src/components/ams/button.tokens.json +++ b/proprietary/tokens/src/components/ams/button.tokens.json @@ -2,9 +2,9 @@ "ams": { "button": { "cursor": { "value": "{ams.action.activate.cursor}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, "gap": { "value": "{ams.space.sm}" }, "outline-offset": { "value": "{ams.focus.outline-offset}" }, "padding-block": { "value": "{ams.space.sm}" }, diff --git a/proprietary/tokens/src/components/ams/character-count.tokens.json b/proprietary/tokens/src/components/ams/character-count.tokens.json index 235dce5d47..59a23caa47 100644 --- a/proprietary/tokens/src/components/ams/character-count.tokens.json +++ b/proprietary/tokens/src/components/ams/character-count.tokens.json @@ -2,10 +2,10 @@ "ams": { "character-count": { "color": { "value": "{ams.brand.color.neutral.100}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.6.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, - "line-height": { "value": "{ams.text.level.6.line-height}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.sm.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, + "line-height": { "value": "{ams.common.typography.body-text.sm.line-height}" }, "error": { "color": { "value": "{ams.brand.color.red.60}" } } diff --git a/proprietary/tokens/src/components/ams/checkbox.tokens.json b/proprietary/tokens/src/components/ams/checkbox.tokens.json index 2dd9857200..898448cfc8 100644 --- a/proprietary/tokens/src/components/ams/checkbox.tokens.json +++ b/proprietary/tokens/src/components/ams/checkbox.tokens.json @@ -2,11 +2,11 @@ "ams": { "checkbox": { "color": { "value": "{ams.brand.color.neutral.100}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, "gap": { "value": "{ams.space.sm}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, "outline-offset": { "value": "{ams.focus.outline-offset}" }, "checkmark": { "border-color": { "value": "{ams.brand.color.blue.60}" }, diff --git a/proprietary/tokens/src/components/ams/date-input.tokens.json b/proprietary/tokens/src/components/ams/date-input.tokens.json index 712e508365..b0d6b7c40f 100644 --- a/proprietary/tokens/src/components/ams/date-input.tokens.json +++ b/proprietary/tokens/src/components/ams/date-input.tokens.json @@ -4,10 +4,10 @@ "background-color": { "value": "{ams.brand.color.neutral.0}" }, "box-shadow": { "value": "inset 0 0 0 {ams.border.width.sm} {ams.brand.color.neutral.100}" }, "color": { "value": "{ams.brand.color.neutral.100}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, "outline-offset": { "value": "{ams.focus.outline-offset}" }, "padding-block": { "value": "{ams.space.sm}" }, "padding-inline": { "value": "{ams.space.md}" }, diff --git a/proprietary/tokens/src/components/ams/description-list.tokens.json b/proprietary/tokens/src/components/ams/description-list.tokens.json index 6673ff7210..c1b7fa998b 100644 --- a/proprietary/tokens/src/components/ams/description-list.tokens.json +++ b/proprietary/tokens/src/components/ams/description-list.tokens.json @@ -3,16 +3,16 @@ "description-list": { "color": { "value": "{ams.brand.color.neutral.100}" }, "column-gap": { "value": "{ams.space.lg}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, "inverse-color": { "value": "{ams.brand.color.neutral.0}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, "row-gap": { "value": "{ams.space.sm}" }, "term": { - "font-weight": { "value": "{ams.text.font-weight.bold}" } + "font-weight": { "value": "{ams.common.typography.bold.font-weight}" } }, "description": { - "font-weight": { "value": "{ams.text.font-weight.normal}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, "padding-inline-start": { "value": "{ams.space.lg}" } } } diff --git a/proprietary/tokens/src/components/ams/error-message.tokens.json b/proprietary/tokens/src/components/ams/error-message.tokens.json index a92ba0493a..d085b44b7a 100644 --- a/proprietary/tokens/src/components/ams/error-message.tokens.json +++ b/proprietary/tokens/src/components/ams/error-message.tokens.json @@ -2,11 +2,11 @@ "ams": { "error-message": { "color": { "value": "{ams.brand.color.red.60}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.6.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.sm.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, "gap": { "value": "{ams.space.xs}" }, - "line-height": { "value": "{ams.text.level.6.line-height}" } + "line-height": { "value": "{ams.common.typography.body-text.sm.line-height}" } } } } diff --git a/proprietary/tokens/src/components/ams/field-set.tokens.json b/proprietary/tokens/src/components/ams/field-set.tokens.json index 61ff93e1df..47d380c760 100644 --- a/proprietary/tokens/src/components/ams/field-set.tokens.json +++ b/proprietary/tokens/src/components/ams/field-set.tokens.json @@ -7,10 +7,10 @@ }, "legend": { "color": { "value": "{ams.brand.color.neutral.100}" }, - "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}" }, + "font-family": { "value": "{ams.common.typography.headings.font-family}" }, + "font-size": { "value": "{ams.common.typography.headings.level-4.font-size}" }, + "font-weight": { "value": "{ams.common.typography.headings.font-weight}" }, + "line-height": { "value": "{ams.common.typography.headings.level-4.line-height}" }, "margin-block-end": { "value": "{ams.space.md}" } } } diff --git a/proprietary/tokens/src/components/ams/file-input.tokens.json b/proprietary/tokens/src/components/ams/file-input.tokens.json index 013613a7af..dc5f3e310f 100644 --- a/proprietary/tokens/src/components/ams/file-input.tokens.json +++ b/proprietary/tokens/src/components/ams/file-input.tokens.json @@ -5,10 +5,10 @@ "border": { "value": "{ams.border.width.sm} dashed {ams.brand.color.neutral.60}" }, "color": { "value": "{ams.brand.color.neutral.100}" }, "cursor": { "value": "{ams.action.activate.cursor}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, "outline-offset": { "value": "{ams.focus.outline-offset}" }, "padding-block": { "value": "{ams.space.md}" }, "padding-inline": { "value": "{ams.space.md}" }, diff --git a/proprietary/tokens/src/components/ams/heading.tokens.json b/proprietary/tokens/src/components/ams/heading.tokens.json index 9425a8ab2c..7566d0d84c 100644 --- a/proprietary/tokens/src/components/ams/heading.tokens.json +++ b/proprietary/tokens/src/components/ams/heading.tokens.json @@ -2,34 +2,32 @@ "ams": { "heading": { "color": { "value": "{ams.brand.color.neutral.100}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-weight": { "value": "{ams.text.font-weight.bold}" }, + "font-family": { "value": "{ams.common.typography.headings.font-family}" }, + "font-weight": { "value": "{ams.common.typography.headings.font-weight}" }, "inverse-color": { "value": "{ams.brand.color.neutral.0}" }, - "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}" } - } + "level-1": { + "font-size": { "value": "{ams.common.typography.headings.level-1.font-size}" }, + "line-height": { "value": "{ams.common.typography.headings.level-1.line-height}" } + }, + "level-2": { + "font-size": { "value": "{ams.common.typography.headings.level-2.font-size}" }, + "line-height": { "value": "{ams.common.typography.headings.level-2.line-height}" } + }, + "level-3": { + "font-size": { "value": "{ams.common.typography.headings.level-3.font-size}" }, + "line-height": { "value": "{ams.common.typography.headings.level-3.line-height}" } + }, + "level-4": { + "font-size": { "value": "{ams.common.typography.headings.level-4.font-size}" }, + "line-height": { "value": "{ams.common.typography.headings.level-4.line-height}" } + }, + "level-5": { + "font-size": { "value": "{ams.common.typography.headings.level-5.font-size}" }, + "line-height": { "value": "{ams.common.typography.headings.level-5.line-height}" } + }, + "level-6": { + "font-size": { "value": "{ams.common.typography.headings.level-6.font-size}" }, + "line-height": { "value": "{ams.common.typography.headings.level-6.line-height}" } } } } diff --git a/proprietary/tokens/src/components/ams/icon.tokens.json b/proprietary/tokens/src/components/ams/icon.tokens.json index a42b254322..04772c3a9e 100644 --- a/proprietary/tokens/src/components/ams/icon.tokens.json +++ b/proprietary/tokens/src/components/ams/icon.tokens.json @@ -2,20 +2,20 @@ "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.common.typography.body-text.xl.font-size}" }, + "line-height": { "value": "{ams.common.typography.body-text.xl.line-height}" } }, "size-4": { - "font-size": { "value": "{ams.text.level.4.font-size}" }, - "line-height": { "value": "{ams.text.level.4.line-height}" } + "font-size": { "value": "{ams.common.typography.body-text.lg.font-size}" }, + "line-height": { "value": "{ams.common.typography.body-text.lg.line-height}" } }, "size-5": { - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" } + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" } }, "size-6": { - "font-size": { "value": "{ams.text.level.6.font-size}" }, - "line-height": { "value": "{ams.text.level.6.line-height}" } + "font-size": { "value": "{ams.common.typography.body-text.sm.font-size}" }, + "line-height": { "value": "{ams.common.typography.body-text.sm.line-height}" } } } } diff --git a/proprietary/tokens/src/components/ams/label.tokens.json b/proprietary/tokens/src/components/ams/label.tokens.json index 7145031b94..61b98eaa1f 100644 --- a/proprietary/tokens/src/components/ams/label.tokens.json +++ b/proprietary/tokens/src/components/ams/label.tokens.json @@ -2,10 +2,10 @@ "ams": { "label": { "color": { "value": "{ams.brand.color.neutral.100}" }, - "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}" } + "font-family": { "value": "{ams.common.typography.headings.font-family}" }, + "font-size": { "value": "{ams.common.typography.headings.level-4.font-size}" }, + "font-weight": { "value": "{ams.common.typography.headings.font-weight}" }, + "line-height": { "value": "{ams.common.typography.headings.level-4.line-height}" } } } } diff --git a/proprietary/tokens/src/components/ams/link-list.tokens.json b/proprietary/tokens/src/components/ams/link-list.tokens.json index 34ce0f0c40..68ce4ff2e1 100644 --- a/proprietary/tokens/src/components/ams/link-list.tokens.json +++ b/proprietary/tokens/src/components/ams/link-list.tokens.json @@ -4,22 +4,22 @@ "gap": { "value": "{ams.space.sm}" }, "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}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, "gap": { "value": "{ams.space.sm}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "line-height": { "value": "{ams.common.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}" }, "small": { - "font-size": { "value": "{ams.text.level.6.font-size}" }, - "line-height": { "value": "{ams.text.level.6.line-height}" } + "font-size": { "value": "{ams.common.typography.body-text.sm.font-size}" }, + "line-height": { "value": "{ams.common.typography.body-text.sm.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.common.typography.body-text.lg.font-size}" }, + "line-height": { "value": "{ams.common.typography.body-text.lg.line-height}" } }, "hover": { "color": { "value": "{ams.link-appearance.hover.color}" }, diff --git a/proprietary/tokens/src/components/ams/link.tokens.json b/proprietary/tokens/src/components/ams/link.tokens.json index eff5dfb6ed..bb9b3b69fa 100644 --- a/proprietary/tokens/src/components/ams/link.tokens.json +++ b/proprietary/tokens/src/components/ams/link.tokens.json @@ -2,8 +2,8 @@ "ams": { "link": { "color": { "value": "{ams.link-appearance.color}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, "outline-offset": { "value": "{ams.focus.outline-offset}" }, "hover": { "color": { "value": "{ams.link-appearance.hover.color}" } @@ -26,8 +26,8 @@ } }, "standalone": { - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "line-height": { "value": "{ams.common.typography.body-text.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}" }, diff --git a/proprietary/tokens/src/components/ams/ordered-list.tokens.json b/proprietary/tokens/src/components/ams/ordered-list.tokens.json index 2cc338bac6..dfefd32be4 100644 --- a/proprietary/tokens/src/components/ams/ordered-list.tokens.json +++ b/proprietary/tokens/src/components/ams/ordered-list.tokens.json @@ -2,16 +2,16 @@ "ams": { "ordered-list": { "color": { "value": "{ams.brand.color.neutral.100}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, "gap": { "value": "{ams.space.md}" }, "inverse-color": { "value": "{ams.brand.color.neutral.0}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, "list-style-type": { "value": "decimal" }, "small": { - "font-size": { "value": "{ams.text.level.6.font-size}" }, - "line-height": { "value": "{ams.text.level.6.line-height}" } + "font-size": { "value": "{ams.common.typography.body-text.sm.font-size}" }, + "line-height": { "value": "{ams.common.typography.body-text.sm.line-height}" } }, "item": { "margin-inline-start": { diff --git a/proprietary/tokens/src/components/ams/page-heading.tokens.json b/proprietary/tokens/src/components/ams/page-heading.tokens.json index bf84b67300..d404879181 100644 --- a/proprietary/tokens/src/components/ams/page-heading.tokens.json +++ b/proprietary/tokens/src/components/ams/page-heading.tokens.json @@ -2,11 +2,11 @@ "ams": { "page-heading": { "color": { "value": "{ams.brand.color.neutral.100}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.0.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.bold}" }, + "font-family": { "value": "{ams.common.typography.headings.font-family}" }, + "font-size": { "value": "{ams.common.typography.headings.level-0.font-size}" }, + "font-weight": { "value": "{ams.common.typography.headings.font-weight}" }, "inverse-color": { "value": "{ams.brand.color.neutral.0}" }, - "line-height": { "value": "{ams.text.level.0.font-size}" } + "line-height": { "value": "{ams.common.typography.headings.level-0.line-height}" } } } } diff --git a/proprietary/tokens/src/components/ams/page-menu.tokens.json b/proprietary/tokens/src/components/ams/page-menu.tokens.json index 0fa9a7ccbf..196f3fc91e 100644 --- a/proprietary/tokens/src/components/ams/page-menu.tokens.json +++ b/proprietary/tokens/src/components/ams/page-menu.tokens.json @@ -5,11 +5,11 @@ "row-gap": { "value": "{ams.space.grid.xs}" }, "item": { "color": { "value": "{ams.link-appearance.color}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.6.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.sm.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, "gap": { "value": "{ams.space.sm}" }, - "line-height": { "value": "{ams.text.level.6.line-height}" }, + "line-height": { "value": "{ams.common.typography.body-text.sm.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}" }, diff --git a/proprietary/tokens/src/components/ams/pagination.tokens.json b/proprietary/tokens/src/components/ams/pagination.tokens.json index 41582d48d9..ff59cd5bcb 100644 --- a/proprietary/tokens/src/components/ams/pagination.tokens.json +++ b/proprietary/tokens/src/components/ams/pagination.tokens.json @@ -2,10 +2,10 @@ "ams": { "pagination": { "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}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, "button": { "gap": { "value": "{ams.space.xs}" }, "outline-offset": { "value": "{ams.focus.outline-offset}" }, @@ -14,7 +14,7 @@ "text-decoration-thickness": { "value": "{ams.link-appearance.text-decoration-thickness}" }, "text-underline-offset": { "value": "{ams.link-appearance.text-underline-offset}" }, "current": { - "font-weight": { "value": "{ams.text.font-weight.bold}" } + "font-weight": { "value": "{ams.common.typography.bold.font-weight}" } }, "hover": { "color": { "value": "{ams.link-appearance.hover.color}" }, diff --git a/proprietary/tokens/src/components/ams/paragraph.tokens.json b/proprietary/tokens/src/components/ams/paragraph.tokens.json index cb65d44a30..9f126d7619 100644 --- a/proprietary/tokens/src/components/ams/paragraph.tokens.json +++ b/proprietary/tokens/src/components/ams/paragraph.tokens.json @@ -2,18 +2,18 @@ "ams": { "paragraph": { "color": { "value": "{ams.brand.color.neutral.100}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, "inverse-color": { "value": "{ams.brand.color.neutral.0}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, "small": { - "font-size": { "value": "{ams.text.level.6.font-size}" }, - "line-height": { "value": "{ams.text.level.6.line-height}" } + "font-size": { "value": "{ams.common.typography.body-text.sm.font-size}" }, + "line-height": { "value": "{ams.common.typography.body-text.sm.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.common.typography.body-text.lg.font-size}" }, + "line-height": { "value": "{ams.common.typography.body-text.lg.line-height}" } } } } diff --git a/proprietary/tokens/src/components/ams/password-input.tokens.json b/proprietary/tokens/src/components/ams/password-input.tokens.json index bbc1195258..4d65ff2189 100644 --- a/proprietary/tokens/src/components/ams/password-input.tokens.json +++ b/proprietary/tokens/src/components/ams/password-input.tokens.json @@ -4,10 +4,10 @@ "background-color": { "value": "{ams.brand.color.neutral.0}" }, "box-shadow": { "value": "inset 0 0 0 {ams.border.width.sm} {ams.brand.color.neutral.100}" }, "color": { "value": "{ams.brand.color.neutral.100}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, "outline-offset": { "value": "{ams.focus.outline-offset}" }, "padding-block": { "value": "{ams.space.sm}" }, "padding-inline": { "value": "{ams.space.md}" }, diff --git a/proprietary/tokens/src/components/ams/radio.tokens.json b/proprietary/tokens/src/components/ams/radio.tokens.json index 22b78714ec..3c15bf8eea 100644 --- a/proprietary/tokens/src/components/ams/radio.tokens.json +++ b/proprietary/tokens/src/components/ams/radio.tokens.json @@ -2,11 +2,11 @@ "ams": { "radio": { "color": { "value": "{ams.brand.color.neutral.100}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, "gap": { "value": "{ams.space.sm}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, "outline-offset": { "value": "{ams.focus.outline-offset}" }, "text-decoration-thickness": { "value": "{ams.link-appearance.text-decoration-thickness}" }, "text-underline-offset": { "value": "{ams.link-appearance.text-underline-offset}" }, diff --git a/proprietary/tokens/src/components/ams/search-field.tokens.json b/proprietary/tokens/src/components/ams/search-field.tokens.json index 2162dd562e..74628cf7ec 100644 --- a/proprietary/tokens/src/components/ams/search-field.tokens.json +++ b/proprietary/tokens/src/components/ams/search-field.tokens.json @@ -5,10 +5,10 @@ "background-color": { "value": "{ams.brand.color.neutral.0}" }, "box-shadow": { "value": "inset 0 0 0 {ams.border.width.sm} {ams.brand.color.neutral.100}" }, "color": { "value": "{ams.brand.color.neutral.100}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, "outline-offset": { "value": "{ams.focus.outline-offset}" }, "padding-block": { "value": "{ams.space.sm}" }, "padding-inline": { "value": "{ams.space.md}" }, @@ -16,9 +16,9 @@ "background-image": { "value": "url(\"data:image/svg+xml;utf8,\")" }, - "block-size": { "value": "{ams.text.level.5.font-size}" }, + "block-size": { "value": "{ams.common.typography.body-text.font-size}" }, "color": { "value": "{ams.brand.color.blue.60}" }, - "inline-size": { "value": "{ams.text.level.5.font-size}" } + "inline-size": { "value": "{ams.common.typography.body-text.font-size}" } }, "hover": { "box-shadow": { diff --git a/proprietary/tokens/src/components/ams/select.tokens.json b/proprietary/tokens/src/components/ams/select.tokens.json index 9d1ff8a638..322ec3021f 100644 --- a/proprietary/tokens/src/components/ams/select.tokens.json +++ b/proprietary/tokens/src/components/ams/select.tokens.json @@ -8,10 +8,10 @@ "background-position": { "value": "right {ams.space.md} center" }, "box-shadow": { "value": "inset 0 0 0 {ams.border.width.sm} {ams.brand.color.neutral.100}" }, "color": { "value": "{ams.brand.color.neutral.100}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, "outline-offset": { "value": "{ams.focus.outline-offset}" }, "padding-block": { "value": "{ams.space.sm}" }, "padding-inline": { "value": "{ams.space.md} calc(2 * {ams.space.md} + 1em)" }, diff --git a/proprietary/tokens/src/components/ams/skip-link.tokens.json b/proprietary/tokens/src/components/ams/skip-link.tokens.json index 1e5f981008..9c93df3075 100644 --- a/proprietary/tokens/src/components/ams/skip-link.tokens.json +++ b/proprietary/tokens/src/components/ams/skip-link.tokens.json @@ -3,10 +3,10 @@ "skip-link": { "background-color": { "value": "{ams.brand.color.blue.60}" }, "color": { "value": "{ams.brand.color.neutral.0}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.6.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, - "line-height": { "value": "{ams.text.level.6.line-height}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.sm.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, + "line-height": { "value": "{ams.common.typography.body-text.sm.line-height}" }, "outline-offset": { "value": "{ams.focus.outline-offset}" }, "padding-block": { "value": "{ams.space.sm}" }, "padding-inline": { "value": "{ams.space.md}" }, diff --git a/proprietary/tokens/src/components/ams/switch.tokens.json b/proprietary/tokens/src/components/ams/switch.tokens.json index 4a4ab6db4a..af5de713d2 100644 --- a/proprietary/tokens/src/components/ams/switch.tokens.json +++ b/proprietary/tokens/src/components/ams/switch.tokens.json @@ -2,7 +2,7 @@ "ams": { "switch": { "background-color": { "value": "{ams.brand.color.neutral.60}" }, - "font-family": { "value": "{ams.text.font-family}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, "outline-offset": { "value": "{ams.focus.outline-offset}" }, "inline-size": { "value": "3.5rem" }, "thumb": { diff --git a/proprietary/tokens/src/components/ams/table-of-contents.tokens.json b/proprietary/tokens/src/components/ams/table-of-contents.tokens.json index 3940de65be..cf1f40ef3c 100644 --- a/proprietary/tokens/src/components/ams/table-of-contents.tokens.json +++ b/proprietary/tokens/src/components/ams/table-of-contents.tokens.json @@ -1,11 +1,11 @@ { "ams": { "table-of-contents": { - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, "gap": { "value": "{ams.space.md}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, "link": { "color": { "value": "{ams.link-appearance.color}" }, "outline-offset": { "value": "{ams.focus.outline-offset}" }, @@ -25,9 +25,9 @@ } }, "heading": { - "font-weight": { "value": "{ams.text.font-weight.bold}" }, - "font-size": { "value": "{ams.text.level.4.font-size}" }, - "line-height": { "value": "{ams.text.level.4.line-height}" } + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, + "font-size": { "value": "{ams.common.typography.body-text.lg.font-size}" }, + "line-height": { "value": "{ams.common.typography.body-text.lg.line-height}" } } } } diff --git a/proprietary/tokens/src/components/ams/table.tokens.json b/proprietary/tokens/src/components/ams/table.tokens.json index e15afdf9b4..9cf7f4ad51 100644 --- a/proprietary/tokens/src/components/ams/table.tokens.json +++ b/proprietary/tokens/src/components/ams/table.tokens.json @@ -2,12 +2,12 @@ "ams": { "table": { "color": { "value": "{ams.brand.color.neutral.100}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, "caption": { - "font-weight": { "value": "{ams.text.font-weight.bold}" } + "font-weight": { "value": "{ams.common.typography.bold.font-weight}" } }, "cell": { "border-block-end": { "value": "{ams.border.width.sm} solid {ams.brand.color.neutral.20}" }, @@ -15,7 +15,7 @@ "padding-inline": { "value": "{ams.space.md}" } }, "header-cell": { - "font-weight": { "value": "{ams.text.font-weight.bold}" } + "font-weight": { "value": "{ams.common.typography.bold.font-weight}" } } } } diff --git a/proprietary/tokens/src/components/ams/tabs.tokens.json b/proprietary/tokens/src/components/ams/tabs.tokens.json index 042814af09..92fe8d8618 100644 --- a/proprietary/tokens/src/components/ams/tabs.tokens.json +++ b/proprietary/tokens/src/components/ams/tabs.tokens.json @@ -9,10 +9,10 @@ "button": { "color": { "value": "{ams.brand.color.blue.60}" }, "cursor": { "value": "{ams.action.activate.cursor}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, "outline-offset": { "value": "-0.25rem" }, "padding-block": { "value": "{ams.space.sm}" }, "padding-inline": { "value": "{ams.space.md}" }, diff --git a/proprietary/tokens/src/components/ams/text-area.tokens.json b/proprietary/tokens/src/components/ams/text-area.tokens.json index b5218ea426..ccc8f61894 100644 --- a/proprietary/tokens/src/components/ams/text-area.tokens.json +++ b/proprietary/tokens/src/components/ams/text-area.tokens.json @@ -4,12 +4,12 @@ "background-color": { "value": "{ams.brand.color.neutral.0}" }, "box-shadow": { "value": "inset 0 0 0 {ams.border.width.sm} {ams.brand.color.neutral.100}" }, "color": { "value": "{ams.brand.color.neutral.100}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, "min-block-size": { - "value": "calc({ams.text.level.5.line-height} * 1em + 2 * {ams.text-area.padding-block})" + "value": "calc({ams.common.typography.body-text.line-height} * 1em + 2 * {ams.text-area.padding-block})" }, "outline-offset": { "value": "{ams.focus.outline-offset}" }, "padding-block": { "value": "{ams.space.sm}" }, diff --git a/proprietary/tokens/src/components/ams/text-input.tokens.json b/proprietary/tokens/src/components/ams/text-input.tokens.json index 1324bb0224..a3791e41bc 100644 --- a/proprietary/tokens/src/components/ams/text-input.tokens.json +++ b/proprietary/tokens/src/components/ams/text-input.tokens.json @@ -4,10 +4,10 @@ "background-color": { "value": "{ams.brand.color.neutral.0}" }, "box-shadow": { "value": "inset 0 0 0 {ams.border.width.sm} {ams.brand.color.neutral.100}" }, "color": { "value": "{ams.brand.color.neutral.100}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, "outline-offset": { "value": "{ams.focus.outline-offset}" }, "padding-block": { "value": "{ams.space.sm}" }, "padding-inline": { "value": "{ams.space.md}" }, diff --git a/proprietary/tokens/src/components/ams/time-input.tokens.json b/proprietary/tokens/src/components/ams/time-input.tokens.json index ff0765b436..8f58a0c706 100644 --- a/proprietary/tokens/src/components/ams/time-input.tokens.json +++ b/proprietary/tokens/src/components/ams/time-input.tokens.json @@ -4,10 +4,10 @@ "background-color": { "value": "{ams.brand.color.neutral.0}" }, "box-shadow": { "value": "inset 0 0 0 {ams.border.width.sm} {ams.brand.color.neutral.100}" }, "color": { "value": "{ams.brand.color.neutral.100}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, "outline-offset": { "value": "{ams.focus.outline-offset}" }, "padding-block": { "value": "{ams.space.sm}" }, "padding-inline": { "value": "{ams.space.md}" }, diff --git a/proprietary/tokens/src/components/ams/top-task-link.tokens.json b/proprietary/tokens/src/components/ams/top-task-link.tokens.json index eb0b1f85b3..b0920fcbc2 100644 --- a/proprietary/tokens/src/components/ams/top-task-link.tokens.json +++ b/proprietary/tokens/src/components/ams/top-task-link.tokens.json @@ -4,17 +4,17 @@ "gap": { "value": "{ams.space.sm}" }, "description": { "color": { "value": "{ams.brand.color.neutral.100}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.6.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, - "line-height": { "value": "{ams.text.level.6.line-height}" } + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.sm.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, + "line-height": { "value": "{ams.common.typography.body-text.sm.line-height}" } }, "label": { "color": { "value": "{ams.link-appearance.color}" }, - "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}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.lg.font-size}" }, + "font-weight": { "value": "{ams.common.typography.bold.font-weight}" }, + "line-height": { "value": "{ams.common.typography.body-text.lg.line-height}" }, "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}" }, diff --git a/proprietary/tokens/src/components/ams/unordered-list.tokens.json b/proprietary/tokens/src/components/ams/unordered-list.tokens.json index 6459655630..222a93901f 100644 --- a/proprietary/tokens/src/components/ams/unordered-list.tokens.json +++ b/proprietary/tokens/src/components/ams/unordered-list.tokens.json @@ -2,12 +2,12 @@ "ams": { "unordered-list": { "color": { "value": "{ams.brand.color.neutral.100}" }, - "font-family": { "value": "{ams.text.font-family}" }, - "font-size": { "value": "{ams.text.level.5.font-size}" }, - "font-weight": { "value": "{ams.text.font-weight.normal}" }, + "font-family": { "value": "{ams.common.typography.body-text.font-family}" }, + "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, + "font-weight": { "value": "{ams.common.typography.body-text.font-weight}" }, "gap": { "value": "{ams.space.md}" }, "inverse-color": { "value": "{ams.brand.color.neutral.0}" }, - "line-height": { "value": "{ams.text.level.5.line-height}" }, + "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, "list-style-type": { "value": "'\\2022'" }, "item": { "margin-inline-start": { @@ -36,8 +36,8 @@ } }, "small": { - "font-size": { "value": "{ams.text.level.6.font-size}" }, - "line-height": { "value": "{ams.text.level.6.line-height}" } + "font-size": { "value": "{ams.common.typography.body-text.sm.font-size}" }, + "line-height": { "value": "{ams.common.typography.body-text.sm.line-height}" } } } } From 9cb677493b78bcc8f045c31726ebf432509639f0 Mon Sep 17 00:00:00 2001 From: Vincent Smedinga Date: Fri, 22 Nov 2024 20:12:43 +0100 Subject: [PATCH 4/7] Remove unnecessary extra logging config --- proprietary/tokens/build.js | 3 --- proprietary/tokens/src/components/ams/badge.tokens.json | 2 +- 2 files changed, 1 insertion(+), 4 deletions(-) diff --git a/proprietary/tokens/build.js b/proprietary/tokens/build.js index 74c086c1a4..0a21b3a478 100644 --- a/proprietary/tokens/build.js +++ b/proprietary/tokens/build.js @@ -96,9 +96,6 @@ defaultMode.buildAllPlatforms() modes.map((mode) => { const styleDictionary = new StyleDictionary({ - log: { - verbosity: 'verbose', - }, source: [`./src/**/*.${mode}.tokens.json`], platforms: generateSharedConfig(mode), }) diff --git a/proprietary/tokens/src/components/ams/badge.tokens.json b/proprietary/tokens/src/components/ams/badge.tokens.json index 6d16feb2da..69a73dc12c 100644 --- a/proprietary/tokens/src/components/ams/badge.tokens.json +++ b/proprietary/tokens/src/components/ams/badge.tokens.json @@ -5,7 +5,7 @@ "font-size": { "value": "{ams.common.typography.body-text.font-size}" }, "font-weight": { "value": "{ams.common.typography.bold.font-weight}" }, "line-height": { "value": "{ams.common.typography.body-text.line-height}" }, - "padding-inline": { "value": "{ams.sspace.xs}" }, + "padding-inline": { "value": "{ams.space.xs}" }, "azure": { "background-color": { "value": "{ams.brand.color.azure.60}" }, "color": { "value": "{ams.brand.color.neutral.100}" } From a3082d631defd7f618091b95cb4a46687e42a5b6 Mon Sep 17 00:00:00 2001 From: Vincent Smedinga Date: Fri, 22 Nov 2024 20:12:54 +0100 Subject: [PATCH 5/7] Rename token in stylesheet --- storybook/src/styles/overrides.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/storybook/src/styles/overrides.css b/storybook/src/styles/overrides.css index 5e635314ab..528c7ec29f 100644 --- a/storybook/src/styles/overrides.css +++ b/storybook/src/styles/overrides.css @@ -40,7 +40,7 @@ .sbdocs-content.sbdocs-content > .ams-storybook-status-badge > span:nth-child(2) { color: #000; font-family: "Amsterdam Sans", "Arial", sans-serif; - font-size: var(--ams-text-level-6-font-size); + font-size: var(--ams-common-typography-font-size-sm); } .sbdocs-content.sbdocs-content .sbdocs-a { From 4664607729a246c335a037c522d2e55f3813bb55 Mon Sep 17 00:00:00 2001 From: Vincent Smedinga Date: Fri, 22 Nov 2024 20:18:56 +0100 Subject: [PATCH 6/7] Add new compact tokens --- .../brand/ams/typography.compact.tokens.json | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) create mode 100644 proprietary/tokens/src/brand/ams/typography.compact.tokens.json diff --git a/proprietary/tokens/src/brand/ams/typography.compact.tokens.json b/proprietary/tokens/src/brand/ams/typography.compact.tokens.json new file mode 100644 index 0000000000..b82d081f91 --- /dev/null +++ b/proprietary/tokens/src/brand/ams/typography.compact.tokens.json @@ -0,0 +1,17 @@ +{ + "ams": { + "brand": { + "typography": { + "font-size": { + "sm": { "value": "clamp(0.8889rem, calc(0.9141rem + -0.0253vw), 0.9091rem)" }, + "md": { "value": "1rem" }, + "lg": { "value": "clamp(1.1rem, calc(1.0938rem + 0.0313vw), 1.125rem)" }, + "xl": { "value": "clamp(1.21rem, calc(1.1961rem + 0.0695vw), 1.2656rem)" }, + "2xl": { "value": "clamp(1.331rem, calc(1.3078rem + 0.116vw), 1.4238rem)" }, + "3xl": { "value": "clamp(1.4641rem, calc(1.4297rem + 0.1721vw), 1.6018rem)" }, + "4xl": { "value": "clamp(1.6105rem, calc(1.5626rem + 0.2394vw), 1.802rem)" } + } + } + } + } +} From 855d488e72a65bdece24906dac6c8b823781cd30 Mon Sep 17 00:00:00 2001 From: Vincent Smedinga Date: Fri, 22 Nov 2024 20:19:53 +0100 Subject: [PATCH 7/7] Remove obsolete text tokens --- .../src/brand/ams/text.compact.tokens.json | 29 ------------- .../tokens/src/brand/ams/text.tokens.json | 41 ------------------- 2 files changed, 70 deletions(-) delete mode 100644 proprietary/tokens/src/brand/ams/text.compact.tokens.json delete mode 100644 proprietary/tokens/src/brand/ams/text.tokens.json diff --git a/proprietary/tokens/src/brand/ams/text.compact.tokens.json b/proprietary/tokens/src/brand/ams/text.compact.tokens.json deleted file mode 100644 index ebe9faa817..0000000000 --- a/proprietary/tokens/src/brand/ams/text.compact.tokens.json +++ /dev/null @@ -1,29 +0,0 @@ -{ - "ams": { - "text": { - "level": { - "0": { - "font-size": { "value": "clamp(1.6105rem, calc(1.5626rem + 0.2394vw), 1.802rem)" } - }, - "1": { - "font-size": { "value": "clamp(1.4641rem, calc(1.4297rem + 0.1721vw), 1.6018rem)" } - }, - "2": { - "font-size": { "value": "clamp(1.331rem, calc(1.3078rem + 0.116vw), 1.4238rem)" } - }, - "3": { - "font-size": { "value": "clamp(1.21rem, calc(1.1961rem + 0.0695vw), 1.2656rem)" } - }, - "4": { - "font-size": { "value": "clamp(1.1rem, calc(1.0938rem + 0.0313vw), 1.125rem)" } - }, - "5": { - "font-size": { "value": "1rem" } - }, - "6": { - "font-size": { "value": "clamp(0.8889rem, calc(0.9141rem + -0.0253vw), 0.9091rem)" } - } - } - } - } -} diff --git a/proprietary/tokens/src/brand/ams/text.tokens.json b/proprietary/tokens/src/brand/ams/text.tokens.json deleted file mode 100644 index 452b2148b5..0000000000 --- a/proprietary/tokens/src/brand/ams/text.tokens.json +++ /dev/null @@ -1,41 +0,0 @@ -{ - "ams": { - "text": { - "font-family": { "value": "'Amsterdam Sans', Arial, sans-serif" }, - "font-weight": { - "normal": { "value": 400 }, - "bold": { "value": 800 } - }, - "level": { - "0": { - "font-size": { "value": "clamp(2.4316rem, calc(1.8951rem + 2.6826vw), 4.5776rem)" }, - "line-height": { "value": "1.15" } - }, - "1": { - "font-size": { "value": "clamp(2.0842rem, calc(1.6897rem + 1.9724vw), 3.6621rem)" }, - "line-height": { "value": "1.2" } - }, - "2": { - "font-size": { "value": "clamp(1.7865rem, calc(1.5007rem + 1.429vw), 2.9297rem)" }, - "line-height": { "value": "1.25" } - }, - "3": { - "font-size": { "value": "clamp(1.5313rem, calc(1.3281rem + 1.0156vw), 2.3438rem)" }, - "line-height": { "value": "1.3" } - }, - "4": { - "font-size": { "value": "clamp(1.3125rem, calc(1.1719rem + 0.7031vw), 1.875rem)" }, - "line-height": { "value": "1.5" } - }, - "5": { - "font-size": { "value": "clamp(1.125rem, calc(1.0313rem + 0.4688vw), 1.5rem)" }, - "line-height": { "value": "1.6" } - }, - "6": { - "font-size": { "value": "clamp(0.9643rem, calc(0.9054rem + 0.2946vw), 1.2rem)" }, - "line-height": { "value": "1.6" } - } - } - } - } -}