From 599a16f749afcd516158e835c0f8a49537e40fb9 Mon Sep 17 00:00:00 2001 From: AlineNap <59806622+AlineNap@users.noreply.github.com> Date: Wed, 23 Oct 2024 14:54:36 +0200 Subject: [PATCH] feat(design-tokens): Utrecht Page footer tokens toegevoegd - utrecht link-list tokens - utrecht page-footer tokens Voor dit ticket: https://github.com/nl-design-system/lux/issues/285 & https://github.com/nl-design-system/lux/issues/248 --------- Co-authored-by: Remy Parzinski --- .changeset/afraid-papayas-act.md | 7 +++ .../design-tokens/src/imported/$metadata.json | 29 +++++----- .../src/imported/nl/utrecht-alert.json | 2 +- .../imported/nl/utrecht-column-layout.json | 28 ++++++++++ .../src/imported/nl/utrecht-link-list.json | 34 +++++++++++ .../src/imported/nl/utrecht-page-footer.json | 56 +++++++++++++++++++ .../src/imported/viewport/lg.json | 4 ++ .../src/imported/viewport/md.json | 4 ++ .../src/imported/viewport/sm.json | 4 ++ .../src/imported/viewport/xl.json | 10 ++++ .../src/imported/viewport/xs.json | 20 +++++++ 11 files changed, 184 insertions(+), 14 deletions(-) create mode 100644 .changeset/afraid-papayas-act.md create mode 100644 proprietary/design-tokens/src/imported/nl/utrecht-column-layout.json create mode 100644 proprietary/design-tokens/src/imported/nl/utrecht-link-list.json create mode 100644 proprietary/design-tokens/src/imported/nl/utrecht-page-footer.json diff --git a/.changeset/afraid-papayas-act.md b/.changeset/afraid-papayas-act.md new file mode 100644 index 000000000..31e952d8a --- /dev/null +++ b/.changeset/afraid-papayas-act.md @@ -0,0 +1,7 @@ +--- +"@lux-design-system/design-tokens": minor +--- + +Nieuwe tokens: Utrecht Column layout +Nieuwe tokens: Utrecht Link list +Nieuwe tokens: Utrecht Page footer diff --git a/proprietary/design-tokens/src/imported/$metadata.json b/proprietary/design-tokens/src/imported/$metadata.json index f77ff889e..c2341e0f5 100644 --- a/proprietary/design-tokens/src/imported/$metadata.json +++ b/proprietary/design-tokens/src/imported/$metadata.json @@ -1,51 +1,54 @@ { "tokenSetOrder": [ + "core/border", "core/color", - "core/spacing", "core/font", - "core/border", "core/other", + "core/spacing", "common/default", "viewport/xl", "viewport/lg", "viewport/md", "viewport/sm", "viewport/xs", - "product/Logius", - "product/Logius Blauw", + "product/DigiD", "product/Digitoegankelijk", - "product/MijnOverheid", "product/EVA", - "product/DigiD", + "product/Logius Blauw", + "product/Logius", + "product/MijnOverheid", "product/NLdoc-mapping", - "mode/light", "mode/dark", + "mode/light", "NLdoc/default", "NLdoc/Ridderkerk", - "NLdoc/Waterschap Hollandse Delta", "NLdoc/Rijksoverheid", + "NLdoc/Waterschap Hollandse Delta", "component/alert", "component/button", "component/icon-logo", - "component/login link", "component/link", + "component/login link", "component/paragraph", "component/section", "nl/utrecht-alert", "nl/utrecht-button", + "nl/utrecht-column-layout", "nl/utrecht-document", "nl/utrecht-fieldset", "nl/utrecht-focus", - "nl/utrecht-form-field", "nl/utrecht-form-field-description", "nl/utrecht-form-field-error-message", + "nl/utrecht-form-field", "nl/utrecht-form-label", "nl/utrecht-heading", + "nl/utrecht-link-list", "nl/utrecht-link", + "nl/utrecht-page-footer", "nl/utrecht-paragraph", "nl/utrecht-pointer-target", - "nl/utrecht-textarea", "nl/utrecht-pre-heading", - "nl/utrecht-text-input" + "nl/utrecht-text-input", + "nl/utrecht-textarea" ] -} \ No newline at end of file +} diff --git a/proprietary/design-tokens/src/imported/nl/utrecht-alert.json b/proprietary/design-tokens/src/imported/nl/utrecht-alert.json index 0df1c4faf..f864e6cec 100644 --- a/proprietary/design-tokens/src/imported/nl/utrecht-alert.json +++ b/proprietary/design-tokens/src/imported/nl/utrecht-alert.json @@ -107,7 +107,7 @@ } }, "inset-block-start": { - "value": "{lux.alert.icon.inset-block-start}", + "value": "{lux.space.0}", "type": "spacing" }, "info": { diff --git a/proprietary/design-tokens/src/imported/nl/utrecht-column-layout.json b/proprietary/design-tokens/src/imported/nl/utrecht-column-layout.json new file mode 100644 index 000000000..42e725d4b --- /dev/null +++ b/proprietary/design-tokens/src/imported/nl/utrecht-column-layout.json @@ -0,0 +1,28 @@ +{ + "utrecht": { + "column-layout": { + "column-rule-color": { + "value": "{lux.color.none}", + "type": "color" + }, + "column-rule-width": { + "value": "{lux.border-width.none}", + "type": "borderWidth" + }, + "column-width": { + "value": "12.5rem", + "type": "sizing", + "description": "full-size, hoe stel ik dit in? " + }, + "gap": { + "value": "{utrecht.column-layout.column-gap}", + "type": "spacing", + "description": "Deze token uitfaseren" + }, + "column-gap": { + "value": "{lux.grid.gutter}", + "type": "spacing" + } + } + } +} \ No newline at end of file diff --git a/proprietary/design-tokens/src/imported/nl/utrecht-link-list.json b/proprietary/design-tokens/src/imported/nl/utrecht-link-list.json new file mode 100644 index 000000000..189dbf23e --- /dev/null +++ b/proprietary/design-tokens/src/imported/nl/utrecht-link-list.json @@ -0,0 +1,34 @@ +{ + "utrecht": { + "link-list": { + "row-gap": { + "value": "{lux.space.100}", + "type": "spacing" + }, + "icon": { + "size": { + "value": "{lux.size.icon}", + "type": "sizing" + }, + "inset-block-start": { + "value": "{lux.icon.inset-block-start}", + "type": "spacing" + } + } + } + }, + "todo": { + "link-list": { + "item": { + "column-gap": { + "value": "{lux.space.100}", + "type": "spacing" + }, + "text-decoration": { + "value": "None", + "type": "textDecoration" + } + } + } + } +} \ No newline at end of file diff --git a/proprietary/design-tokens/src/imported/nl/utrecht-page-footer.json b/proprietary/design-tokens/src/imported/nl/utrecht-page-footer.json new file mode 100644 index 000000000..58f564380 --- /dev/null +++ b/proprietary/design-tokens/src/imported/nl/utrecht-page-footer.json @@ -0,0 +1,56 @@ +{ + "utrecht": { + "page-footer": { + "background-color": { + "value": "{lux.color.background.default}", + "type": "color" + }, + "color": { + "value": "{lux.color.foreground.default}", + "type": "color" + }, + "padding-block-start": { + "value": "{lux.space.600}", + "type": "spacing" + }, + "padding-block-end": { + "value": "{lux.space.600}", + "type": "spacing" + }, + "padding-inline-start": { + "value": "{lux.grid.margin}", + "type": "spacing" + }, + "padding-inline-end": { + "value": "{lux.grid.margin}", + "type": "spacing" + }, + "border-color": { + "value": "{lux.color.brand.default}", + "type": "color" + }, + "border-width": { + "value": "{lux.border-width.m}", + "type": "borderWidth" + }, + "content": { + "column-gap": { + "value": "{lux.grid.gutter}", + "type": "spacing" + }, + "row-gap": { + "value": "{lux.space.400}", + "type": "spacing" + }, + "column-width": { + "value": "12.5rem", + "type": "sizing" + }, + "max-inline-size": { + "value": "{lux.grid.max-inline-size}", + "type": "sizing" + } + } + } + } +} \ No newline at end of file diff --git a/proprietary/design-tokens/src/imported/viewport/lg.json b/proprietary/design-tokens/src/imported/viewport/lg.json index 7f05cdf86..ee116e8ae 100644 --- a/proprietary/design-tokens/src/imported/viewport/lg.json +++ b/proprietary/design-tokens/src/imported/viewport/lg.json @@ -39,6 +39,10 @@ "type": "spacing", "value": "2.5rem", "description": "" + }, + "max-inline-size": { + "value": "82.5rem", + "type": "sizing" } } }, diff --git a/proprietary/design-tokens/src/imported/viewport/md.json b/proprietary/design-tokens/src/imported/viewport/md.json index 67246ed79..c74a05dc3 100644 --- a/proprietary/design-tokens/src/imported/viewport/md.json +++ b/proprietary/design-tokens/src/imported/viewport/md.json @@ -39,6 +39,10 @@ "type": "spacing", "value": "2rem", "description": "" + }, + "max-inline-size": { + "value": "82.5rem", + "type": "sizing" } } }, diff --git a/proprietary/design-tokens/src/imported/viewport/sm.json b/proprietary/design-tokens/src/imported/viewport/sm.json index 974bc39dc..50f15f183 100644 --- a/proprietary/design-tokens/src/imported/viewport/sm.json +++ b/proprietary/design-tokens/src/imported/viewport/sm.json @@ -39,6 +39,10 @@ "type": "spacing", "value": "1.5rem", "description": "" + }, + "max-inline-size": { + "value": "82.5rem", + "type": "sizing" } } }, diff --git a/proprietary/design-tokens/src/imported/viewport/xl.json b/proprietary/design-tokens/src/imported/viewport/xl.json index 7fdc4ef9c..8e91c739c 100644 --- a/proprietary/design-tokens/src/imported/viewport/xl.json +++ b/proprietary/design-tokens/src/imported/viewport/xl.json @@ -39,6 +39,16 @@ "type": "spacing", "value": "2.5rem", "description": "" + }, + "max-inline-size": { + "value": "82.5rem", + "type": "sizing" + } + }, + "icon": { + "inset-block-start": { + "value": "0.375rem", + "type": "spacing" } } }, diff --git a/proprietary/design-tokens/src/imported/viewport/xs.json b/proprietary/design-tokens/src/imported/viewport/xs.json index 36b02ffd7..958fb22d7 100644 --- a/proprietary/design-tokens/src/imported/viewport/xs.json +++ b/proprietary/design-tokens/src/imported/viewport/xs.json @@ -39,6 +39,16 @@ "type": "spacing", "value": "1rem", "description": "" + }, + "max-inline-size": { + "value": "82.5rem", + "type": "sizing" + } + }, + "icon": { + "inset-block-start": { + "value": "0.25rem", + "type": "spacing" } }, "alert": { @@ -147,5 +157,15 @@ } } } + }, + "utrecht": { + "alert": { + "icon": { + "inset-block-start": { + "value": "{lux.space.0}", + "type": "spacing" + } + } + } } } \ No newline at end of file