AlaskaAirlines / AuroDesignTokens

Abstract UI atomic values to support the Auro Design System.
https://auro.alaskaair.com/getting-started/developers/design-tokens
Apache License 2.0
19 stars 7 forks source link

ITS design token mapping #82

Closed blackfalcon closed 2 years ago

blackfalcon commented 2 years ago

Is your feature request related to a problem? Please describe.

ITS is working with a 3rd party vendor that is creating alternate design assets for their design system theme. The work they have produced has created a 'sticker sheet' of reusable CSS values. Fonts, colors, spacing, etc...

Describe the solution you'd like

The scope of this issue is to map all the values of the sticker sheet to the Auro design tokens. The goal is that, for the most part, we can simply swap out the Auro tokens for ITS tokens and this will effectively theme the UI.

Exit criteria

The deliverable for this is only a document that maps ITS value to Auro value. E.g. ...

var(--auro-color-ui-default-on-light) = (new value)

Any work regarding integrating these values into AuroDesignTokens is NOT in scope of this issue.

leeejune commented 2 years ago

Figma file with ITS color and type tokens (added Auro DS tokens)

Excel sheet with mapping

@blackfalcon I would love to go over this with you and solve a few discrepancies between the design tokens. Some tokens in ITS do not exist in Auro... and it's difficult to map the type tokens because they use a very different type ramp. Would love feedback on this.

blackfalcon commented 2 years ago

@leeejune please schedule a meeting with me so that we can review this together and come up with a proposal.