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.