AlaskaAirlines / AuroDesignTokens

Abstract UI atomic values to support the Auro Design System.

Home Page:https://auro.alaskaair.com/getting-started/developers/design-tokens

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Documentation bug with importing from SASS

ArcherScript opened this issue · comments

Please verify the version of Auro design tokens you have installed

4.3.1

Please describe the bug

  1. Import only @import "@aurodesignsystem/design-tokens/dist/tokens/SCSSVariables";
  2. Auro components display incorrectly
  3. Import both @import "@aurodesignsystem/design-tokens/dist/tokens/SCSSVariables"; and @import '@aurodesignsystem/design-tokens/dist/tokens/SassCustomProperties';
  4. Auro components display correctly

Reproducing the error

None

Expected behavior

Documentation should read that you need to import both, or fix the SCSSVariables to include necessary properties for rendering auro components correctly.

What browsers are you seeing the problem on?

Chrome

Additional context

I was trying to upgrade from v3 to v4, and this took me a really long time to fix/understand. Really hoping we can get this improved for future Auro users!

Exit criteria

Documentation is fixed or SCSSVariables import is fixed

@ArcherScript I am sorry for the confusion and any frustration you had with the project.

While I see your point on the install, it should also be noted that ./dist/tokens/SCSSVariables are ONLY required when a development environment requires the use of Sass variables. If a user is not using Sass or any part of the WCSS Sass files (there are pre-bundled CSS resources), then there is no need for this ref, and only ./dist/tokens/SassCustomProperties is required.

I do see opportunities to make this clearer and will look to update the documentation with other related work regarding updates we are making.

Append this document update to #148