WIP: Design tokens Sass variable compilation (DO NOT MERGE)

[pastelcyborg]

Done

• Style Dictionary compilation steps to compile Sass variables from our new design tokens

Fixes [list issues/bugs if needed]

QA

• Open demo
• [Add QA steps]
• Review updated documentation:
  • [List any updated documentation for review]

Check if PR is ready for release

If this PR contains Vanilla SCSS code changes, it should contain the following changes to make sure it's ready for the release:

• [ ] PR should have one of the following labels to automatically categorise it in release notes:
  • Feature 🎁, Breaking Change 💣, Bug 🐛, Documentation 📝, Maintenance 🔨.
• [ ] Vanilla version in package.json should be updated relative to the most recent release, following semver convention:
  • if CSS class names are not changed it can be bugfix release (x.x.X)
  • if CSS class names are changed/added/removed it should be minor version (x.X.0)
  • see the wiki for more details
• [ ] Any changes to component class names (new patterns, variants, removed or added features) should be listed on the what's new page.

Screenshots

[if relevant, include a screenshot or screen capture]

[webteam-app]

Demo

Jenkins

demos.haus

[bartaz]

Next cycle we will attempt integrating tokens in new architecture first, and consume them here from there (as an external package/dependency?), for better consistency.

Closing this for new, we will reopen/revisit when needed.

Thanks @pastelcyborg !