diff --git a/packages/storybook/src/template/index.scss b/packages/storybook/src/template/index.scss index b860c04c..74dc14eb 100644 --- a/packages/storybook/src/template/index.scss +++ b/packages/storybook/src/template/index.scss @@ -1,3 +1,8 @@ +:root { + /* override Mendix CSS: `font-size: 10px` */ + font-size: initial !important; +} + .utrecht-breadcrumb-nav { margin-inline-start: calc(-1 * var(--utrecht-breadcrumb-nav-item-padding-inline-start, 8px)); } @@ -9,6 +14,9 @@ .utrecht-nav-bar { font-size: var(--rods-typography-scale-sm-font-size); + + /* Override the `inline-size: 100%` to be able to align the Navigation Bar to the right */ + inline-size: fit-content; } .example-page { diff --git a/proprietary/design-tokens/src/component/utrecht/alert.tokens.json b/proprietary/design-tokens/src/component/utrecht/alert.tokens.json index c67a9c83..e35d32a6 100644 --- a/proprietary/design-tokens/src/component/utrecht/alert.tokens.json +++ b/proprietary/design-tokens/src/component/utrecht/alert.tokens.json @@ -33,6 +33,7 @@ "icon": { "color": { "value": "{rods.color.notification.neutral.icon-color}" }, "gap": { "value": "12px" }, + "size": { "value": "32px" }, "error": { "color": { "value": "{rods.color.notification.alert.icon-color}" } }, diff --git a/proprietary/design-tokens/src/component/utrecht/badge-list.tokens.json b/proprietary/design-tokens/src/component/utrecht/badge-list.tokens.json index a693cf8b..b690fe7f 100644 --- a/proprietary/design-tokens/src/component/utrecht/badge-list.tokens.json +++ b/proprietary/design-tokens/src/component/utrecht/badge-list.tokens.json @@ -1,13 +1,11 @@ { "utrecht": { "badge-list": { - "item": { - "margin-inline": { - "value": "{rods.space.scale.1}" - }, - "margin-block": { - "value": "0" - } + "column-gap": { + "value": "{rods.space.scale.1}" + }, + "row-gap": { + "value": "0" } } }