diff --git a/.changeset/fair-impalas-sort.md b/.changeset/fair-impalas-sort.md new file mode 100644 index 00000000000..e3b3b3a1c9d --- /dev/null +++ b/.changeset/fair-impalas-sort.md @@ -0,0 +1,5 @@ +--- +"@utrecht/design-tokens": minor +--- + +Add design tokens for `body`, `nav-bar`, `page-body`, `page-footer`, `page-header` and `root`. diff --git a/proprietary/design-tokens/src/component/utrecht/body.tokens.json b/proprietary/design-tokens/src/component/utrecht/body.tokens.json new file mode 100644 index 00000000000..8fe5862a140 --- /dev/null +++ b/proprietary/design-tokens/src/component/utrecht/body.tokens.json @@ -0,0 +1,8 @@ +{ + "utrecht": { + "body": { + "background-color": { "value": "{utrecht.color.white}" }, + "color": { "value": "{utrecht.color.black}" } + } + } +} diff --git a/proprietary/design-tokens/src/component/utrecht/nav-bar.tokens.json b/proprietary/design-tokens/src/component/utrecht/nav-bar.tokens.json index 863212ee8c2..9b4795d5de2 100644 --- a/proprietary/design-tokens/src/component/utrecht/nav-bar.tokens.json +++ b/proprietary/design-tokens/src/component/utrecht/nav-bar.tokens.json @@ -1,8 +1,6 @@ { "utrecht": { "nav-bar": { - "background-color": { "value": "{utrecht.color.white}" }, - "color": { "value": "{utrecht.color.black}" }, "content": { "max-inline-size": { "value": "{utrecht.page.max-inline-size}" } }, diff --git a/proprietary/design-tokens/src/component/utrecht/page-body.tokens.json b/proprietary/design-tokens/src/component/utrecht/page-body.tokens.json new file mode 100644 index 00000000000..c77e7bb6901 --- /dev/null +++ b/proprietary/design-tokens/src/component/utrecht/page-body.tokens.json @@ -0,0 +1,17 @@ +{ + "utrecht": { + "page-body": { + "padding-inline-end": { "value": "0" }, + "padding-inline-start": { "value": "0" }, + "padding-block-end": { "value": "0" }, + "padding-block-start": { "value": "0" }, + "content": { + "max-inline-size": { "value": "1184px" }, + "padding-inline-end": { "value": "2.4em" }, + "padding-inline-start": { "value": "2em" }, + "padding-block-end": { "value": "1em" }, + "padding-block-start": { "value": "0" } + } + } + } +} diff --git a/proprietary/design-tokens/src/component/utrecht/page-footer.tokens.json b/proprietary/design-tokens/src/component/utrecht/page-footer.tokens.json index bfe45d1c92e..09c74854d63 100644 --- a/proprietary/design-tokens/src/component/utrecht/page-footer.tokens.json +++ b/proprietary/design-tokens/src/component/utrecht/page-footer.tokens.json @@ -6,6 +6,7 @@ "background-image": { "value": "linear-gradient(45deg, {utrecht.color.red.40}, {utrecht.color.red.40} 50%, #d63433 50%);" }, + "max-inline-size": { "value": "1184px" }, "padding-inline-end": { "value": "{utrecht.space.inline.2xl}" }, "padding-inline-start": { "value": "{utrecht.space.inline.2xl}" }, "padding-block-end": { "value": "{utrecht.space.block.3xl}" }, diff --git a/proprietary/design-tokens/src/component/utrecht/page-header.tokens.json b/proprietary/design-tokens/src/component/utrecht/page-header.tokens.json index 6eee5dbc716..11f2cd9124c 100644 --- a/proprietary/design-tokens/src/component/utrecht/page-header.tokens.json +++ b/proprietary/design-tokens/src/component/utrecht/page-header.tokens.json @@ -1,10 +1,17 @@ { "utrecht": { "page-header": { - "padding-inline-end": { "value": "2.4em" }, - "padding-inline-start": { "value": "2em" }, - "padding-block-end": { "value": "1em" }, - "padding-block-start": { "value": "1.8em" } + "padding-inline-end": { "value": "0" }, + "padding-inline-start": { "value": "0" }, + "padding-block-end": { "value": "0" }, + "padding-block-start": { "value": "0" }, + "content": { + "max-inline-size": { "value": "1184px" }, + "padding-inline-end": { "value": "2.4em" }, + "padding-inline-start": { "value": "2em" }, + "padding-block-end": { "value": "1em" }, + "padding-block-start": { "value": "1.8em" } + } } } } diff --git a/proprietary/design-tokens/src/component/utrecht/root.tokens.json b/proprietary/design-tokens/src/component/utrecht/root.tokens.json new file mode 100644 index 00000000000..9f042285739 --- /dev/null +++ b/proprietary/design-tokens/src/component/utrecht/root.tokens.json @@ -0,0 +1,8 @@ +{ + "utrecht": { + "root": { + "background-color": { "value": "{utrecht.color.grey.95}" }, + "color": { "value": "{utrecht.color.grey.10}" } + } + } +}