feat(UIShell): add UI shell sass module

[tw15egan]

Closes #9129

Ports the UI Shell to sass module, includes the full theming ability.

Changelog

New

• UI Shell styles ported over to sass modules, and broken into 5 pieces:
  • content
  • header
  • header-panel
  • side-nav
  • switcher
• All can be imported by just using @use 'ui-shell. Not sure if there is a desire to only import certain pieces, as most are intertwined.

Changed

• Combined _vars.scss and _functions.scss

Removed

• Removed some deprecated code from side-nav.scss
• Did not port over _navigation-menu.scss ,_product-switcher.scss, _theme.scss as it relates to the deprecated SideNavHeader, SideNavDetails, and SideNavSwitcher, or other deprecated code styles/tokens.

Testing / Reviewing

Compare the stories from the old storybook to the new one. Be aware, the UI Shell is now fully themed, so you may need to switch themes to see similar color variants.

[netlify]

❌ Deploy Preview for carbon-react-next failed.

🔨 Explore the source changes: 377c526

🔍 Inspect the deploy log: https://app.netlify.com/sites/carbon-react-next/deploys/60f6d998668e5000082e0965

[netlify]

✔️ Deploy Preview for carbon-elements ready!

🔨 Explore the source changes: 377c526

🔍 Inspect the deploy log: https://app.netlify.com/sites/carbon-elements/deploys/60f6d998019e160007584c2a

😎 Browse the preview: https://deploy-preview-9195--carbon-elements.netlify.app

[netlify]

✔️ Deploy Preview for carbon-components-react ready!
Built without sensitive environment variables

🔨 Explore the source changes: 377c526

🔍 Inspect the deploy log: https://app.netlify.com/sites/carbon-components-react/deploys/60f6d998b8cf8000071a434b

😎 Browse the preview: https://deploy-preview-9195--carbon-components-react.netlify.app