diff --git a/README.md b/README.md index 91ee149f..c7bc14b5 100644 --- a/README.md +++ b/README.md @@ -6,6 +6,7 @@ Conduction's design tokens theme - **Version 1.1 (breaking changes from 1.0.x)** + - 1.1.25: Added Roosendaal theme. - 1.1.24: Updated logo in Dimpact theme. - 1.1.23: - Added utrecht Calendar and Checkbox tokens to Leiden theme. diff --git a/conduction-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json b/conduction-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json index 2cee752a..4408ac69 100644 --- a/conduction-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json +++ b/conduction-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json @@ -4,7 +4,11 @@ "logo": { "max-height": {}, "max-width": { "value": "150px" } - } + }, + "border-block-start": {}, + "border-block-end": {}, + "border-inline-start": {}, + "border-inline-end": {} } } } diff --git a/conduction-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json b/conduction-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json index b8c9df35..4495cfcb 100644 --- a/conduction-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json +++ b/conduction-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json @@ -11,7 +11,10 @@ }, "inset-block-start": {}, "inset-inline-start": {}, - "box-shadow-width": {} + "box-shadow-width": {}, + "border-width": {}, + "border-style": {}, + "border-color": {} } } } diff --git a/municipalities/commonground-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json b/municipalities/commonground-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json index 2cee752a..4408ac69 100644 --- a/municipalities/commonground-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json +++ b/municipalities/commonground-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json @@ -4,7 +4,11 @@ "logo": { "max-height": {}, "max-width": { "value": "150px" } - } + }, + "border-block-start": {}, + "border-block-end": {}, + "border-inline-start": {}, + "border-inline-end": {} } } } diff --git a/municipalities/commonground-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json b/municipalities/commonground-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json index fde276ec..e4e23e92 100644 --- a/municipalities/commonground-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json +++ b/municipalities/commonground-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json @@ -11,7 +11,10 @@ }, "inset-block-start": {}, "inset-inline-start": {}, - "box-shadow-width": {} + "box-shadow-width": {}, + "border-width": {}, + "border-style": {}, + "border-color": {} } } } diff --git a/municipalities/dimpact-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json b/municipalities/dimpact-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json index 2cee752a..4408ac69 100644 --- a/municipalities/dimpact-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json +++ b/municipalities/dimpact-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json @@ -4,7 +4,11 @@ "logo": { "max-height": {}, "max-width": { "value": "150px" } - } + }, + "border-block-start": {}, + "border-block-end": {}, + "border-inline-start": {}, + "border-inline-end": {} } } } diff --git a/municipalities/dimpact-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json b/municipalities/dimpact-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json index 3fd51435..830b5958 100644 --- a/municipalities/dimpact-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json +++ b/municipalities/dimpact-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json @@ -14,7 +14,10 @@ }, "inset-block-start": {}, "inset-inline-start": {}, - "box-shadow-width": {} + "box-shadow-width": {}, + "border-width": {}, + "border-style": {}, + "border-color": {} } } } diff --git a/municipalities/dinkelland-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json b/municipalities/dinkelland-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json index 2cee752a..4408ac69 100644 --- a/municipalities/dinkelland-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json +++ b/municipalities/dinkelland-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json @@ -4,7 +4,11 @@ "logo": { "max-height": {}, "max-width": { "value": "150px" } - } + }, + "border-block-start": {}, + "border-block-end": {}, + "border-inline-start": {}, + "border-inline-end": {} } } } diff --git a/municipalities/dinkelland-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json b/municipalities/dinkelland-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json index 577d5d4d..7cc12653 100644 --- a/municipalities/dinkelland-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json +++ b/municipalities/dinkelland-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json @@ -11,7 +11,10 @@ }, "inset-block-start": { "value": "73px" }, "inset-inline-start": { "value": "33px" }, - "box-shadow-width": {} + "box-shadow-width": {}, + "border-width": {}, + "border-style": {}, + "border-color": {} } } } diff --git a/municipalities/epe-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json b/municipalities/epe-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json index a34776ca..b0d843c5 100644 --- a/municipalities/epe-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json +++ b/municipalities/epe-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json @@ -4,7 +4,11 @@ "logo": { "max-height": {}, "max-width": { "value": "155px" } - } + }, + "border-block-start": {}, + "border-block-end": {}, + "border-inline-start": {}, + "border-inline-end": {} } } } diff --git a/municipalities/epe-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json b/municipalities/epe-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json index 31463657..3e865cc3 100644 --- a/municipalities/epe-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json +++ b/municipalities/epe-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json @@ -11,7 +11,10 @@ }, "inset-block-start": { "value": "108px" }, "inset-inline-start": { "value": "19px" }, - "box-shadow-width": {} + "box-shadow-width": {}, + "border-width": {}, + "border-style": {}, + "border-color": {} } } } diff --git a/municipalities/gouda-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json b/municipalities/gouda-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json index 2cee752a..4408ac69 100644 --- a/municipalities/gouda-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json +++ b/municipalities/gouda-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json @@ -4,7 +4,11 @@ "logo": { "max-height": {}, "max-width": { "value": "150px" } - } + }, + "border-block-start": {}, + "border-block-end": {}, + "border-inline-start": {}, + "border-inline-end": {} } } } diff --git a/municipalities/gouda-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json b/municipalities/gouda-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json index 8897617e..f74ea462 100644 --- a/municipalities/gouda-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json +++ b/municipalities/gouda-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json @@ -11,7 +11,10 @@ }, "inset-block-start": { "value": "21px" }, "inset-inline-start": { "value": "18px" }, - "box-shadow-width": { "value": "3.2px" } + "box-shadow-width": { "value": "3.2px" }, + "border-width": {}, + "border-style": {}, + "border-color": {} } } } diff --git a/municipalities/leiden-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json b/municipalities/leiden-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json index bc87f3f7..ba1119a2 100644 --- a/municipalities/leiden-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json +++ b/municipalities/leiden-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json @@ -4,7 +4,11 @@ "logo": { "max-height": {}, "max-width": { "value": "80px" } - } + }, + "border-block-start": {}, + "border-block-end": {}, + "border-inline-start": {}, + "border-inline-end": {} } } } diff --git a/municipalities/leiden-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json b/municipalities/leiden-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json index 80db3abf..0ed0925b 100644 --- a/municipalities/leiden-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json +++ b/municipalities/leiden-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json @@ -11,7 +11,10 @@ }, "inset-block-start": { "value": "{leiden.size.lg}" }, "inset-inline-start": { "value": "{leiden.size.sm}" }, - "box-shadow-width": {} + "box-shadow-width": {}, + "border-width": {}, + "border-style": {}, + "border-color": {} } } } diff --git a/municipalities/noaberkracht-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json b/municipalities/noaberkracht-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json index ae712bb8..775b0b78 100644 --- a/municipalities/noaberkracht-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json +++ b/municipalities/noaberkracht-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json @@ -4,7 +4,11 @@ "logo": { "max-height": {}, "max-width": { "value": "130px" } - } + }, + "border-block-start": {}, + "border-block-end": {}, + "border-inline-start": {}, + "border-inline-end": {} } } } diff --git a/municipalities/noaberkracht-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json b/municipalities/noaberkracht-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json index 909b39af..00926092 100644 --- a/municipalities/noaberkracht-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json +++ b/municipalities/noaberkracht-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json @@ -11,7 +11,10 @@ }, "inset-block-start": {}, "inset-inline-start": {}, - "box-shadow-width": {} + "box-shadow-width": {}, + "border-width": {}, + "border-style": {}, + "border-color": {} } } } diff --git a/municipalities/noordwijk-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json b/municipalities/noordwijk-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json index 4f2df43c..e104226f 100644 --- a/municipalities/noordwijk-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json +++ b/municipalities/noordwijk-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json @@ -4,7 +4,11 @@ "logo": { "max-height": {}, "max-width": { "value": "145px" } - } + }, + "border-block-start": {}, + "border-block-end": {}, + "border-inline-start": {}, + "border-inline-end": {} } } } diff --git a/municipalities/noordwijk-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json b/municipalities/noordwijk-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json index 9d40c62d..d745ab81 100644 --- a/municipalities/noordwijk-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json +++ b/municipalities/noordwijk-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json @@ -14,7 +14,10 @@ }, "inset-block-start": { "value": "19px" }, "inset-inline-start": {"value": "16px"}, - "box-shadow-width": {} + "box-shadow-width": {}, + "border-width": {}, + "border-style": {}, + "border-color": {} } } } diff --git a/municipalities/open-webconcept-design-tokens/src/brand/open-webconcept/color.tokens.json b/municipalities/open-webconcept-design-tokens/src/brand/open-webconcept/color.tokens.json index 44d2d459..0368c0a3 100644 --- a/municipalities/open-webconcept-design-tokens/src/brand/open-webconcept/color.tokens.json +++ b/municipalities/open-webconcept-design-tokens/src/brand/open-webconcept/color.tokens.json @@ -86,7 +86,6 @@ "90": { "value": "#e5e5e5" }, - "93": { "value": "#eeeeee" }, diff --git a/municipalities/open-webconcept-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json b/municipalities/open-webconcept-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json index 2cee752a..4408ac69 100644 --- a/municipalities/open-webconcept-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json +++ b/municipalities/open-webconcept-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json @@ -4,7 +4,11 @@ "logo": { "max-height": {}, "max-width": { "value": "150px" } - } + }, + "border-block-start": {}, + "border-block-end": {}, + "border-inline-start": {}, + "border-inline-end": {} } } } diff --git a/municipalities/open-webconcept-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json b/municipalities/open-webconcept-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json index c5a8d8c7..9c4edc80 100644 --- a/municipalities/open-webconcept-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json +++ b/municipalities/open-webconcept-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json @@ -11,7 +11,10 @@ }, "inset-block-start": { "value": "69px" }, "inset-inline-start": { "value": "16px" }, - "box-shadow-width": {} + "box-shadow-width": {}, + "border-width": {}, + "border-style": {}, + "border-color": {} } } } diff --git a/municipalities/opencatalogi-design-tokens/src/components/utrecht/extra-tokens/page-header.tokens.json b/municipalities/opencatalogi-design-tokens/src/components/utrecht/extra-tokens/page-header.tokens.json index e24f30d5..9af23590 100644 --- a/municipalities/opencatalogi-design-tokens/src/components/utrecht/extra-tokens/page-header.tokens.json +++ b/municipalities/opencatalogi-design-tokens/src/components/utrecht/extra-tokens/page-header.tokens.json @@ -4,7 +4,11 @@ "logo": { "max-height": {}, "max-width": { "value": "222px" } - } + }, + "border-block-start": {}, + "border-block-end": {}, + "border-inline-start": {}, + "border-inline-end": {} } } } diff --git a/municipalities/opencatalogi-design-tokens/src/components/utrecht/extra-tokens/skip-link.tokens.json b/municipalities/opencatalogi-design-tokens/src/components/utrecht/extra-tokens/skip-link.tokens.json index 57fce48b..76979875 100644 --- a/municipalities/opencatalogi-design-tokens/src/components/utrecht/extra-tokens/skip-link.tokens.json +++ b/municipalities/opencatalogi-design-tokens/src/components/utrecht/extra-tokens/skip-link.tokens.json @@ -11,7 +11,10 @@ }, "inset-block-start": {}, "inset-inline-start": {}, - "box-shadow-width": {} + "box-shadow-width": {}, + "border-width": {}, + "border-style": {}, + "border-color": {} } } } diff --git a/municipalities/roosendaal-design-tokens/LICENSE.md b/municipalities/roosendaal-design-tokens/LICENSE.md new file mode 100644 index 00000000..e6ff7f54 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/LICENSE.md @@ -0,0 +1,17 @@ +# Auteursrecht Gemeente Roosendaal + +Copyright (c) 2023 Gemeente Roosendaal + +## Logo en huisstijl + +Op het huisstijl en logo zijn auteursrechten van toepassing. Het gebruik van logo en huisstijl is alleen toegestaan voor gebruik door Gemeente Roosendaal. + +Wanneer je een bewerking van de software wilt gebruiken voor andere doeleinden, mag je niet het logo van Gemeente Roosendaal gebruiken en je ontwerpt een eigen huisstijl. + +## Lettertype + +Lettertypes die worden gebruikt voor de huisstijl zijn niet allemaal gratis en open source. Let op dat bij gebruik van die bijgeleverde lettertypes je een (betaalde) licentie regelt. Pas anders de configuratie aan om minder of andere lettertypes te gebruiken. + +## Toestemming + +Wanneer je het logo of de huisstijl wilt gebruiken kun je voor toestemming contact opnemen met Gemeente Roosendaal. diff --git a/municipalities/roosendaal-design-tokens/README.md b/municipalities/roosendaal-design-tokens/README.md new file mode 100644 index 00000000..991e7be2 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/README.md @@ -0,0 +1,3 @@ +# NL Design System design tokens Gemeente Roosendaal + +These tokens have been obtained by analysing the [website of Gemeente Roosendaal](https://www.roosendaal.nl/). diff --git a/municipalities/roosendaal-design-tokens/documentation/color.stories.mdx b/municipalities/roosendaal-design-tokens/documentation/color.stories.mdx new file mode 100644 index 00000000..746f03e5 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/documentation/color.stories.mdx @@ -0,0 +1,17 @@ +import { Meta, ColorPalette, ColorItem } from "@storybook/addon-docs"; +import tokens from "../dist/tokens.json"; +import { ColorSearch } from "@nl-design-system-unstable/theme-toolkit/src/ColorSearch"; +import { ColorTable } from "@nl-design-system-unstable/theme-toolkit/src/ColorTable"; +import config from "../src/config.json"; + + + +# Color + +## Find a color + + + +## Color palette + + diff --git a/municipalities/roosendaal-design-tokens/documentation/components.stories.mdx b/municipalities/roosendaal-design-tokens/documentation/components.stories.mdx new file mode 100644 index 00000000..0937db7f --- /dev/null +++ b/municipalities/roosendaal-design-tokens/documentation/components.stories.mdx @@ -0,0 +1,11 @@ +import { Meta, Story } from "@storybook/addon-docs"; +import { ComponentStories } from "@nl-design-system-unstable/theme-toolkit/src/ComponentStories"; +import config from "../src/config.json"; + + + +# Components + + + + diff --git a/municipalities/roosendaal-design-tokens/documentation/design-tokens.stories.mdx b/municipalities/roosendaal-design-tokens/documentation/design-tokens.stories.mdx new file mode 100644 index 00000000..dce92c26 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/documentation/design-tokens.stories.mdx @@ -0,0 +1,14 @@ +import { Meta, ColorPalette, ColorItem } from "@storybook/addon-docs"; +import { DesignTokensTable } from "@nl-design-system-unstable/theme-toolkit/src/DesignTokensTable"; +import tokens from "../dist/index.json"; +import config from "../src/config.json"; + + + +# Design Tokens + + token.path[0] !== config.prefix)}> + +## Proprietary Design Tokens + + token.path[0] === config.prefix)}> diff --git a/municipalities/roosendaal-design-tokens/documentation/readme.stories.mdx b/municipalities/roosendaal-design-tokens/documentation/readme.stories.mdx new file mode 100644 index 00000000..e1d67fa5 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/documentation/readme.stories.mdx @@ -0,0 +1,7 @@ +import { Meta, Description } from "@storybook/addon-docs"; +import markdown from "../README.md"; +import config from "../src/config.json"; + + + +{markdown} diff --git a/municipalities/roosendaal-design-tokens/package.json b/municipalities/roosendaal-design-tokens/package.json new file mode 100644 index 00000000..d33b8706 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/package.json @@ -0,0 +1,42 @@ +{ + "version": "1.0.0-alpha.1", + "author": "Community for NL Design System", + "description": "NL Design System design tokens for Gemeente Roosendaal", + "website": "https://www.roosendaal.nl/", + "keywords": [ + "nl-design-system", + "conduction" + ], + "license": "SEE LICENSE IN LICENSE.md", + "name": "@nl-design-system-unstable/roosendaal-design-tokens", + "private": false, + "publishConfig": { + "access": "public" + }, + "repository": { + "type": "git+ssh", + "url": "git@github.com:nl-design-system/themes.git" + }, + "scripts": { + "clean": "rimraf -rf dist/", + "prebuild": "npm run clean", + "watch": "npm-run-all watch:**", + "watch:style-dictionary": "chokidar --follow-symlinks --command 'npm run --ignore-scripts build' 'src/**/*.tokens.json'", + "build": "npm-run-all build:**", + "build:scss": "sass --no-source-map src/:dist/", + "build:style-dictionary": "style-dictionary build --config ./style-dictionary.config.js" + }, + "devDependencies": { + "@fontsource/roboto": "5.0.8", + "@fontsource/roboto-slab": "5.0.11", + "@nl-design-system-unstable/theme-toolkit": "workspace:*", + "chokidar-cli": "3.0.0", + "npm-run-all": "4.1.5", + "rimraf": "3.0.2", + "style-dictionary": "3.8.0" + }, + "bugs": { + "url": "https://github.com/ConductionNL/conduction-theme/issues" + }, + "homepage": "https://github.com/ConductionNL/conduction-theme#readme" +} diff --git a/municipalities/roosendaal-design-tokens/src/brand/roosendaal/color.tokens.json b/municipalities/roosendaal-design-tokens/src/brand/roosendaal/color.tokens.json new file mode 100644 index 00000000..ee59fc77 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/brand/roosendaal/color.tokens.json @@ -0,0 +1,122 @@ +{ + "roosendaal": { + "color": { + "primary": { "value": "{roosendaal.color.green.33}" }, + "primary-hover": { "value": "{roosendaal.color.green.35}" }, + "error": { "value": "#dc3545" }, + "alert-error": { "value": "{roosendaal.color.red.12}" }, + "alert-error-background": { "value": "{roosendaal.color.red.94}" }, + "warning": { "value": "#ffc107" }, + "alert-warning": { "value": "#856404" }, + "alert-warning-background": { "value": "#fff3cd" }, + "succes": { "value": "#28a745" }, + "alert-succes": { "value": "#155724" }, + "alert-succes-background": { "value": "#d4edda" }, + "info": { "value": "{roosendaal.color.primary}" }, + "alert-info": { "value": "#004085" }, + "alert-info-background": { "value": "#cce5ff" }, + "green": { + "15": { + "value": "#014b2c" + }, + "19": { + "value": "#006139" + }, + "33": { + "value": "#238527", + "comment": "Base/Green" + }, + "35": { + "value": "#328160" + }, + "82": { + "value": "#bfe3c0" + }, + "95": { + "value": "#ebfaeb" + }, + "98": { + "value": "#f7fbf7" + } + }, + "red": { + "12": { + "value": "#34090a" + }, + "52": { + "value": "#dc2e33", + "comment": "Base/Red" + }, + "94": { + "value": "#fbe5e6" + } + }, + "grey": { + "27": { + "value": "#444444" + }, + "29": { + "value": "#4a4a4a" + }, + "31": { + "value": "#4f4f4f" + }, + "46": { + "value": "#767676" + }, + "48": { + "value": "#7a7a7a" + }, + "50": { + "value": "#808080", + "comment": "Base/Grey" + }, + "58": { + "value": "#949494" + }, + "82": { + "value": "#d1d1d1" + }, + "87": { + "value": "#dddddd" + }, + "89": { + "value": "#e3e3e3" + }, + "93": { + "value": "#eeeeee" + }, + "95": { + "value": "#f2f2f2" + }, + "97": { + "value": "#f7f7f7" + } + }, + "lightgrey": { + "96": { + "value": "#f5f5f5", + "comment": "Base/LightGrey" + } + }, + "white": { + "98": { + "value": "#fafafa" + }, + "100": { + "value": "#ffffff", + "comment": "Base/White" + } + }, + "black": { + "0": { + "value": "#000000", + "comment": "Base/Black" + }, + "3": { + "value": "#080808" + } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/brand/roosendaal/font-size.tokens.json b/municipalities/roosendaal-design-tokens/src/brand/roosendaal/font-size.tokens.json new file mode 100644 index 00000000..e8904144 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/brand/roosendaal/font-size.tokens.json @@ -0,0 +1,50 @@ +{ + "roosendaal": { + "font-size": { + "4xs": { + "value": "0.313rem", + "comment": "5px" + }, + "3xs": { + "value": "0.5rem", + "comment": "8px" + }, + "2xs": { + "value": "0.75rem", + "comment": "12px" + }, + "xs": { + "value": "0.875rem", + "comment": "14px" + }, + "sm": { + "value": "1.125rem", + "comment": "18px" + }, + "md": { + "value": "1.313rem", + "comment": "21px" + }, + "lg": { + "value": "1.5rem", + "comment": "24px" + }, + "xl": { + "value": "1.875rem", + "comment": "30px" + }, + "2xl": { + "value": "2.494rem", + "comment": "39.9px" + }, + "3xl": { + "value": "2.625rem", + "comment": "42px" + }, + "4xl": { + "value": "3rem", + "comment": "48px" + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/brand/roosendaal/size.tokens.json b/municipalities/roosendaal-design-tokens/src/brand/roosendaal/size.tokens.json new file mode 100644 index 00000000..06ea0f66 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/brand/roosendaal/size.tokens.json @@ -0,0 +1,17 @@ +{ + "roosendaal": { + "size": { + "4xs": { "value": "1px" }, + "3xs": { "value": "2px" }, + "2xs": { "value": "4px" }, + "xs": { "value": "8px" }, + "sm": { "value": "14px" }, + "md": { "value": "18px" }, + "lg": { "value": "24px" }, + "xl": { "value": "32px" }, + "2xl": { "value": "48px" }, + "3xl": { "value": "72px" }, + "4xl": { "value": "96px" } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/brand/roosendaal/typography.tokens.json b/municipalities/roosendaal-design-tokens/src/brand/roosendaal/typography.tokens.json new file mode 100644 index 00000000..6e14f694 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/brand/roosendaal/typography.tokens.json @@ -0,0 +1,53 @@ +{ + "roosendaal": { + "typography": { + "sans-serif": { + "font-family": { + "value": "\"Source Sans\", Arial, Helvetica, sans-serif" + } + }, + "museosans": { + "font-family": { + "value": "\"MuseoSans\", Monospace, Arial, Helvetica, sans-serif" + } + }, + "museosansbolder": { + "font-family": { + "value": "\"MuseoSansBolder\", Monospace, Arial, Helvetica, sans-serif" + } + }, + "monospace": { + "font-family": { + "value": "Monospace, \"Lucida Console\"" + } + }, + "font-weight": { + "bolder": { + "value": "900" + }, + "bold": { + "value": "700" + }, + "normal": { + "value": "400" + }, + "light": { + "value": "100" + } + }, + "scale": { + "4xs": { "value": "{roosendaal.font-size.4xs}" }, + "3xs": { "value": "{roosendaal.font-size.3xs}" }, + "2xs": { "value": "{roosendaal.font-size.2xs}" }, + "xs": { "value": "{roosendaal.font-size.xs}" }, + "sm": { "value": "{roosendaal.font-size.sm}" }, + "md": { "value": "{roosendaal.font-size.md}" }, + "lg": { "value": "{roosendaal.font-size.lg}" }, + "xl": { "value": "{roosendaal.font-size.xl}" }, + "2xl": { "value": "{roosendaal.font-size.2xl}" }, + "3xl": { "value": "{roosendaal.font-size.3xl}" }, + "4xl": { "value": "{roosendaal.font-size.4xl}" } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/common/utrecht/action.tokens.json b/municipalities/roosendaal-design-tokens/src/common/utrecht/action.tokens.json new file mode 100644 index 00000000..e437f13d --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/common/utrecht/action.tokens.json @@ -0,0 +1,9 @@ +{ + "utrecht": { + "action": { + "busy": { "cursor": { "value": "wait" } }, + "disabled": { "cursor": { "value": "not-allowed" } }, + "submit": { "cursor": { "value": "pointer" } } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/common/utrecht/space.tokens.json b/municipalities/roosendaal-design-tokens/src/common/utrecht/space.tokens.json new file mode 100644 index 00000000..7ace68a2 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/common/utrecht/space.tokens.json @@ -0,0 +1,28 @@ +{ + "utrecht": { + "space": { + "block": { + "3xs": { "value": "{roosendaal.size.3xs}" }, + "2xs": { "value": "{roosendaal.size.2xs}" }, + "xs": { "value": "{roosendaal.size.xs}" }, + "sm": { "value": "{roosendaal.size.sm}" }, + "md": { "value": "{roosendaal.size.md}" }, + "lg": { "value": "{roosendaal.size.lg}" }, + "xl": { "value": "{roosendaal.size.xl}" }, + "2xl": { "value": "{roosendaal.size.2xl}" }, + "3xl": { "value": "{roosendaal.size.3xl}" } + }, + "inline": { + "3xs": { "value": "{roosendaal.size.3xs}" }, + "2xs": { "value": "{roosendaal.size.2xs}" }, + "xs": { "value": "{roosendaal.size.xs}" }, + "sm": { "value": "{roosendaal.size.sm}" }, + "md": { "value": "{roosendaal.size.md}" }, + "lg": { "value": "{roosendaal.size.lg}" }, + "xl": { "value": "{roosendaal.size.xl}" }, + "2xl": { "value": "{roosendaal.size.2xl}" }, + "3xl": { "value": "{roosendaal.size.3xl}" } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/conduction/card-header.tokens.json b/municipalities/roosendaal-design-tokens/src/component/conduction/card-header.tokens.json new file mode 100644 index 00000000..da960fa5 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/conduction/card-header.tokens.json @@ -0,0 +1,29 @@ +{ + "conduction": { + "card-header": { + "background-color": {}, + "border-bottom-width": {}, + "border-bottom-style": {}, + "border-bottom-color": {}, + "color": { "value": "{utrecht.document.color}" }, + "hover": { + "background-color": {}, + "border-bottom-width": {}, + "border-bottom-style": {}, + "border-bottom-color": {} + }, + "title": { + "color": { "value": "{roosendaal.color.green.35}" }, + "hover": { + "color": { "value": "{roosendaal.color.green.15}" } + } + }, + "date": { + "color": { "value": "{roosendaal.color.black.3}" }, + "font-size": { "value": "{roosendaal.font-size.sm}" }, + "font-weight": { "value": "{roosendaal.typography.font-weight.light}" }, + "margin-block-end": { "value": "{roosendaal.size.xs}" } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/conduction/card-wrapper.tokens.json b/municipalities/roosendaal-design-tokens/src/component/conduction/card-wrapper.tokens.json new file mode 100644 index 00000000..e1751454 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/conduction/card-wrapper.tokens.json @@ -0,0 +1,30 @@ +{ + "conduction": { + "card-wrapper": { + "background-color": { "value": "{roosendaal.color.white.100}" }, + "border-color": {}, + "border-style": {}, + "border-width": {}, + "border-bottom-color": { "value": "{roosendaal.color.grey.95}" }, + "border-bottom-style": { "value": "solid" }, + "border-bottom-width": { "value": "3px" }, + "border-radius": { "value": "0" }, + "box-shadow": {}, + "color": { "value": "{roosendaal.color.black.3}" }, + "hover": { + "background-color": { "value": "{roosendaal.color.grey.89}" }, + "color": { "value": "{roosendaal.color.black.0}" }, + "border-color": {}, + "border-style": {}, + "border-width": {}, + "border-bottom-color": { "value": "{roosendaal.color.grey.95}" }, + "border-bottom-style": { "value": "solid" }, + "border-bottom-width": { "value": "3px" } + }, + "padding-inline-end": { "value": "{roosendaal.size.md}" }, + "padding-inline-start": { "value": "{roosendaal.size.md}" }, + "padding-block-end": { "value": "{roosendaal.size.md}" }, + "padding-block-start": { "value": "{roosendaal.size.md}" } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/conduction/checkbox.tokens.json b/municipalities/roosendaal-design-tokens/src/component/conduction/checkbox.tokens.json new file mode 100644 index 00000000..6bb57f58 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/conduction/checkbox.tokens.json @@ -0,0 +1,69 @@ +{ + "conduction": { + "input-checkbox": { + "color": { "value": "{roosendaal.color.white.100}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "border-style": { "value": "solid" }, + "border-color": { "value": "{roosendaal.color.grey.46}" }, + "border-radius": { "value": "3px" }, + "box-shadow": {}, + "hover": { + "color": { "value": "{roosendaal.color.white.100}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "border-style": { "value": "solid" }, + "border-color": { "value": "{roosendaal.color.grey.31}" }, + "border-radius": { "value": "3px" }, + "box-shadow": {} + }, + "checked": { + "color": { "value": "{roosendaal.color.primary}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "border-style": { "value": "solid" }, + "border-color": { "value": "{roosendaal.color.primary}" }, + "border-radius": { "value": "3px" }, + "box-shadow": {}, + "checkmark-url": {}, + "hover": { + "color": { "value": "{roosendaal.color.primary-hover}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "border-style": { "value": "solid" }, + "border-color": { "value": "{roosendaal.color.primary-hover}" }, + "border-radius": { "value": "3px" }, + "box-shadow": {} + } + }, + "disabled": { + "color": { "value": "{roosendaal.color.grey.82}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "border-style": { "value": "solid" }, + "border-color": { "value": "{roosendaal.color.grey.82}" }, + "border-radius": { "value": "3px" }, + "box-shadow": {}, + "hover": { + "color": { "value": "{roosendaal.color.grey.82}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "border-style": { "value": "solid" }, + "border-color": { "value": "{roosendaal.color.grey.82}" }, + "border-radius": { "value": "3px" }, + "box-shadow": {} + } + }, + "focus": { + "outline-width": { "value": "2px" }, + "outline-style": { "value": "solid" }, + "outline-color": { "value": "{roosendaal.color.black.0}" }, + "outline-offset": { "value": "2px" } + }, + "label": { + "color": { "value": "{utrecht.document.color}" }, + "font-size": { "value": "{utrecht.document.font-size}" }, + "font-weight": {}, + "font-family": { "value": "{utrecht.document.font-family}" }, + "container": { + "padding": { "value": "3px" }, + "margin": { "value": "3px" } + } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/conduction/download-card.tokens.json b/municipalities/roosendaal-design-tokens/src/component/conduction/download-card.tokens.json new file mode 100644 index 00000000..568c7ed8 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/conduction/download-card.tokens.json @@ -0,0 +1,28 @@ +{ + "conduction": { + "download-card": { + "background-color": {}, + "title": { + "color": { "value": "{utrecht.document.color}" }, + "font-size": { "value": "{roosendaal.font-size.md}" }, + "font-weight": { "value": "{roosendaal.typography.font-weight.bold}" }, + "font-family": { "value": "{roosendaal.typography.museosans.font-family}" }, + "margin-inline-end": { "value": "{roosendaal.size.sm}" } + }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "border-style": { "value": "solid" }, + "border-color": { "value": "{roosendaal.color.grey.82}" }, + "border-radius": { "value": "{roosendaal.size.3xs}" }, + "icon": { + "gap": { + "value": "{roosendaal.size.xs}" + }, + "color": {} + }, + "padding-inline-end": { "value": "{roosendaal.size.md}" }, + "padding-inline-start": { "value": "{roosendaal.size.md}" }, + "padding-block-end": { "value": "{roosendaal.size.md}" }, + "padding-block-start": { "value": "{roosendaal.size.md}" } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/conduction/logo.tokens.json b/municipalities/roosendaal-design-tokens/src/component/conduction/logo.tokens.json new file mode 100644 index 00000000..3b4194a3 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/conduction/logo.tokens.json @@ -0,0 +1,27 @@ +{ + "conduction": { + "logo": { + "header": { + "inline-size": { "value": "312px" }, + "block-size": { "value": "100px" }, + "background-image": { + "value": "url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='312.3' height='100.9' viewBox='0 0 312.3 100.9' aria-labelledby='site-logo-title site-logo-desc' class='logo__svg logo__svg--roosendaal' role='img'%3E%3Ctitle id='site-logo-title'%3EGemeente Roosendaal%3C/title%3E%3Cdesc id='site-logo-desc'%3ELogo dat naar de hoofdpagina leidt%3C/desc%3E%3Cpath role='presentation' fill='%23DC2F34' d='M16.9,89.5c9.4,0,16.9-2.5,16.9-5.5c0-3-7.6-5.4-16.9-5.3C7.6,78.7,0,81.2,0,84.2C0,87.1,7.6,89.6,16.9,89.5 L16.9,89.5z'%3E%3C/path%3E%3Cpath role='presentation' fill='%23DC2F34' d='M25.8,36.6C32,36.6,37,35,37,33c0-1.9-5-3.5-11.2-3.5c-6.2,0-11.2,1.7-11.2,3.6C14.7,35,19.7,36.6,25.8,36.6 L25.8,36.6z'%3E%3C/path%3E%3Cpath role='presentation' fill='%23DC2F34' d='M16.3,59.6c7.1,0,12.8-1.8,12.8-4.1c0-2.2-5.7-4.1-12.8-4.1c-7.1,0-12.8,1.9-12.8,4.1 C3.5,57.8,9.2,59.6,16.3,59.6L16.3,59.6z'%3E%3C/path%3E%3Cpath role='presentation' fill='%23DC2F34' d='M41.4,19.1c4.8,0,8.6-1.1,8.6-2.5c0-1.4-3.9-2.5-8.6-2.5c-4.8,0-8.6,1.1-8.6,2.4C32.8,17.9,36.6,19.1,41.4,19.1 L41.4,19.1z'%3E%3C/path%3E%3Cpath role='presentation' fill='%23DC2F34' d='M64.8,4.8c-3.7,0-6.6,0.8-6.6,1.7c0,0.9,2.9,1.7,6.6,1.7c3.7,0,6.6-0.8,6.6-1.7C71.4,5.6,68.5,4.8,64.8,4.8 L64.8,4.8z'%3E%3C/path%3E%3Cpath role='presentation' fill='%23DC2F34' d='M86.1,2.2c2.7,0.1,4.8-0.4,4.8-1.1c0-0.6-2.2-1.1-4.8-1.1c-2.7,0-4.8,0.4-4.8,1.1C81.4,1.7,83.5,2.2,86.1,2.2 L86.1,2.2z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M102,44.3c0-4.6-0.1-4.6-4.5-5.3v-1H109c3.5,0,13.2,0,13.2,8.4c0,5.3-3.5,7.1-7.1,7.6l8.6,15.4h-5.4l-8.3-14.5 h-2.9v14.5H102V44.3L102,44.3z M107.1,52.6h2.7c3,0,7.4-0.9,7.4-6c0-5-3-6.5-6.8-6.5c-3.2,0-3.2,0.9-3.2,4.2V52.6L107.1,52.6z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M126.3,58.5c0-7.8,3.2-11.3,10.1-11.3c6.8,0,10.1,4.6,10.1,11.3c0,7.6-3.2,11.4-10.1,11.4 C128.8,69.8,126.3,65,126.3,58.5L126.3,58.5z M136.4,68.3c4.6,0,5-5.1,5-9.8c0-4.3-0.4-9.7-5-9.7c-4.6,0-5,5.6-5,9.7 C131.4,62.4,131.8,68.3,136.4,68.3L136.4,68.3z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M150,58.5c0-7.8,3.3-11.3,10.1-11.3c6.8,0,10.1,4.6,10.1,11.3c0,7.6-3.2,11.4-10.1,11.4 C152.6,69.8,150,65,150,58.5L150,58.5z M160.1,68.3c4.5,0,5-5.1,5-9.8c0-4.3-0.4-9.7-5-9.7c-4.6,0-4.9,5.6-4.9,9.7 C155.2,62.4,155.5,68.3,160.1,68.3L160.1,68.3z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M187.3,51.4c-0.7-0.5-2.9-2.2-5.5-2.2c-1.5,0-3.3,0.5-3.3,2.5c0,4.5,10.2,4.5,10.2,11.7c0,4.5-3.8,6.4-8.4,6.4 c-2.8,0-4.9-0.5-6-0.8v-3.7c1.4,0.9,3.6,2.5,6.2,2.5c3,0,4-1.5,4-3.2c0-4.5-10.2-4.8-10.2-11.3c0-3.4,2.2-6.2,7.8-6.2 c2.4,0,4.5,0.6,5.3,0.8V51.4L187.3,51.4z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M210.1,68.6c-0.9,0.3-3.4,1.2-6.5,1.2c-7.2,0-11.5-4.3-11.5-12.2c0-7.3,3.6-10.5,9.9-10.5c8,0,8.6,5.7,8.6,8.9 h-13.3c0,4.7,2,11.3,8.5,11.3c1.9,0,3.6-0.4,4.4-0.8V68.6L210.1,68.6z M205.8,54.2c0-1.1-0.1-5.4-4.2-5.4c-3.5,0-4.5,3.6-4.5,5.4 H205.8L205.8,54.2z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M215.6,53.6c0-3.2-0.8-4-3.8-4v-0.9l8.4-1.5v5.9h0.1c0.7-1.7,3.2-5.9,7.8-5.9c4.2,0,5.6,2.9,5.6,6.5v15.7h-4.7 V57.2c0-3.7,0-7-3.1-7c-3.1,0-5.8,4.3-5.8,7.7v11.4h-4.7V53.6L215.6,53.6z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M253.9,66.8c-1.2,1.1-3.1,3.1-6.5,3.1c-6.1,0-8.4-5-8.4-10.9c0-5.9,2.4-11.7,8.6-11.7c3.8,0,5.3,2,6.2,3.5h0.1 v-7.6c0-3.4-0.8-4.2-3.5-4.3v-0.9l8.2-1.1v32.7h-4.7V66.8L253.9,66.8z M253.9,57.1c0-2.6-0.5-7.4-5-7.4c-4.3,0-4.8,5.3-4.8,8.6 c0,3.6,0.4,9.1,4.8,9.1c4.5,0,4.9-5.8,4.9-8.3V57.1L253.9,57.1z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M275.4,66.6c-0.8,1-2.4,3.2-6,3.2c-3.7,0-6.3-2.6-6.3-5.3c0-6.6,9.3-7.1,12.2-7.2v-2.4c0-3,0-6.1-3-6.1 c-3,0-3.2,2.7-3.2,4.7h-5.5c0.5-3.1,2-6.3,8.8-6.3c6.6,0,7.6,3.3,7.6,8v14.2h-4.7V66.6L275.4,66.6z M275.4,59 c-1.7,0.1-7.1,0.3-7.1,4.8c0,2.1,1.1,3.6,2.8,3.6c2.7,0,4.3-2.5,4.3-5.6V59L275.4,59z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M296.6,66.6c-0.9,1-2.5,3.2-6.1,3.2c-3.7,0-6.3-2.6-6.3-5.3c0-6.6,9.3-7.1,12.3-7.2v-2.4c0-3,0-6.1-3-6.1 c-3.1,0-3.3,2.7-3.3,4.7h-5.5c0.5-3.1,2.1-6.3,8.8-6.3c6.7,0,7.7,3.3,7.7,8v14.2h-4.7V66.6L296.6,66.6z M296.6,59 c-1.7,0.1-7.2,0.3-7.2,4.8c0,2.1,1.1,3.6,2.8,3.6c2.7,0,4.4-2.5,4.4-5.6V59L296.6,59z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M307.7,43.1c0-3.4-0.8-4.2-3.5-4.3v-0.9l8.2-1.1v32.7h-4.7V43.1L307.7,43.1z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M66,100.9C11,30.1,101.5,1.2,101.5,1.2s-94.8,27-44.2,99.6H66L66,100.9z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M144.9,34.4c-1.1,0.4-3.4,1-5.6,1c-5.5,0-7.2-3.5-7.2-8.9c0-5,1.6-8.4,7.1-8.4c3.7,0,5.3,1.7,5.5,3.7h-3 c-0.1-0.9-0.7-2.6-2.9-2.6c-3.5,0-3.9,4.3-3.9,7.5c0,4.1,1,7.6,4.9,7.6c1,0,1.7-0.1,2.4-0.4v-5c0-2.3-0.4-2.2-2.5-2.7v-0.5h5.3V34.4 L144.9,34.4z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M157.5,34.7c-0.5,0.1-1.8,0.6-3.5,0.6c-3.9,0-6.1-2.3-6.1-6.5c0-4,1.9-5.7,5.2-5.7c4.3,0,4.7,3.1,4.7,4.8h-7.1 c0,2.4,1,6,4.5,6c1,0,2-0.3,2.4-0.4V34.7L157.5,34.7z M155.2,27c0-0.6-0.1-2.9-2.2-2.9c-1.9,0-2.4,2-2.4,2.9H155.2L155.2,27z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M160.2,26.7c0-1.7-0.4-2.2-1.9-2.2V24l4.4-0.8v3h0.1c0.4-0.9,1.6-3,3.8-3c2.3,0,2.9,1.7,3.1,2.8l0,0 c0.6-0.9,1.5-2.8,3.7-2.8c3.2,0,3.2,3,3.2,4.7v7.3h-2.5v-6.8c0-1.6,0-3.4-1.6-3.4c-1.9,0-2.8,2.6-2.8,4.4v5.8h-2.5v-6.5 c0-2,0-3.8-1.7-3.8c-1.7,0-2.8,2.3-2.8,4.1v6.1h-2.4V26.7L160.2,26.7z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M188.9,34.7c-0.5,0.1-1.8,0.6-3.5,0.6c-3.8,0-6.1-2.3-6.1-6.5c0-4,1.9-5.7,5.3-5.7c4.3,0,4.6,3.1,4.6,4.8h-7.1 c0,2.4,1,6,4.5,6c1.1,0,1.9-0.3,2.4-0.4V34.7L188.9,34.7z M186.6,27c0-0.6-0.1-2.9-2.2-2.9c-1.9,0-2.4,2-2.4,2.9H186.6L186.6,27z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M200.2,34.7c-0.5,0.1-1.8,0.6-3.5,0.6c-3.8,0-6.1-2.3-6.1-6.5c0-4,1.9-5.7,5.3-5.7c4.3,0,4.6,3.1,4.6,4.8h-7.1 c0,2.4,1,6,4.5,6c1.1,0,1.9-0.3,2.4-0.4V34.7L200.2,34.7z M197.9,27c0-0.6,0-2.9-2.2-2.9c-1.9,0-2.4,2-2.4,2.9H197.9L197.9,27z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M203.1,26.7c0-1.7-0.4-2.2-2-2.2V24l4.5-0.8v3.2l0,0c0.4-0.9,1.7-3.2,4.2-3.2c2.3,0,3,1.7,3,3.5v8.4h-2.5v-6.5 c0-2,0-3.8-1.7-3.8c-1.7,0-3,2.3-3,4.1v6.1h-2.5V26.7L203.1,26.7z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M222.6,35.2c-0.6,0.1-1.1,0.1-1.7,0.1c-2.5,0-3.8-0.4-3.8-3.2v-7.7h-2v-1h2v-1.9l2.5-2.2v4.2h3.2v1h-3.2v7.3 c0,1.7,0.1,2.5,2,2.5c0.3,0,0.6,0,0.9-0.1V35.2L222.6,35.2z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M233.6,34.7c-0.4,0.1-1.8,0.6-3.5,0.6c-3.8,0-6.1-2.3-6.1-6.5c0-4,1.9-5.7,5.3-5.7c4.3,0,4.6,3.1,4.6,4.8h-7.1 c0,2.4,1,6,4.5,6c1,0,1.9-0.3,2.3-0.4V34.7L233.6,34.7z M231.4,27c0-0.6-0.1-2.9-2.2-2.9c-1.9,0-2.4,2-2.4,2.9H231.4L231.4,27z'%3E%3C/path%3E%3C/svg%3E\")" + } + }, + "footer": { + "inline-size": {}, + "block-size": {}, + "background-image": { + "value": "" + } + }, + "navbar": { + "inline-size": { "value": "165px" }, + "block-size": { "value": "53px" }, + "background-image": { + "value": "url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='312.3' height='100.9' viewBox='0 0 312.3 100.9' aria-labelledby='site-logo-title site-logo-desc' class='logo__svg logo__svg--roosendaal' role='img'%3E%3Ctitle id='site-logo-title'%3EGemeente Roosendaal%3C/title%3E%3Cdesc id='site-logo-desc'%3ELogo dat naar de hoofdpagina leidt%3C/desc%3E%3Cpath role='presentation' fill='%23DC2F34' d='M16.9,89.5c9.4,0,16.9-2.5,16.9-5.5c0-3-7.6-5.4-16.9-5.3C7.6,78.7,0,81.2,0,84.2C0,87.1,7.6,89.6,16.9,89.5 L16.9,89.5z'%3E%3C/path%3E%3Cpath role='presentation' fill='%23DC2F34' d='M25.8,36.6C32,36.6,37,35,37,33c0-1.9-5-3.5-11.2-3.5c-6.2,0-11.2,1.7-11.2,3.6C14.7,35,19.7,36.6,25.8,36.6 L25.8,36.6z'%3E%3C/path%3E%3Cpath role='presentation' fill='%23DC2F34' d='M16.3,59.6c7.1,0,12.8-1.8,12.8-4.1c0-2.2-5.7-4.1-12.8-4.1c-7.1,0-12.8,1.9-12.8,4.1 C3.5,57.8,9.2,59.6,16.3,59.6L16.3,59.6z'%3E%3C/path%3E%3Cpath role='presentation' fill='%23DC2F34' d='M41.4,19.1c4.8,0,8.6-1.1,8.6-2.5c0-1.4-3.9-2.5-8.6-2.5c-4.8,0-8.6,1.1-8.6,2.4C32.8,17.9,36.6,19.1,41.4,19.1 L41.4,19.1z'%3E%3C/path%3E%3Cpath role='presentation' fill='%23DC2F34' d='M64.8,4.8c-3.7,0-6.6,0.8-6.6,1.7c0,0.9,2.9,1.7,6.6,1.7c3.7,0,6.6-0.8,6.6-1.7C71.4,5.6,68.5,4.8,64.8,4.8 L64.8,4.8z'%3E%3C/path%3E%3Cpath role='presentation' fill='%23DC2F34' d='M86.1,2.2c2.7,0.1,4.8-0.4,4.8-1.1c0-0.6-2.2-1.1-4.8-1.1c-2.7,0-4.8,0.4-4.8,1.1C81.4,1.7,83.5,2.2,86.1,2.2 L86.1,2.2z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M102,44.3c0-4.6-0.1-4.6-4.5-5.3v-1H109c3.5,0,13.2,0,13.2,8.4c0,5.3-3.5,7.1-7.1,7.6l8.6,15.4h-5.4l-8.3-14.5 h-2.9v14.5H102V44.3L102,44.3z M107.1,52.6h2.7c3,0,7.4-0.9,7.4-6c0-5-3-6.5-6.8-6.5c-3.2,0-3.2,0.9-3.2,4.2V52.6L107.1,52.6z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M126.3,58.5c0-7.8,3.2-11.3,10.1-11.3c6.8,0,10.1,4.6,10.1,11.3c0,7.6-3.2,11.4-10.1,11.4 C128.8,69.8,126.3,65,126.3,58.5L126.3,58.5z M136.4,68.3c4.6,0,5-5.1,5-9.8c0-4.3-0.4-9.7-5-9.7c-4.6,0-5,5.6-5,9.7 C131.4,62.4,131.8,68.3,136.4,68.3L136.4,68.3z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M150,58.5c0-7.8,3.3-11.3,10.1-11.3c6.8,0,10.1,4.6,10.1,11.3c0,7.6-3.2,11.4-10.1,11.4 C152.6,69.8,150,65,150,58.5L150,58.5z M160.1,68.3c4.5,0,5-5.1,5-9.8c0-4.3-0.4-9.7-5-9.7c-4.6,0-4.9,5.6-4.9,9.7 C155.2,62.4,155.5,68.3,160.1,68.3L160.1,68.3z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M187.3,51.4c-0.7-0.5-2.9-2.2-5.5-2.2c-1.5,0-3.3,0.5-3.3,2.5c0,4.5,10.2,4.5,10.2,11.7c0,4.5-3.8,6.4-8.4,6.4 c-2.8,0-4.9-0.5-6-0.8v-3.7c1.4,0.9,3.6,2.5,6.2,2.5c3,0,4-1.5,4-3.2c0-4.5-10.2-4.8-10.2-11.3c0-3.4,2.2-6.2,7.8-6.2 c2.4,0,4.5,0.6,5.3,0.8V51.4L187.3,51.4z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M210.1,68.6c-0.9,0.3-3.4,1.2-6.5,1.2c-7.2,0-11.5-4.3-11.5-12.2c0-7.3,3.6-10.5,9.9-10.5c8,0,8.6,5.7,8.6,8.9 h-13.3c0,4.7,2,11.3,8.5,11.3c1.9,0,3.6-0.4,4.4-0.8V68.6L210.1,68.6z M205.8,54.2c0-1.1-0.1-5.4-4.2-5.4c-3.5,0-4.5,3.6-4.5,5.4 H205.8L205.8,54.2z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M215.6,53.6c0-3.2-0.8-4-3.8-4v-0.9l8.4-1.5v5.9h0.1c0.7-1.7,3.2-5.9,7.8-5.9c4.2,0,5.6,2.9,5.6,6.5v15.7h-4.7 V57.2c0-3.7,0-7-3.1-7c-3.1,0-5.8,4.3-5.8,7.7v11.4h-4.7V53.6L215.6,53.6z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M253.9,66.8c-1.2,1.1-3.1,3.1-6.5,3.1c-6.1,0-8.4-5-8.4-10.9c0-5.9,2.4-11.7,8.6-11.7c3.8,0,5.3,2,6.2,3.5h0.1 v-7.6c0-3.4-0.8-4.2-3.5-4.3v-0.9l8.2-1.1v32.7h-4.7V66.8L253.9,66.8z M253.9,57.1c0-2.6-0.5-7.4-5-7.4c-4.3,0-4.8,5.3-4.8,8.6 c0,3.6,0.4,9.1,4.8,9.1c4.5,0,4.9-5.8,4.9-8.3V57.1L253.9,57.1z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M275.4,66.6c-0.8,1-2.4,3.2-6,3.2c-3.7,0-6.3-2.6-6.3-5.3c0-6.6,9.3-7.1,12.2-7.2v-2.4c0-3,0-6.1-3-6.1 c-3,0-3.2,2.7-3.2,4.7h-5.5c0.5-3.1,2-6.3,8.8-6.3c6.6,0,7.6,3.3,7.6,8v14.2h-4.7V66.6L275.4,66.6z M275.4,59 c-1.7,0.1-7.1,0.3-7.1,4.8c0,2.1,1.1,3.6,2.8,3.6c2.7,0,4.3-2.5,4.3-5.6V59L275.4,59z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M296.6,66.6c-0.9,1-2.5,3.2-6.1,3.2c-3.7,0-6.3-2.6-6.3-5.3c0-6.6,9.3-7.1,12.3-7.2v-2.4c0-3,0-6.1-3-6.1 c-3.1,0-3.3,2.7-3.3,4.7h-5.5c0.5-3.1,2.1-6.3,8.8-6.3c6.7,0,7.7,3.3,7.7,8v14.2h-4.7V66.6L296.6,66.6z M296.6,59 c-1.7,0.1-7.2,0.3-7.2,4.8c0,2.1,1.1,3.6,2.8,3.6c2.7,0,4.4-2.5,4.4-5.6V59L296.6,59z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M307.7,43.1c0-3.4-0.8-4.2-3.5-4.3v-0.9l8.2-1.1v32.7h-4.7V43.1L307.7,43.1z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M66,100.9C11,30.1,101.5,1.2,101.5,1.2s-94.8,27-44.2,99.6H66L66,100.9z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M144.9,34.4c-1.1,0.4-3.4,1-5.6,1c-5.5,0-7.2-3.5-7.2-8.9c0-5,1.6-8.4,7.1-8.4c3.7,0,5.3,1.7,5.5,3.7h-3 c-0.1-0.9-0.7-2.6-2.9-2.6c-3.5,0-3.9,4.3-3.9,7.5c0,4.1,1,7.6,4.9,7.6c1,0,1.7-0.1,2.4-0.4v-5c0-2.3-0.4-2.2-2.5-2.7v-0.5h5.3V34.4 L144.9,34.4z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M157.5,34.7c-0.5,0.1-1.8,0.6-3.5,0.6c-3.9,0-6.1-2.3-6.1-6.5c0-4,1.9-5.7,5.2-5.7c4.3,0,4.7,3.1,4.7,4.8h-7.1 c0,2.4,1,6,4.5,6c1,0,2-0.3,2.4-0.4V34.7L157.5,34.7z M155.2,27c0-0.6-0.1-2.9-2.2-2.9c-1.9,0-2.4,2-2.4,2.9H155.2L155.2,27z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M160.2,26.7c0-1.7-0.4-2.2-1.9-2.2V24l4.4-0.8v3h0.1c0.4-0.9,1.6-3,3.8-3c2.3,0,2.9,1.7,3.1,2.8l0,0 c0.6-0.9,1.5-2.8,3.7-2.8c3.2,0,3.2,3,3.2,4.7v7.3h-2.5v-6.8c0-1.6,0-3.4-1.6-3.4c-1.9,0-2.8,2.6-2.8,4.4v5.8h-2.5v-6.5 c0-2,0-3.8-1.7-3.8c-1.7,0-2.8,2.3-2.8,4.1v6.1h-2.4V26.7L160.2,26.7z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M188.9,34.7c-0.5,0.1-1.8,0.6-3.5,0.6c-3.8,0-6.1-2.3-6.1-6.5c0-4,1.9-5.7,5.3-5.7c4.3,0,4.6,3.1,4.6,4.8h-7.1 c0,2.4,1,6,4.5,6c1.1,0,1.9-0.3,2.4-0.4V34.7L188.9,34.7z M186.6,27c0-0.6-0.1-2.9-2.2-2.9c-1.9,0-2.4,2-2.4,2.9H186.6L186.6,27z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M200.2,34.7c-0.5,0.1-1.8,0.6-3.5,0.6c-3.8,0-6.1-2.3-6.1-6.5c0-4,1.9-5.7,5.3-5.7c4.3,0,4.6,3.1,4.6,4.8h-7.1 c0,2.4,1,6,4.5,6c1.1,0,1.9-0.3,2.4-0.4V34.7L200.2,34.7z M197.9,27c0-0.6,0-2.9-2.2-2.9c-1.9,0-2.4,2-2.4,2.9H197.9L197.9,27z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M203.1,26.7c0-1.7-0.4-2.2-2-2.2V24l4.5-0.8v3.2l0,0c0.4-0.9,1.7-3.2,4.2-3.2c2.3,0,3,1.7,3,3.5v8.4h-2.5v-6.5 c0-2,0-3.8-1.7-3.8c-1.7,0-3,2.3-3,4.1v6.1h-2.5V26.7L203.1,26.7z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M222.6,35.2c-0.6,0.1-1.1,0.1-1.7,0.1c-2.5,0-3.8-0.4-3.8-3.2v-7.7h-2v-1h2v-1.9l2.5-2.2v4.2h3.2v1h-3.2v7.3 c0,1.7,0.1,2.5,2,2.5c0.3,0,0.6,0,0.9-0.1V35.2L222.6,35.2z'%3E%3C/path%3E%3Cpath role='presentation' fill='%2300633A' d='M233.6,34.7c-0.4,0.1-1.8,0.6-3.5,0.6c-3.8,0-6.1-2.3-6.1-6.5c0-4,1.9-5.7,5.3-5.7c4.3,0,4.6,3.1,4.6,4.8h-7.1 c0,2.4,1,6,4.5,6c1,0,1.9-0.3,2.3-0.4V34.7L233.6,34.7z M231.4,27c0-0.6-0.1-2.9-2.2-2.9c-1.9,0-2.4,2-2.4,2.9H231.4L231.4,27z'%3E%3C/path%3E%3C/svg%3E\")" + } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/conduction/navigation.tokens.json b/municipalities/roosendaal-design-tokens/src/component/conduction/navigation.tokens.json new file mode 100644 index 00000000..f6195ea9 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/conduction/navigation.tokens.json @@ -0,0 +1,79 @@ +{ + "conduction": { + "primary": { + "top-nav": { + "color": { "value": "{roosendaal.color.black.3}" }, + "background-color": { "value": "{roosendaal.color.white.100}" }, + "hover": { + "color": { "value": "{roosendaal.color.black.3}" }, + "background-color": { "value": "{roosendaal.color.green.95}" }, + "box-shadow": {}, + "font-weight": {} + }, + "current": { + "color": { "value": "{roosendaal.color.black.3}" }, + "background-color": { "value": "unset" }, + "box-shadow": { "value": "inset 0 -4px {roosendaal.color.primary}" }, + "mobile": { + "box-shadow": { "value": "inset 4px 0 {roosendaal.color.primary}" } + }, + "font-weight": {} + }, + "dropdown": { + "color": {}, + "background-color": {}, + "border-width": {}, + "border-style": {}, + "border-color": {}, + "hover": { + "color": {}, + "background-color": {}, + "box-shadow": {}, + "font-weight": {} + }, + "current": { + "color": { "value": "{roosendaal.color.black.3}" }, + "background-color": { "value": "unset" }, + "box-shadow": { "value": "inset 0 -4px {roosendaal.color.primary}" }, + "mobile": { + "box-shadow": { "value": "inset 4px 0 {roosendaal.color.primary}" } + }, + "font-weight": {} + } + }, + "item": { + "padding": { "value": "18px" }, + "border-radius": {} + }, + "padding-inline-end": { "value": "16px" }, + "padding-inline-start": { "value": "16px" }, + "padding-block-end": { "value": "16px" }, + "padding-block-start": { "value": "16px" } + } + }, + "secondary": { + "top-nav": { + "color": { "value": "{roosendaal.color.black.3}" }, + "background-color": { "value": "transparent" }, + "hover": { + "color": { "value": "{roosendaal.color.black.3}" }, + "background-color": { "value": "{roosendaal.color.green.95}" } + }, + "current": { + "color": { "value": "{roosendaal.color.black.3}" }, + "background-color": { "value": "unset" }, + "box-shadow": { "value": "inset 0 -4px {roosendaal.color.primary}" } + }, + "font-size": { "value": "{roosendaal.font-size.md}" }, + "font-weight": { "value": "400" }, + "item": { + "padding": { "value": "18px" } + }, + "padding-inline-end": { "value": "16px" }, + "padding-inline-start": { "value": "16px" }, + "padding-block-end": { "value": "16px" }, + "padding-block-start": { "value": "16px" } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/conduction/pagination.tokens.json b/municipalities/roosendaal-design-tokens/src/component/conduction/pagination.tokens.json new file mode 100644 index 00000000..29e2c273 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/conduction/pagination.tokens.json @@ -0,0 +1,95 @@ +{ + "conduction": { + "pagination": { + "container": { + "background-color": { "value": "unset" }, + "padding-inline-start": { "value": "0px" }, + "padding-inline-end": { "value": "0px" }, + "padding-block-start": { "value": "0px" }, + "padding-block-end": { "value": "0px" } + }, + "item": { + "gap": { "value": "{roosendaal.size.2xs}" }, + "color": { "value": "{roosendaal.color.white.98}" }, + "background-color": { "value": "{roosendaal.color.primary}" }, + "padding-inline-start": { "value": "{roosendaal.size.sm}" }, + "padding-inline-end": { "value": "{roosendaal.size.sm}" }, + "padding-block-start": { "value": "{roosendaal.size.xs}" }, + "padding-block-end": { "value": "{roosendaal.size.xs}" }, + "font-size": { "value": "{utrecht.document.font-size}" }, + "font-weight": { "value": "{roosendaal.typography.font-weight.normal}" }, + "font-family": { "value": "{utrecht.document.font-family}" }, + "border-width": {}, + "border-style": {}, + "border-color": {}, + "border-bottom-width": {}, + "border-bottom-style": {}, + "border-bottom-color": {}, + "border-radius": { "value": "0px" } + }, + "navigation-button": { + "color": { "value": "{roosendaal.color.white.98}" }, + "background-color": { "value": "{roosendaal.color.primary}" }, + "border-width": {}, + "border-style": {}, + "border-color": {}, + "border-bottom-width": {}, + "border-bottom-style": {}, + "border-bottom-color": {}, + "border-radius": { "value": "0px" }, + "padding-inline-start": { "value": "{roosendaal.size.sm}" }, + "padding-inline-end": { "value": "{roosendaal.size.sm}" }, + "padding-block-start": { "value": "{roosendaal.size.xs}" }, + "padding-block-end": { "value": "{roosendaal.size.xs}" }, + "disabled": { + "color": { "value": "{roosendaal.color.white.98}" }, + "background-color": { "value": "{roosendaal.color.grey.82}" }, + "border-width": {}, + "border-style": {}, + "border-color": {}, + "border-bottom-width": {}, + "border-bottom-style": {}, + "border-bottom-color": {}, + "border-radius": { "value": "0px" } + }, + "hover": { + "color": { "value": "{roosendaal.color.white.98}" }, + "background-color": { "value": "{roosendaal.color.primary-hover}" }, + "border-width": {}, + "border-style": {}, + "border-color": {}, + "border-bottom-width": {}, + "border-bottom-style": {}, + "border-bottom-color": {}, + "border-radius": { "value": "0px" } + } + }, + "current-page": { + "color": { "value": "{roosendaal.color.white.98}" }, + "background-color": { "value": "{roosendaal.color.green.19}" }, + "font-weight": { "value": "{roosendaal.typography.font-weight.normal}" }, + "text-decoration": { "value": "none" }, + "border-width": {}, + "border-style": {}, + "border-color": {}, + "border-bottom-width": {}, + "border-bottom-style": {}, + "border-bottom-color": {} + }, + "page": { + "hover": { + "color": { "value": "{roosendaal.color.white.98}" }, + "background-color": { "value": "{roosendaal.color.primary-hover}" }, + "text-decoration": { "value": "underline" }, + "text-decoration-thickness": { "value": "3px" }, + "border-width": {}, + "border-style": {}, + "border-color": {}, + "border-bottom-width": {}, + "border-bottom-style": {}, + "border-bottom-color": {} + } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/conduction/select.tokens.json b/municipalities/roosendaal-design-tokens/src/component/conduction/select.tokens.json new file mode 100644 index 00000000..7a8a516c --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/conduction/select.tokens.json @@ -0,0 +1,39 @@ +{ + "conduction": { + "input-select": { + "background-color": { "value": "{roosendaal.color.white.100}" }, + "border": { "value": "{roosendaal.size.4xs} solid {roosendaal.color.grey.48}" }, + "border-focus": { "value": "unset" }, + "border-radius": { "value": "{utrecht.form-input.border-radius}" }, + "invalid-border-color": { "value": "{roosendaal.color.error}" }, + "padding-block-end": { "value": "6px" }, + "padding-block-start": { "value": "6px" }, + "hover": {}, + "focus": {}, + "list-option": { + "font-family": { "value": "{roosendaal.typography.sans-serif.font-family}" }, + "background-color": {}, + "color": {}, + "hover": { + "font-family": { "value": "{roosendaal.typography.sans-serif.font-family}" }, + "background-color": {}, + "color": {} + }, + "selected": { + "background-color": {}, + "color": {} + }, + "focus": { + "background-color": {}, + "color": {} + } + }, + "placeholder": { + "color": { + "value": "{utrecht.form-input.placeholder.color}" + }, + "font-family": { "value": "{roosendaal.typography.sans-serif.font-family}" } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/conduction/table-wrapper.tokens.json b/municipalities/roosendaal-design-tokens/src/component/conduction/table-wrapper.tokens.json new file mode 100644 index 00000000..d589ed74 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/conduction/table-wrapper.tokens.json @@ -0,0 +1,21 @@ +{ + "conduction": { + "table-wrapper": { + "scroll-button": { + "background-color": { "value": "{roosendaal.color.white.100}" }, + "color": { "value": "{roosendaal.color.black.3}" }, + "padding-inline-start": { "value": "{roosendaal.size.sm}" }, + "padding-inline-end": { "value": "{roosendaal.size.sm}" }, + "padding-block-start": {}, + "padding-block-end": {}, + "border-width": {}, + "border-style": {}, + "border-color": {}, + "hover": { + "background-color": { "value": "{roosendaal.color.white.100}" }, + "color": { "value": "{roosendaal.color.primary}" } + } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/conduction/tabs.tokens.json b/municipalities/roosendaal-design-tokens/src/component/conduction/tabs.tokens.json new file mode 100644 index 00000000..0fcd2319 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/conduction/tabs.tokens.json @@ -0,0 +1,84 @@ +{ + "conduction": { + "tabs": { + "tab": { + "background-color": { "value": "transparent" }, + "color": { "value": "{roosendaal.color.grey.29}" }, + "border-width": {}, + "border-style": {}, + "border-color": {}, + "border-bottom": {}, + "border-bottom-width": {}, + "border-bottom-style": {}, + "border-bottom-color": {}, + "bottom": { "value": "-2px" }, + "padding-block-start": { "value": "{roosendaal.size.xs}" }, + "padding-block-end": { "value": "{roosendaal.size.xs}" }, + "padding-inline-start": { "value": "{roosendaal.size.sm}" }, + "padding-inline-end": { "value": "{roosendaal.size.sm}" }, + "margin-inline-end": {}, + "font-size": { "value": "{roosendaal.font-size.md}" }, + "font-weight": { "value": "{roosendaal.typography.font-weight.normal}" }, + "font-family": { "value": "{utrecht.document.font-family}" }, + "max-width": { "value": "unset" }, + "min-width": { "value": "160px" }, + "min-height": { "value": "61px" }, + "letter-spacing": {}, + "text-transform": {}, + "selected": { + "background-color": { "value": "transparent" }, + "color": { "value": "{roosendaal.color.grey.29}" }, + "box-shadow": {}, + "border-width": {}, + "border-style": {}, + "border-color": {}, + "border-bottom": {}, + "border-bottom-width": { "value": "{roosendaal.size.3xs}" }, + "border-bottom-style": { "value": "solid" }, + "border-bottom-color": { "value": "{roosendaal.color.primary}" }, + "font-weight": { "value": "{roosendaal.typography.font-weight.bold}" }, + "font-family": { "value": "{utrecht.document.font-family}" }, + "hover": { + "background-color": {}, + "color": { "value": "{roosendaal.color.grey.29}" }, + "text-decoration": {} + } + }, + "hover": { + "background-color": {}, + "color": { "value": "{roosendaal.color.grey.29}" }, + "text-decoration": {} + }, + "list": { + "padding-inline-start": { "value": "0px" }, + "margin-block-end": { "value": "0px" }, + "border-bottom-width": { "value": "{roosendaal.size.3xs}" }, + "border-bottom-style": { "value": "solid" }, + "border-bottom-color": { "value": "{roosendaal.color.grey.82}" } + }, + "panel": { + "background-color": {}, + "padding-block-start": { "value": "{roosendaal.size.lg}" }, + "padding-block-end": { "value": "{roosendaal.size.lg}" }, + "padding-inline-start": { "value": "{roosendaal.size.lg}" }, + "padding-inline-end": { "value": "{roosendaal.size.lg}" }, + "border-width": {}, + "border-style": {}, + "border-color": {}, + "border-top": {} + } + }, + "scroll-button": { + "background-color": { "value": "{roosendaal.color.primary}" }, + "color": { "value": "{roosendaal.color.white.100}" }, + "border-width": {}, + "border-style": {}, + "border-color": {}, + "hover": { + "background-color": { "value": "{roosendaal.color.primary-hover}" }, + "color": { "value": "{roosendaal.color.white.100}" } + } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/conduction/tooltip.tokens.json b/municipalities/roosendaal-design-tokens/src/component/conduction/tooltip.tokens.json new file mode 100644 index 00000000..09a9e57e --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/conduction/tooltip.tokens.json @@ -0,0 +1,17 @@ +{ + "conduction": { + "tooltip": { + "background-color": { "value": "{roosendaal.color.black.0}" }, + "color": { "value": "{roosendaal.color.white.100}" }, + "padding-block-start": { "value": "{roosendaal.size.xs}" }, + "padding-block-end": { "value": "{roosendaal.size.xs}" }, + "padding-inline-start": { "value": "{roosendaal.size.sm}" }, + "padding-inline-end": { "value": "{roosendaal.size.sm}" }, + "border-width": { "value": "0px" }, + "border-style": { "value": "unset" }, + "border-color": { "value": "unset" }, + "border-radius": { "value": "0px" }, + "z-index": { "value": "9999" } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/open-catalogi/rating.tokens.json b/municipalities/roosendaal-design-tokens/src/component/open-catalogi/rating.tokens.json new file mode 100644 index 00000000..9a8f34a9 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/open-catalogi/rating.tokens.json @@ -0,0 +1,12 @@ +{ + "open-catalogi": { + "rating": { + "rating-bar": { + "color": { "value": "{roosendaal.color.primary}" }, + "background-color": {} + }, + "font-size": { "value": "{utrecht.document.font-size}" }, + "font-family": { "value": "{utrecht.document.font-family}" } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/alert.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/alert.tokens.json new file mode 100644 index 00000000..91b09a58 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/alert.tokens.json @@ -0,0 +1,46 @@ +{ + "utrecht": { + "alert": { + "background-color": { "value": "{roosendaal.color.alert-info-background}" }, + "border-color": { "value": "{roosendaal.color.alert-info}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "color": { "value": "{roosendaal.color.alert-info}" }, + "padding-block-start": { "value": "{roosendaal.size.lg}" }, + "padding-block-end": { "value": "{roosendaal.size.lg}" }, + "padding-inline-start": { "value": "{roosendaal.size.lg}" }, + "padding-inline-end": { "value": "{roosendaal.size.lg}" }, + "margin-block-start": {}, + "margin-block-end": {}, + "warning": { + "background-color": { "value": "{roosendaal.color.alert-warning-background}" }, + "color": { "value": "{roosendaal.color.alert-warning}" }, + "border-color": { "value": "{roosendaal.color.alert-warning}" }, + "border-width": { "value": "{roosendaal.size.4xs}" } + }, + "error": { + "background-color": { "value": "{roosendaal.color.alert-error-background}" }, + "color": { "value": "{roosendaal.color.alert-error}" }, + "border-color": { "value": "{roosendaal.color.red.52}" }, + "border-width": { "value": "{roosendaal.size.4xs}" } + }, + "ok": { + "background-color": { "value": "{roosendaal.color.alert-succes-background}" }, + "color": { "value": "{roosendaal.color.alert-succes}" }, + "border-color": { "value": "{roosendaal.color.alert-succes}" }, + "border-width": { "value": "{roosendaal.size.4xs}" } + }, + "icon": { + "color": { "value": "{roosendaal.color.alert-info}" }, + "error": { + "color": { "value": "{roosendaal.color.alert-error}" } + }, + "warning": { + "color": { "value": "{roosendaal.color.alert-warning}" } + }, + "ok": { + "color": { "value": "{roosendaal.color.alert-succes}" } + } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/badge-counter.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/badge-counter.tokens.json new file mode 100644 index 00000000..eb78eded --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/badge-counter.tokens.json @@ -0,0 +1,13 @@ +{ + "utrecht": { + "badge-counter": { + "background-color": { "value": "{roosendaal.color.primary}" }, + "border-radius": { "value": "50%" }, + "color": { "value": "{roosendaal.color.white.100}" }, + "font-size": { "value": "{utrecht.document.font-size}" }, + "font-weight": { "value": "{roosendaal.typography.font-weight.normal}" }, + "padding-block": { "value": "{roosendaal.size.2xs}" }, + "padding-inline": { "value": "{roosendaal.size.2xs}" } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/badge.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/badge.tokens.json new file mode 100644 index 00000000..ed868ad7 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/badge.tokens.json @@ -0,0 +1,15 @@ +{ + "utrecht": { + "badge": { + "background-color": { "value": "{roosendaal.color.black.0} " }, + "border-radius": { "value": "0" }, + "color": { "value": "{roosendaal.color.white.100} " }, + "font-size": { "value": "{roosendaal.font-size.sm}" }, + "font-weight": { "value": "{roosendaal.typography.font-weight.normal}" }, + "line-height": {}, + "padding-block": { "value": "{roosendaal.size.xs}" }, + "padding-inline": { "value": "{roosendaal.size.xs}" }, + "text-transform": {} + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/blockquote.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/blockquote.tokens.json new file mode 100644 index 00000000..c9c62905 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/blockquote.tokens.json @@ -0,0 +1,27 @@ +{ + "utrecht": { + "blockquote": { + "background-color": {}, + "color": {}, + "margin-inline-start": { "value": "{roosendaal.size.xl}" }, + "margin-inline-end": { "value": "{roosendaal.size.xl}" }, + "margin-inline-block-start": {}, + "margin-inline-block-end": {}, + "font-size": {}, + "font-style": {}, + "font-family": {}, + "padding-inline-start": {}, + "padding-inline-end": {}, + "padding-inline-block-start": {}, + "padding-inline-block-end": {}, + "attribution": { + "color": {}, + "font-size": {} + }, + "content": { + "color": { "value": "{roosendaal.color.black.0}" }, + "font-size": { "value": "{roosendaal.font-size.md}" } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/breadcrumb.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/breadcrumb.tokens.json new file mode 100644 index 00000000..497c4875 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/breadcrumb.tokens.json @@ -0,0 +1,35 @@ +{ + "utrecht": { + "breadcrumb-nav": { + "block-size": {}, + "font-family": { "value": "{utrecht.document.font-family}" }, + "font-size": { "value": "{roosendaal.font-size.sm}" }, + "text-transform": {}, + "item": { + "padding-block-start": {}, + "padding-block-end": {}, + "padding-inline-end": {}, + "padding-inline-start": {} + }, + "link": { + "background-color": {}, + "color": { "value": "{roosendaal.color.white.100}" }, + "focus": { + "background-color": {}, + "color": {} + }, + "current": { + "background-color": {}, + "color": { "value": "{roosendaal.color.white.100}" } + } + }, + "separator": { + "inline-size": {}, + "color": { "value": "{roosendaal.color.white.100}" }, + "icon": { + "size": { "value": "{roosendaal.font-size.sm}" } + } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/button.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/button.tokens.json new file mode 100644 index 00000000..24be8c4d --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/button.tokens.json @@ -0,0 +1,153 @@ +{ + "utrecht": { + "button": { + "background-color": { "value": "{roosendaal.color.primary}" }, + "border-color": {}, + "border-radius": { "value": "0px" }, + "border-width": {}, + "color": { "value": "{roosendaal.color.white.100}" }, + "font-family": { "value": "{roosendaal.typography.sans-serif.font-family}" }, + "font-size": { "value": "{roosendaal.size.lg}" }, + "font-weight": { "value": "inherit" }, + "inline-size": {}, + "letter-spacing": {}, + "line-height": {}, + "min-block-size": {}, + "min-inline-size": {}, + "padding-block-start": { "value": "11.2px" }, + "padding-block-end": { "value": "11.2px" }, + "padding-inline-start": { "value": "20.8px" }, + "padding-inline-end": { "value": "20.8px" }, + "text-transform": {}, + "active": { + "background-color": {}, + "border-color": {}, + "color": {} + }, + "icon": { + "gap": { "value": "{roosendaal.size.xs}" }, + "size": {} + }, + "disabled": { + "background-color": { "value": "{roosendaal.color.grey.82}" }, + "border-color": { "value": "{roosendaal.color.grey.82}" }, + "color": { "value": "{roosendaal.color.grey.50}" } + }, + "focus": { + "background-color": {}, + "border-color": {}, + "color": {}, + "scale": {} + }, + "hover": { + "background-color": { "value": "{roosendaal.color.primary-hover}" }, + "border-color": { "value": "{roosendaal.color.primary-hover}" }, + "color": { "value": "{roosendaal.color.white.100}" }, + "scale": {} + }, + "pressed": { + "background-color": {}, + "border-color": {}, + "color": {} + }, + "primary-action": { + "background-color": { "value": "{roosendaal.color.primary}" }, + "border-color": {}, + "border-width": {}, + "color": { "value": "{roosendaal.color.white.100}" }, + "font-weight": { "value": "inherit" }, + "active": { + "background-color": { "value": "{roosendaal.color.primary-hover}" }, + "border-color": {}, + "color": { "value": "{roosendaal.color.white.100}" } + }, + "disabled": { + "background-color": { "value": "{roosendaal.color.grey.82}" }, + "border-color": { "value": "{roosendaal.color.grey.82}" }, + "color": { "value": "{roosendaal.color.grey.50}" } + }, + "hover": { + "background-color": { "value": "{roosendaal.color.primary-hover}" }, + "border-color": {}, + "color": { "value": "{roosendaal.color.white.100}" }, + "scale": {} + }, + "focus": { + "background-color": {}, + "border-color": {}, + "color": {} + }, + "pressed": { + "background-color": {}, + "border-color": {}, + "color": {} + } + }, + "secondary-action": { + "background-color": { "value": "{roosendaal.color.grey.95}" }, + "border-color": {}, + "border-width": {}, + "color": { "value": "{roosendaal.color.green.19}" }, + "font-weight": { "value": "{roosendaal.typography.font-weight.normal}" }, + "active": { + "background-color": {}, + "border-color": {}, + "color": {} + }, + "disabled": { + "background-color": { "value": "{roosendaal.color.grey.82}" }, + "border-color": { "value": "{roosendaal.color.grey.82}" }, + "color": { "value": "{roosendaal.color.grey.50}" } + }, + "hover": { + "background-color": { "value": "{roosendaal.color.green.19}" }, + "border-color": {}, + "color": { "value": "{roosendaal.color.grey.95}" } + }, + "focus": { + "background-color": {}, + "border-color": {}, + "color": {} + }, + "pressed": { + "background-color": {}, + "border-color": {}, + "color": {} + } + }, + "subtle": { + "background-color": { "value": "{roosendaal.color.primary}" }, + "border-color": {}, + "border-width": {}, + "color": { "value": "{roosendaal.color.white.100}" }, + "font-weight": { "value": "inherit" }, + "active": { + "background-color": {}, + "border-color": {}, + "color": {} + }, + "disabled": { + "background-color": { "value": "{roosendaal.color.grey.82}" }, + "border-color": { "value": "{roosendaal.color.grey.82}" }, + "color": { "value": "{roosendaal.color.grey.50}" } + }, + "hover": { + "background-color": { "value": "{roosendaal.color.primary}" }, + "border-color": {}, + "color": { "value": "{roosendaal.color.white.100}" }, + "scale": {} + }, + "focus": { + "background-color": {}, + "border-color": {}, + "color": {} + }, + "pressed": { + "background-color": {}, + "border-color": {}, + "color": {} + } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/calendar.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/calendar.tokens.json new file mode 100644 index 00000000..bd5cb919 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/calendar.tokens.json @@ -0,0 +1,80 @@ +{ + "utrecht": { + "calendar": { + "width": {}, + "background-color": {}, + "table": { + "padding-block-start": {}, + "padding-block-end": {}, + "weeks-item": { + "width": { "value": "44px" }, + "padding-block-start": { "value": "{roosendaal.size.2xs}" }, + "padding-block-end": { "value": "10px" }, + "line-height": { "value": "{roosendaal.size.lg}" } + }, + "days-item-day": { + "size": { "value": "44px" }, + "color": { "value": "{roosendaal.color.black.0}" }, + "border-width": { "value": "{roosendaal.size.3xs}" }, + "border-color": { "value": "transparent" }, + "hover": { + "background-color": {}, + "color": { "value": "{roosendaal.color.primary}" }, + "border-color": { "value": "{roosendaal.color.black.0}" } + }, + "focus": { + "background-color": {}, + "color": {}, + "border-color": { "value": "transparent" } + }, + "active": { + "background-color": {}, + "color": {}, + "border-color": { "value": "transparent" } + }, + "out-of-the-month": { + "background-color": {}, + "color": { "value": "{roosendaal.color.grey.82}" }, + "border-color": { "value": "transparent" } + }, + "is-today": { + "background-color": { "value": "{roosendaal.color.green.95}" }, + "color": { "value": "{roosendaal.color.primary}" }, + "border-color": { "value": "{roosendaal.color.green.19}" }, + "font-weight": { "value": "{roosendaal.typography.font-weight.bold}" } + }, + "emphasis": { + "background-color": {}, + "color": {}, + "border-color": { "value": "transparent" }, + "font-weight": {} + }, + "selected": { + "background-color": { "value": "{roosendaal.color.green.19}" }, + "color": { "value": "{roosendaal.color.white.100}" }, + "border-color": {}, + "font-weight": { "value": "{roosendaal.typography.font-weight.bold}" } + }, + "disabled": { + "background-color": {}, + "color": {}, + "border-color": {} + } + } + }, + "navigation": { + "background-color": {}, + "color": { "value": "{roosendaal.color.green.19}" }, + "padding-block-start": { "value": "{roosendaal.size.3xs}" }, + "padding-block-end": { "value": "{roosendaal.size.3xs}" }, + "label": { + "min-inline-size": { "value": "200px" }, + "color": { "value": "{roosendaal.color.black.0}" } + } + }, + "icon": { + "size": { "value": "{roosendaal.size.lg}" } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/checkbox.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/checkbox.tokens.json new file mode 100644 index 00000000..71bf8ff9 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/checkbox.tokens.json @@ -0,0 +1,57 @@ +{ + "utrecht": { + "checkbox": { + "background-color": {}, + "border-color": {}, + "border-radius": { "value": "3px" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "color": { "value": "{roosendaal.color.white.100}" }, + "size": { "value": "{roosendaal.size.lg}" }, + "icon": { + "size": {} + }, + "active": { + "border-color": {}, + "border-width": {}, + "background-color": {}, + "color": {} + }, + "hover": { + "border-color": { "value": "{roosendaal.color.grey.31}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "background-color": {}, + "color": { "value": "{roosendaal.color.white.100}" } + }, + "focus": { + "border-color": {}, + "border-width": {}, + "background-color": {}, + "color": {} + }, + "disabled": { + "border-color": { "value": "{roosendaal.color.grey.82}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "background-color": { "value": "{roosendaal.color.grey.82}" }, + "color": { "value": "{roosendaal.color.grey.82}" } + }, + "checked": { + "border-color": { "value": "{roosendaal.color.primary}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "background-color": { "value": "{roosendaal.color.primary}" }, + "color": { "value": "{roosendaal.color.primary}" } + }, + "indeterminate": { + "border-color": {}, + "border-width": {}, + "background-color": {}, + "color": {} + }, + "invalid": { + "border-color": {}, + "border-width": {}, + "background-color": {}, + "color": {} + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/code.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/code.tokens.json new file mode 100644 index 00000000..dfcc6e9a --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/code.tokens.json @@ -0,0 +1,26 @@ +{ + "utrecht": { + "code": { + "background-color": { "value": "{roosendaal.color.lightgrey.96}" }, + "color": { "value": "{roosendaal.color.black.0}" }, + "font-family": { "value": "{roosendaal.typography.monospace.font-family}" }, + "font-size": { "value": "inherit" }, + "line-height": {} + }, + "code-block": { + "background-color": { "value": "{roosendaal.color.lightgrey.96}" }, + "color": { "value": "{roosendaal.color.black.0}" }, + "font-family": { "value": "{roosendaal.typography.monospace.font-family}" }, + "font-size": { "value": "{roosendaal.font-size.md}" }, + "line-height": { "value": "{roosendaal.size.lg}" }, + "margin-block-start": { "value": "{roosendaal.size.md}" }, + "margin-block-end": { "value": "{roosendaal.size.md}" }, + "margin-inline-start": { "value": 0 }, + "margin-inline-end": { "value": 0 }, + "padding-block-start": { "value": "{roosendaal.size.md}" }, + "padding-block-end": { "value": "{roosendaal.size.md}" }, + "padding-inline-start": { "value": "{roosendaal.size.md}" }, + "padding-inline-end": { "value": "{roosendaal.size.md}" } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/document.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/document.tokens.json new file mode 100644 index 00000000..24f0d16e --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/document.tokens.json @@ -0,0 +1,12 @@ +{ + "utrecht": { + "document": { + "background-color": { "value": "{roosendaal.color.white.100}" }, + "color": { "value": "{roosendaal.color.black.3}" }, + "font-family": { "value": "{roosendaal.typography.sans-serif.font-family}" }, + "font-size": { "value": "{roosendaal.font-size.md}" }, + "font-weight": {}, + "line-height": {} + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/alert.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/alert.tokens.json new file mode 100644 index 00000000..4b76a894 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/alert.tokens.json @@ -0,0 +1,9 @@ +{ + "utrecht": { + "alert": { + "icon": { + "gap": { "value": "{roosendaal.size.xs}" } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/badge-counter.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/badge-counter.tokens.json new file mode 100644 index 00000000..016542a9 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/badge-counter.tokens.json @@ -0,0 +1,11 @@ +{ + "utrecht": { + "badge-counter": { + "font-family": { "value": "{utrecht.document.font-family}" }, + "font-style": {}, + "text-decoration": { "value": "none" }, + "min-block-size": {}, + "min-inline-size": {} + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/breadcrumb.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/breadcrumb.tokens.json new file mode 100644 index 00000000..747d1dff --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/breadcrumb.tokens.json @@ -0,0 +1,22 @@ +{ + "utrecht": { + "breadcrumb-nav": { + "background-color": { "value": "{roosendaal.color.green.19}" }, + "border-radius": { "value": "0px" }, + "padding-inline-start": { "value": "0" }, + "padding-inline-end": { "value": "0" }, + "padding-block-start": { "value": "12px" }, + "padding-block-end": { "value": "12px" }, + "link": { + "disabled": { + "background-color": {}, + "color": { "value": "{roosendaal.color.white.100}" } + }, + "hover": { + "background-color": {}, + "color": { "value": "{roosendaal.color.primary-hover}" } + } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/icon.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/icon.tokens.json new file mode 100644 index 00000000..12b31602 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/icon.tokens.json @@ -0,0 +1,7 @@ +{ + "utrecht": { + "icon": { + "gap": { "value": "{roosendaal.size.xs}" } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/page-footer.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/page-footer.tokens.json new file mode 100644 index 00000000..3cd74dcd --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/page-footer.tokens.json @@ -0,0 +1,38 @@ +{ + "utrecht": { + "page-footer": { + "font-size": {}, + "font-family": {}, + "min-height": {}, + "logo": { + "max-height": {}, + "max-width": {} + }, + "background-size": {}, + "background-position": {}, + "mobile": { + "background-position": {} + }, + "icon": { + "color": {} + }, + "heading": { + "color": {}, + "font-family": { "value": "{roosendaal.typography.museosansbolder.font-family}" }, + "font-weight": { "value": "{roosendaal.typography.font-weight.bolder}" } + }, + "link": { + "color": {}, + "text-decoration": { "value": "underline" }, + "text-decoration-color": { "value": "inherit" }, + "text-decoration-thickness": { "value": "{roosendaal.size.4xs}" }, + "text-underline-offset": { "value": "{roosendaal.size.3xs}" }, + "hover": { + "color": { "value": "{roosendaal.color.green.82}" }, + "text-decoration": { "value": "underline" }, + "text-decoration-thickness": { "value": "2.4px" } + } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json new file mode 100644 index 00000000..b1597031 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json @@ -0,0 +1,14 @@ +{ + "utrecht": { + "page-header": { + "logo": { + "max-height": {}, + "max-width": { "value": "150px" } + }, + "border-block-start": { "value": "10px solid {roosendaal.color.red.52}" }, + "border-block-end": {}, + "border-inline-start": { "value": "10px solid {roosendaal.color.red.52}" }, + "border-inline-end": { "value": "10px solid {roosendaal.color.red.52}" } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/radio-button.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/radio-button.tokens.json new file mode 100644 index 00000000..c8ed5b2c --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/radio-button.tokens.json @@ -0,0 +1,14 @@ +{ + "utrecht": { + "radio-button": { + "min-block-size": { "value": "16px" }, + "min-inline-size": { "value": "16px" }, + "checked-disabled": { + "border-color": { "value": "{roosendaal.color.grey.82}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "background-color": { "value": "{roosendaal.color.white.100}" }, + "color": { "value": "{roosendaal.color.grey.82}" } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json new file mode 100644 index 00000000..08550e47 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json @@ -0,0 +1,20 @@ +{ + "utrecht": { + "skip-link": { + "font-weight": {}, + "font-size": { "value": "{roosendaal.font-size.lg}" }, + "outline-style": {}, + "outline-color": {}, + "border-radius": {}, + "focus": { + "text-decoration": { "value": "{utrecht.skip-link.text-decoration}" } + }, + "inset-block-start": { "value": "242px" }, + "inset-inline-start": { "value": "{roosendaal.size.md}" }, + "box-shadow-width": {}, + "border-width": { "value": "3px" }, + "border-style": { "value": "solid" }, + "border-color": { "value": "{roosendaal.color.red.52}" } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/table.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/table.tokens.json new file mode 100644 index 00000000..f7e97462 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/extra-tokens/table.tokens.json @@ -0,0 +1,37 @@ +{ + "utrecht": { + "table": { + "border-collapse": { "value": "collapse" }, + "background-color": { "value": "{roosendaal.color.white.98}" }, + "header": { + "border-block-end-color": { "value": "{roosendaal.color.grey.58}" }, + "border-block-end-width": { "value": "{roosendaal.size.4xs}" }, + "font-family": {} + }, + "header-cell": { + "border-inline-end-width": { "value": "{roosendaal.size.4xs}" }, + "border-inline-end-style": { "value": "solid" }, + "border-inline-end-color": { "value": "{roosendaal.color.grey.58}" } + }, + "cell": { + "border-inline-end-width": { "value": "{roosendaal.size.4xs}" }, + "border-inline-end-style": { "value": "solid" }, + "border-inline-end-color": { "value": "{roosendaal.color.grey.58}" } + }, + "row": { + "hover": { + "background-color": { "value": "{roosendaal.color.green.95}" }, + "color": {} + } + }, + "body": { + "border": {}, + "border-block-end-color": {}, + "border-block-end-width": {} + }, + "caption": { + "font-style": {} + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/focus.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/focus.tokens.json new file mode 100644 index 00000000..53c49251 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/focus.tokens.json @@ -0,0 +1,15 @@ +{ + "utrecht": { + "focus": { + "background-color": {}, + "color": {}, + "outline-color": {}, + "outline-offset": {}, + "outline-style": {}, + "outline-width": {}, + "inverse": { + "outline-color": {} + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/form-input.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/form-input.tokens.json new file mode 100644 index 00000000..1d08e70b --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/form-input.tokens.json @@ -0,0 +1,45 @@ +{ + "utrecht": { + "form-input": { + "background-color": { "value": "{roosendaal.color.white.100}" }, + "border-block-end-width": {}, + "border-bottom-width": {}, + "border-color": { "value": "{roosendaal.color.green.33}" }, + "border-radius": { "value": "0px" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "color": { "value": "{roosendaal.color.grey.29}" }, + "font-family": { "value": "{roosendaal.typography.sans-serif.font-family}" }, + "font-size": { "value": "{roosendaal.font-size.md}" }, + "line-height": { "value": "21px" }, + "max-inline-size": {}, + "padding-block-end": { "value": "12px" }, + "padding-block-start": { "value": "12px" }, + "padding-inline-end": { "value": "{roosendaal.size.xl}" }, + "padding-inline-start": { "value": "{roosendaal.size.xl}" }, + "placeholder": { + "color": { "value": "{roosendaal.color.grey.46}" } + }, + "disabled": { + "background-color": {}, + "border-color": {}, + "color": {} + }, + "focus": { + "background-color": {}, + "border-color": { "value": "{roosendaal.color.green.33}" }, + "color": {} + }, + "invalid": { + "background-color": {}, + "border-color": {}, + "border-width": {}, + "color": {} + }, + "read-only": { + "background-color": {}, + "border-color": {}, + "color": {} + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/heading.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/heading.tokens.json new file mode 100644 index 00000000..0c2f1af8 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/heading.tokens.json @@ -0,0 +1,49 @@ +{ + "utrecht": { + "heading-1": { + "color": { "value": "{roosendaal.color.green.15}" }, + "font-family": { "value": "{roosendaal.typography.museosans.font-family}" }, + "font-size": { "value": "{roosendaal.font-size.3xl}" }, + "font-weight": { "value": "{roosendaal.typography.font-weight.bold}" }, + "line-height": { "value": "1.56097" }, + "margin-block-end": { "value": "{roosendaal.size.2xl}" }, + "margin-block-start": { "value": "{roosendaal.size.md}" } + }, + "heading-2": { + "color": { "value": "{roosendaal.color.green.15}" }, + "font-family": { "value": "{roosendaal.typography.museosans.font-family}" }, + "font-size": { "value": "{roosendaal.font-size.2xl}" }, + "font-weight": { "value": "{roosendaal.typography.font-weight.bold}" }, + "line-height": { "value": "1.58333" }, + "margin-block-end": { "value": "{roosendaal.size.2xl}" }, + "margin-block-start": { "value": "{roosendaal.size.md}" } + }, + "heading-3": { + "color": { "value": "{roosendaal.color.green.15}" }, + "font-family": { "value": "{roosendaal.typography.museosans.font-family}" }, + "font-size": { "value": "{roosendaal.font-size.xl}" }, + "font-weight": { "value": "{roosendaal.typography.font-weight.bold}" }, + "line-height": { "value": "1.59375" }, + "margin-block-end": { "value": "{roosendaal.size.xl}" }, + "margin-block-start": { "value": "{roosendaal.size.md}" } + }, + "heading-4": { + "color": { "value": "{roosendaal.color.green.15}" }, + "font-family": { "value": "{roosendaal.typography.museosans.font-family}" }, + "font-size": { "value": "{roosendaal.font-size.lg}" }, + "font-weight": { "value": "{roosendaal.typography.font-weight.bold}" }, + "line-height": { "value": "1.60714" }, + "margin-block-end": { "value": "{roosendaal.size.lg}" }, + "margin-block-start": { "value": "{roosendaal.size.md}" } + }, + "heading-5": { + "color": { "value": "{roosendaal.color.green.15}" }, + "font-family": { "value": "{roosendaal.typography.museosans.font-family}" }, + "font-size": { "value": "{roosendaal.font-size.md}" }, + "font-weight": { "value": "{roosendaal.typography.font-weight.bold}" }, + "line-height": { "value": "1.64" }, + "margin-block-end": { "value": "{roosendaal.size.lg}" }, + "margin-block-start": { "value": "{roosendaal.size.md}" } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/icon.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/icon.tokens.json new file mode 100644 index 00000000..a0028672 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/icon.tokens.json @@ -0,0 +1,12 @@ +{ + "utrecht": { + "icon": { + "color": {}, + "size": {}, + "inset-block-start": {}, + "baseline": { + "inset-block-start": {} + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/link.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/link.tokens.json new file mode 100644 index 00000000..eef8baba --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/link.tokens.json @@ -0,0 +1,33 @@ +{ + "utrecht": { + "link": { + "color": { "value": "{roosendaal.color.green.35}" }, + "text-decoration": { "value": "underline" }, + "text-decoration-color": { "value": "{roosendaal.color.green.35}" }, + "text-decoration-thickness": { "value": "{roosendaal.size.4xs}" }, + "text-underline-offset": { "value": "{roosendaal.size.3xs}" }, + "active": { + "color": {} + }, + "focus": { + "color": {}, + "text-decoration": {}, + "text-decoration-thickness": {} + }, + "hover": { + "color": { "value": "{roosendaal.color.green.19}" }, + "text-decoration": { "value": "underline" }, + "text-decoration-thickness": { "value": "2.4px" } + }, + "placeholder": { + "color": {} + }, + "visited": { + "color": { "value": "{roosendaal.color.green.35}" } + }, + "icon": { + "size": { "value": "{roosendaal.size.sm}" } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/list.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/list.tokens.json new file mode 100644 index 00000000..f6779560 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/list.tokens.json @@ -0,0 +1,31 @@ +{ + "utrecht": { + "ordered-list": { + "font-size": { "value": "{utrecht.document.font-size}" }, + "line-height": {}, + "margin-block-start": { "value": "{roosendaal.size.sm}" }, + "margin-block-end": { "value": "{roosendaal.size.sm}" }, + "padding-inline-start": { "value": "{roosendaal.size.xl}" }, + "item": { + "margin-block-start": { "value": "{roosendaal.size.2xs}" }, + "margin-block-end": { "value": "{roosendaal.size.2xs}" }, + "padding-inline-start": { "value": "1ch" } + } + }, + "unordered-list": { + "font-size": { "value": "{utrecht.document.font-size}" }, + "line-height": {}, + "margin-block-start": { "value": "{roosendaal.size.md}" }, + "margin-block-end": { "value": 0 }, + "padding-inline-start": { "value": "2ch" }, + "item": { + "margin-block-start": { "value": "{roosendaal.size.xs}" }, + "margin-block-end": { "value": "{roosendaal.size.xs}" }, + "padding-inline-start": { "value": "1ch" } + }, + "marker": { + "color": { "value": "{roosendaal.color.black.3}" } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/page-footer.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/page-footer.tokens.json new file mode 100644 index 00000000..9415d34c --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/page-footer.tokens.json @@ -0,0 +1,13 @@ +{ + "utrecht": { + "page-footer": { + "background-color": { "value": "{roosendaal.color.green.19}" }, + "background-image": { "value": "unset" }, + "color": { "value": "{roosendaal.color.white.98}" }, + "padding-inline-end": { "value": "{roosendaal.size.sm}" }, + "padding-inline-start": { "value": "{roosendaal.size.sm}" }, + "padding-block-end": { "value": "{roosendaal.size.2xl}" }, + "padding-block-start": { "value": "{roosendaal.size.2xl}" } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/page-header.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/page-header.tokens.json new file mode 100644 index 00000000..0130b265 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/page-header.tokens.json @@ -0,0 +1,10 @@ +{ + "utrecht": { + "page-header": { + "background-color": { "value": "{roosendaal.color.white.100}" }, + "color": { "value": "{roosendaal.color.black.3}" }, + "padding-block-start": { "value": "{roosendaal.size.sm}" }, + "padding-block-end": { "value": "{roosendaal.size.sm}" } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/page.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/page.tokens.json new file mode 100644 index 00000000..84695f50 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/page.tokens.json @@ -0,0 +1,11 @@ +{ + "utrecht": { + "page": { + "background-color": {}, + "color": {}, + "margin-inline-start": { "value": "{roosendaal.size.lg}" }, + "margin-inline-end": { "value": "{roosendaal.size.lg}" }, + "max-inline-size": { "value": "1140px" } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/paragraph.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/paragraph.tokens.json new file mode 100644 index 00000000..f7947533 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/paragraph.tokens.json @@ -0,0 +1,25 @@ +{ + "utrecht": { + "paragraph": { + "color": { "value": "{utrecht.document.color}" }, + "font-family": { "value": "{roosendaal.typography.sans-serif.font-family}" }, + "font-size": { "value": "{roosendaal.font-size.md}" }, + "font-weight": { "value": "{roosendaal.typography.font-weight.normal}" }, + "line-height": { "value": "1.5em" }, + "margin-block-start": { "value": 0 }, + "margin-block-end": { "value": 0 }, + "lead": { + "color": {}, + "font-size": {}, + "font-weight": {}, + "line-height": {} + }, + "small": { + "color": {}, + "font-size": {}, + "font-weight": {}, + "line-height": {} + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/radio-button.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/radio-button.tokens.json new file mode 100644 index 00000000..f7aa4e47 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/radio-button.tokens.json @@ -0,0 +1,68 @@ +{ + "utrecht": { + "radio-button": { + "background-color": { "value": "{roosendaal.color.white.100}" }, + "border-color": { "value": "{roosendaal.color.grey.46}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "size": {}, + "margin-block-start": {}, + "icon": { + "size": { "value": "5px" } + }, + "active": { + "border-color": {}, + "border-width": {}, + "background-color": {}, + "color": {} + }, + "checked": { + "border-color": { "value": "{roosendaal.color.primary}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "background-color": { "value": "{roosendaal.color.white.100}" }, + "color": { "value": "{roosendaal.color.primary}" }, + "active": { + "border-color": { "value": "{roosendaal.color.primary}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "background-color": { "value": "{roosendaal.color.white.100}" }, + "color": { "value": "{roosendaal.color.primary}" } + }, + "hover": { + "border-color": { "value": "{roosendaal.color.primary-hover}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "background-color": { "value": "{roosendaal.color.white.100}" }, + "color": { "value": "{roosendaal.color.primary-hover}" } + }, + "focus": { + "border-color": { "value": "{roosendaal.color.primary}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "background-color": { "value": "{roosendaal.color.white.100}" }, + "color": { "value": "{roosendaal.color.primary}" } + } + }, + "hover": { + "border-color": { "value": "{roosendaal.color.grey.31}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "background-color": { "value": "{roosendaal.color.white.100}" }, + "color": {} + }, + "focus": { + "border-color": { "value": "{roosendaal.color.primary}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "background-color": { "value": "{roosendaal.color.white.100}" }, + "color": { "value": "{roosendaal.color.primary}" } + }, + "disabled": { + "border-color": { "value": "{roosendaal.color.grey.82}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "background-color": { "value": "{roosendaal.color.grey.97}" }, + "color": { "value": "{roosendaal.color.grey.82}" } + }, + "invalid": { + "border-color": { "value": "{roosendaal.color.error}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "background-color": { "value": "{roosendaal.color.white.100}" }, + "color": { "value": "{roosendaal.color.error}" } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/separator.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/separator.tokens.json new file mode 100644 index 00000000..a6bd1b72 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/separator.tokens.json @@ -0,0 +1,10 @@ +{ + "utrecht": { + "separator": { + "color": { "value": "{roosendaal.color.grey.82}" }, + "block-size": { "value": "{roosendaal.size.4xs}" }, + "margin-block-end": { "value": "0px" }, + "margin-block-start": { "value": "0px" } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/skip-link.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/skip-link.tokens.json new file mode 100644 index 00000000..63795706 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/skip-link.tokens.json @@ -0,0 +1,16 @@ +{ + "utrecht": { + "skip-link": { + "background-color": { "value": "{roosendaal.color.white.98}" }, + "color": { "value": "{roosendaal.color.green.19}" }, + "min-block-size": { "value": "20px" }, + "min-inline-size": { "value": "20px" }, + "padding-block-start": { "value": "7px" }, + "padding-block-end": { "value": "7px" }, + "padding-inline-start": { "value": "9px" }, + "padding-inline-end": { "value": "9px" }, + "text-decoration": { "value": "underline" }, + "z-index": { "value": "100000" } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/spotlight-section.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/spotlight-section.tokens.json new file mode 100644 index 00000000..f2abe561 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/spotlight-section.tokens.json @@ -0,0 +1,24 @@ +{ + "utrecht": { + "spotlight-section": { + "background-color": { "value": "{roosendaal.color.alert-info-background}" }, + "border-color": {}, + "border-width": {}, + "color": { "value": "{roosendaal.color.alert-info}" }, + "padding-block-start": { "value": "{roosendaal.size.lg}" }, + "padding-block-end": { "value": "{roosendaal.size.lg}" }, + "padding-inline-start": { "value": "{roosendaal.size.lg}" }, + "padding-inline-end": { "value": "{roosendaal.size.lg}" }, + "margin-block-start": { "value": "{roosendaal.size.lg}" }, + "margin-block-end": {}, + "info": { + "background-color": { "value": "{roosendaal.color.alert-info-background}" }, + "color": { "value": "{roosendaal.color.alert-info}" } + }, + "warning": { + "background-color": { "value": "{roosendaal.color.alert-warning-background}" }, + "color": { "value": "{roosendaal.color.alert-warning}" } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/surface.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/surface.tokens.json new file mode 100644 index 00000000..dcd1763a --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/surface.tokens.json @@ -0,0 +1,8 @@ +{ + "utrecht": { + "surface": { + "background-color": { "value": "{roosendaal.color.white.100}" }, + "color": {} + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/table.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/table.tokens.json new file mode 100644 index 00000000..7b58c459 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/table.tokens.json @@ -0,0 +1,60 @@ +{ + "utrecht": { + "table": { + "border-color": { "value": "{roosendaal.color.grey.58}" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "font-family": { "value": "{utrecht.document.font-family}" }, + "font-size": { "value": "{utrecht.document.font-size}" }, + "line-height": {}, + "margin-block-end": { "value": 0 }, + "margin-block-start": { "value": "{roosendaal.size.md}" }, + "caption": { + "font-weight": {}, + "font-family": {}, + "font-size": {}, + "color": {}, + "line-height": {}, + "text-align": {}, + "margin-block-end": {} + }, + "header": { + "font-weight": { "value": "{roosendaal.typography.font-weight.bold}" }, + "background-color": {}, + "color": { "value": "{utrecht.document.color}" }, + "text-transform": { "value": "unset" }, + "border-block-end-color": {}, + "border-block-end-width": {} + }, + "header-cell": { + "font-size": { "value": "{utrecht.document.font-size}" }, + "font-weight": { "value": "{roosendaal.typography.font-weight.bold}" }, + "color": { "value": "{utrecht.document.color}" }, + "text-transform": { "value": "unset" } + }, + "cell": { + "line-height": {}, + "padding-block-end": { "value": "{roosendaal.size.md}" }, + "padding-block-start": { "value": "{roosendaal.size.md}" }, + "padding-inline-end": { "value": "{roosendaal.size.md}" }, + "padding-inline-start": { "value": "{roosendaal.size.md}" }, + "icon": { + "size": {} + } + }, + "row": { + "border-block-end-color": { "value": "{roosendaal.color.grey.82}" }, + "border-block-end-width": { "value": "{roosendaal.size.4xs}" }, + "padding-inline-end": {}, + "padding-inline-start": {}, + "alternate-odd": { + "background-color": {}, + "color": {} + }, + "alternate-even": { + "background-color": { "value": "{roosendaal.color.green.98}" }, + "color": {} + } + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/component/utrecht/textbox.tokens.json b/municipalities/roosendaal-design-tokens/src/component/utrecht/textbox.tokens.json new file mode 100644 index 00000000..f8213bc8 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/component/utrecht/textbox.tokens.json @@ -0,0 +1,45 @@ +{ + "utrecht": { + "textbox": { + "background-color": { "value": "{roosendaal.color.white.100}" }, + "border-block-end-width": {}, + "border-bottom-width": {}, + "border-color": { "value": "{roosendaal.color.green.33}" }, + "border-radius": { "value": "0px" }, + "border-width": { "value": "{roosendaal.size.4xs}" }, + "color": { "value": "{roosendaal.color.grey.29}" }, + "font-family": { "value": "{roosendaal.typography.sans-serif.font-family}" }, + "font-size": { "value": "{roosendaal.font-size.md}" }, + "line-height": { "value": "21px" }, + "max-inline-size": {}, + "padding-block-end": { "value": "12px" }, + "padding-block-start": { "value": "12px" }, + "padding-inline-end": { "value": "{roosendaal.size.xl}" }, + "padding-inline-start": { "value": "{roosendaal.size.xl}" }, + "placeholder": { + "color": { "value": "{roosendaal.color.grey.46}" } + }, + "disabled": { + "background-color": {}, + "border-color": {}, + "color": {} + }, + "focus": { + "background-color": {}, + "border-color": { "value": "{roosendaal.color.green.33}" }, + "color": {} + }, + "invalid": { + "background-color": {}, + "border-color": {}, + "border-width": {}, + "color": {} + }, + "read-only": { + "background-color": {}, + "border-color": {}, + "color": {} + } + } + } +} diff --git a/municipalities/roosendaal-design-tokens/src/config.json b/municipalities/roosendaal-design-tokens/src/config.json new file mode 100644 index 00000000..c28cb01b --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/config.json @@ -0,0 +1,58 @@ +{ + "fullName": "Gemeente Roosendaal", + "name": "Roosendaal", + "prefix": "roosendaal", + "npm": "@nl-design-system-unstable/roosendaal-design-tokens", + "stories": [ + "react-utrecht-alert--default", + "react-utrecht-alert--warning", + "react-utrecht-alert--error", + "react-utrecht-alert--ok", + "react-utrecht-badge-counter--default", + "react-utrecht-breadcrumb-nav--default", + "react-utrecht-breadcrumb-nav--separator", + "react-utrecht-button--default", + "react-utrecht-button--hover", + "react-utrecht-button--primary-action-button", + "react-utrecht-button--secondary-action-button", + "react-utrecht-code--default", + "react-utrecht-code-block--default", + "react-utrecht-document--default", + "react-utrecht-heading-1--default", + "react-utrecht-heading-2--default", + "react-utrecht-heading-3--default", + "react-utrecht-heading-4--default", + "react-utrecht-alert--default", + "react-utrecht-link--default", + "react-utrecht-link--hover", + "react-utrecht-link--focus", + "react-utrecht-ordered-list--default", + "react-utrecht-unordered-list--default", + "react-utrecht-page-header--default", + "react-utrecht-page-footer--default", + "react-utrecht-paragraph--default", + "react-utrecht-radio-button--default", + "react-utrecht-radio-button--hover", + "react-utrecht-radio-button--focus", + "react-utrecht-radio-button--checked", + "react-utrecht-radio-button--checked-and-disabled", + "react-utrecht-radio-button--disabled", + "react-utrecht-separator--default", + "react-utrecht-surface--default", + "react-utrecht-table--default", + "react-utrecht-textbox--default", + "react-conduction-card-header--default", + "react-conduction-card-header--hover", + "react-conduction-card-wrapper--default", + "react-conduction-card-wrapper--hover", + "react-conduction-pagination--default", + "react-conduction-input-select--default", + "react-conduction-input-select--list-option", + "react-conduction-input-select--placeholder", + "react-conduction-tabs--default", + "react-conduction-tabs--selected", + "react-conduction-tabs--hover", + "react-conduction-tabs--list", + "react-conduction-tabs--panel" + ] +} diff --git a/municipalities/roosendaal-design-tokens/src/font.scss b/municipalities/roosendaal-design-tokens/src/font.scss new file mode 100644 index 00000000..d7915e00 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/font.scss @@ -0,0 +1,10 @@ +/* Place any @font-face definitions here */ + +@font-face { + font-family: "MuseoSans"; + src: url("../src/font/MuseoSans.woff2") format("woff2"); +} +@font-face { + font-family: "MuseoSansBolder"; + src: url("../src/font/MuseoSansBolder.woff2") format("woff2"); +} diff --git a/municipalities/roosendaal-design-tokens/src/font/MuseoSans.woff2 b/municipalities/roosendaal-design-tokens/src/font/MuseoSans.woff2 new file mode 100644 index 00000000..afc83081 Binary files /dev/null and b/municipalities/roosendaal-design-tokens/src/font/MuseoSans.woff2 differ diff --git a/municipalities/roosendaal-design-tokens/src/font/MuseoSansBolder.woff2 b/municipalities/roosendaal-design-tokens/src/font/MuseoSansBolder.woff2 new file mode 100644 index 00000000..e27a69a9 Binary files /dev/null and b/municipalities/roosendaal-design-tokens/src/font/MuseoSansBolder.woff2 differ diff --git a/municipalities/roosendaal-design-tokens/src/index.scss b/municipalities/roosendaal-design-tokens/src/index.scss new file mode 100644 index 00000000..d3ccf5f9 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/src/index.scss @@ -0,0 +1,8 @@ +/** + * @license SEE LICENSE.md + * Copyright (c) 2021 NL Design System Community + * All rights reserved + */ + +@import "./design-tokens.css"; +@import "./font.css"; diff --git a/municipalities/roosendaal-design-tokens/style-dictionary.config.js b/municipalities/roosendaal-design-tokens/style-dictionary.config.js new file mode 100644 index 00000000..84c1e408 --- /dev/null +++ b/municipalities/roosendaal-design-tokens/style-dictionary.config.js @@ -0,0 +1,6 @@ +const config = require('./src/config.json'); +const { createConfig } = require('../../style-dictionary-config'); + +module.exports = createConfig({ + selector: `.${config.prefix}-theme`, +}); diff --git a/municipalities/rotterdam-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json b/municipalities/rotterdam-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json index e24f30d5..9af23590 100644 --- a/municipalities/rotterdam-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json +++ b/municipalities/rotterdam-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json @@ -4,7 +4,11 @@ "logo": { "max-height": {}, "max-width": { "value": "222px" } - } + }, + "border-block-start": {}, + "border-block-end": {}, + "border-inline-start": {}, + "border-inline-end": {} } } } diff --git a/municipalities/rotterdam-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json b/municipalities/rotterdam-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json index 57fce48b..76979875 100644 --- a/municipalities/rotterdam-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json +++ b/municipalities/rotterdam-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json @@ -11,7 +11,10 @@ }, "inset-block-start": {}, "inset-inline-start": {}, - "box-shadow-width": {} + "box-shadow-width": {}, + "border-width": {}, + "border-style": {}, + "border-color": {} } } } diff --git a/municipalities/sloterburg-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json b/municipalities/sloterburg-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json index 2cee752a..4408ac69 100644 --- a/municipalities/sloterburg-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json +++ b/municipalities/sloterburg-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json @@ -4,7 +4,11 @@ "logo": { "max-height": {}, "max-width": { "value": "150px" } - } + }, + "border-block-start": {}, + "border-block-end": {}, + "border-inline-start": {}, + "border-inline-end": {} } } } diff --git a/municipalities/sloterburg-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json b/municipalities/sloterburg-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json index 1427fd6e..ac0cfd63 100644 --- a/municipalities/sloterburg-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json +++ b/municipalities/sloterburg-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json @@ -11,7 +11,10 @@ }, "inset-block-start": { "value": "86px" }, "inset-inline-start": {}, - "box-shadow-width": {} + "box-shadow-width": {}, + "border-width": {}, + "border-style": {}, + "border-color": {} } } } diff --git a/municipalities/tubbergen-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json b/municipalities/tubbergen-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json index 2cee752a..4408ac69 100644 --- a/municipalities/tubbergen-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json +++ b/municipalities/tubbergen-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json @@ -4,7 +4,11 @@ "logo": { "max-height": {}, "max-width": { "value": "150px" } - } + }, + "border-block-start": {}, + "border-block-end": {}, + "border-inline-start": {}, + "border-inline-end": {} } } } diff --git a/municipalities/tubbergen-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json b/municipalities/tubbergen-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json index 1fed8246..0d71edeb 100644 --- a/municipalities/tubbergen-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json +++ b/municipalities/tubbergen-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json @@ -11,7 +11,10 @@ }, "inset-block-start": { "value": "73px" }, "inset-inline-start": { "value": "33px" }, - "box-shadow-width": {} + "box-shadow-width": {}, + "border-width": {}, + "border-style": {}, + "border-color": {} } } } diff --git a/municipalities/xxllnc-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json b/municipalities/xxllnc-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json index bcfaa203..aca9b029 100644 --- a/municipalities/xxllnc-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json +++ b/municipalities/xxllnc-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json @@ -4,7 +4,11 @@ "logo": { "max-height": {}, "max-width": { "value": "70px" } - } + }, + "border-block-start": {}, + "border-block-end": {}, + "border-inline-start": {}, + "border-inline-end": {} } } } diff --git a/municipalities/xxllnc-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json b/municipalities/xxllnc-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json index 771df1a0..0852f02c 100644 --- a/municipalities/xxllnc-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json +++ b/municipalities/xxllnc-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json @@ -11,7 +11,10 @@ }, "inset-block-start": {}, "inset-inline-start": {}, - "box-shadow-width": {} + "box-shadow-width": {}, + "border-width": {}, + "border-style": {}, + "border-color": {} } } } diff --git a/municipalities/zuiddrecht-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json b/municipalities/zuiddrecht-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json index 2cee752a..4408ac69 100644 --- a/municipalities/zuiddrecht-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json +++ b/municipalities/zuiddrecht-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json @@ -4,7 +4,11 @@ "logo": { "max-height": {}, "max-width": { "value": "150px" } - } + }, + "border-block-start": {}, + "border-block-end": {}, + "border-inline-start": {}, + "border-inline-end": {} } } } diff --git a/municipalities/zuiddrecht-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json b/municipalities/zuiddrecht-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json index 91392584..16b530cc 100644 --- a/municipalities/zuiddrecht-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json +++ b/municipalities/zuiddrecht-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json @@ -11,7 +11,10 @@ }, "inset-block-start": { "value": "86px" }, "inset-inline-start": {}, - "box-shadow-width": {} + "box-shadow-width": {}, + "border-width": {}, + "border-style": {}, + "border-color": {} } } } diff --git a/municipalities/zutphen-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json b/municipalities/zutphen-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json index 2cee752a..4408ac69 100644 --- a/municipalities/zutphen-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json +++ b/municipalities/zutphen-design-tokens/src/component/utrecht/extra-tokens/page-header.tokens.json @@ -4,7 +4,11 @@ "logo": { "max-height": {}, "max-width": { "value": "150px" } - } + }, + "border-block-start": {}, + "border-block-end": {}, + "border-inline-start": {}, + "border-inline-end": {} } } } diff --git a/municipalities/zutphen-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json b/municipalities/zutphen-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json index 3fd51435..830b5958 100644 --- a/municipalities/zutphen-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json +++ b/municipalities/zutphen-design-tokens/src/component/utrecht/extra-tokens/skip-link.tokens.json @@ -14,7 +14,10 @@ }, "inset-block-start": {}, "inset-inline-start": {}, - "box-shadow-width": {} + "box-shadow-width": {}, + "border-width": {}, + "border-style": {}, + "border-color": {} } } } diff --git a/package.json b/package.json index a70d7f44..e6d80dd3 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@conduction/theme", - "version": "1.1.24", + "version": "1.1.25", "description": "Conduction's design tokens theme", "main": "index.js", "repository": { @@ -26,7 +26,8 @@ "build:zutphen": "cd ./municipalities/zutphen-design-tokens && npm run build", "build:sloterburg": "cd ./municipalities/sloterburg-design-tokens && npm run build", "build:gouda": "cd ./municipalities/gouda-design-tokens && npm run build", - "build:zuiddrecht": "cd ./municipalities/zuiddrecht-design-tokens && npm run build" + "build:zuiddrecht": "cd ./municipalities/zuiddrecht-design-tokens && npm run build", + "build:roosendaal": "cd ./municipalities/roosendaal-design-tokens && npm run build" }, "dependencies": { "@nl-design-system-unstable/rotterdam-design-tokens": "^1.0.0-alpha.100",