@skodaflow/web-tokens

Flow Web Tokens contains Skoda Flow Design system tokens and basic style definitions.

Installation

Install the library:

npm i @skodaflow/web-tokens --save

Obtain the tokens definition from the repository:

import tokens from '@skodaflow/web-tokens/src/tokens.json';

Changelog

• 3.1.2.: Updated Display typography line height
• 3.1.1.: Added src/fonts.scss to ease backward compatibility
• 3.1.0.: Added disclaimer1 and disclaimer2, warning-secondary flipped with warning-tertiary, info-secondary flipped with info-tertiary
• 3.0.0.: Structure changes, added basic components style, removed assets that should be obtained from the brand portal, Version guide
• 2.11.0.: Added new Semantic color (info-tertiary)
• 2.10.0.: Added new Semantic color (warning-tertiary) and modified existing colors (brand-primary, brand-hover-primary, brand-hover-secondary, semantic-alert-primary, semantic-positive-primary)
• 2.9.0.: Added new Semantic colors (secondary, tertiary)
• 2.8.0.: Added transparent-tertiary and transparent-quarternary, caption1 is no longer uppercased
• 2.7.2.: Updated Semantic colors
• 2.7.1.: Updated letter-spacing from 0.002em to 0.02em
• 2.7.0.: Updated grid, Headings letter-spacing, and Elevation style
• 2.6.1.: Updated Semantic colors
• 2.6.0.: Added List typography variant
• 2.5.0.: Added RTL font
• 2.4.2.: Added Icons font
• 2.4.1.: Corrected Display typography responsive sizes
• 2.4.0.: New CI updates x Removal of Old CI tokens
• 2.2.3.: Typography: updates
• 2.2.2.: Colors: CSS vars and HEX values, Grid tokens
• 2.1.0.: Effects added
• 2.0.3.: Minor changes
• 2.0.2.: Breakpoints for typography responsive, minor fixes
• 2.0.1.: Initial release: breakpoints, colors and typography (formats: SCSS/JSON)

Resources

• Storybook
• Flow Design System