Update Color Tokens

[joshblack]

Updates to the component color tokens with two main objectives:

1. Make token names more user-friendly by applying usage specific names in order to help users more easily understand what the token is used for and when/where to apply it without having to frequently reference the usage guide.
2. Better account for the background layering modal. At the moment we only account for two layers and it needs to account for at least three. Third layer stacking currently breaks in the dark themes. See discussion post for more details
   • There are two possible solutions to solve this: creating a nested solution with each theme (proposal 1) or implementing inline theming (proposal 2)

Links and resources:

• Proposal 1 token list Color sets
• Proposal 2 token list Inline theming

Packages impacted:

• carbon-components
• carbon-elements

Discussion Link: #7743

Checklist

• Update 25-50% of components with new tokens behind feature flag
• Share new tokens with Release Partners
• Sync up for feedback
• Complete update of remaining components with new tokens behind feature flag
• Determine strategy for layering model, potential overlap with inline theming
• Ship any Sass helpers to assist with layering model / zoning / inline theming
• Ship any React components to help out with layering model / zoning / inline theming

[tw15egan]

Finalized token list

[tw15egan]

Token specs: #8187