1857330 - Add a table to Storybook that displays our collection of design tokens

Status: RESOLVED FIXED

(Toolkit :: Themes, enhancement)

Description

[Jules Simplicio [:jules]]

We'd like to have a table that displays our existing design tokens' variables, with previews of the styles if possible (e.g. for color a swatch, for typography some text, for border a transparent square with a 1px border, etc.). Previews may not be possible for every token type, however, but we can brainstorm ideas.

This work can be done with JSON to HTML. For previews, we can set the 'type' on the token so the script knows what type of preview (swatch, border, etc.) to show.

Comment 1

[Hanna Jones [:hjones]]

Attachment: Bug 1857330 - Add a design tokens table to storybook r=#recomp-reviewers

Comment 2

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/ff7a1382c006
Add a design tokens table to storybook r=reusable-components-reviewers,desktop-theme-reviewers,tgiles,jules

Comment 3

[Serban Stanca [:SerbanS]]

https://hg.mozilla.org/mozilla-central/rev/ff7a1382c006