This commit introduces a comprehensive update to the theme tokens in the
Cunningham package. The previous color definitions have been replaced
with a new structure that includes global color tokens for branding and
contextual elements. Additionally, the SCSS and JS files have been
refactored to align with this new token architecture, enhancing
maintainability and ensuring a cohesive design system across the
application. The TypeScript configuration has also been updated to
support JSX syntax.
This commit updates the theme colors in the Storybook configuration to
use the new global color definitions. The changes include replacing
greyscale colors with their corresponding gray colors for consistency.
Additionally, the theme structure has been refactored to align with the
updated token architecture, enhancing maintainability and ensuring a
cohesive design system across the application.
The generated sass from tokens containing commas, like font families was
not valid due to the way maps are made in sass. So we wrap those value
in quotes.
We realized that even if the Figma sketches indicates that the icons
are 16px in reality the rendered DOM was not visualy matching the
sketches. We needs 19px to match the sketches.
