Skip to content

[#2450] Add button(-modifier) tokens and bump version#8

Draft
jiromaykin wants to merge 2 commits intomainfrom
feature/2450-nlds-npm-button-tokens
Draft

[#2450] Add button(-modifier) tokens and bump version#8
jiromaykin wants to merge 2 commits intomainfrom
feature/2450-nlds-npm-button-tokens

Conversation

@jiromaykin
Copy link
Copy Markdown
Collaborator

@jiromaykin jiromaykin commented May 14, 2024

Taiga: https://taiga.maykinmedia.nl/project/open-inwoner/task/2450

Utrecht buttons contain values that we do not have, so these need to be set to 'none' in OIP in order to get rid of that styling:
block-size: fit-content;
cursor: var(--utrecht-action-activate-cursor, revert);
font-weight: var(--_utrecht-button-appearance-font-weight, var(--utrecht-button-font-weight));
inline-size: var(--utrecht-button-inline-size, auto);
justify-content: center;
max-inline-size: var(--utrecht-button-max-inline-size, fit-content);
min-block-size: var(--utrecht-button-min-block-size, 44px);
min-inline-size: var(--utrecht-button-min-inline-size, 44px);
scale: 1;
text-transform: var(--utrecht-button-text-transform);

Explanation common tokens:
https://nldesignsystem.nl/handboek/design-tokens/#common-tokens

Vice versa:
in OIP we are using certain/extra attribute that are not set in Utrecht, dso we need extra OIP design tokens for these:

It' also easier to make more general tokens for spacing since we are using those in the entire project in the same way.

Deeper documentation, compare Den Haag to Utrecht:
https://nl-design-system.github.io/denhaag/?path=/docs/css-input-button--docs
https://nl-design-system.github.io/utrecht/storybook/?path=/docs/css-button-appearance--docs

@jiromaykin jiromaykin force-pushed the feature/2450-nlds-npm-button-tokens branch from 9dfcdc6 to cf3484e Compare May 16, 2024 12:54
@jiromaykin jiromaykin force-pushed the feature/2450-nlds-npm-button-tokens branch 2 times, most recently from da26dd6 to b0a0dcb Compare June 6, 2024 11:47
@jiromaykin jiromaykin marked this pull request as draft July 18, 2024 12:34
@jiromaykin jiromaykin added the wip Work in progress label Jul 18, 2024
@jiromaykin jiromaykin force-pushed the feature/2450-nlds-npm-button-tokens branch from dc02592 to a60935f Compare November 7, 2024 09:37
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

wip Work in progress

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant