docs(aspect-ratio): update aspect ratio docs for v11

[joshblack]

This PR introduces two updates to our storybook for v11:

• Grid storybook styles are now scoped to a storybook-specific class name
• The Aspect Ratio story has been updated and includes controls

Changelog

New

• The AspectRatio story has been updated and now uses controls

Changed

• The Grid storybook styles are now scoped

Removed

Testing / Reviewing

• Verify no regression exists between the current grid storybook styles and the ones in this PR
• Verify the AspectRatio story renders as intended (correct aspect ratio and background color per item)
  • Also, verify the controls work when switching the "ratio" prop

[netlify]

✔️ Deploy Preview for carbon-react-next ready!

🔨 Explore the source changes: 3911026

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

😎 Browse the preview: https://deploy-preview-10636--carbon-react-next.netlify.app

[netlify]

✔️ Deploy Preview for carbon-components-react ready!

🔨 Explore the source changes: 3911026

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

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

[netlify]

✔️ Deploy Preview for carbon-elements ready!

🔨 Explore the source changes: 3911026

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

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

[jnm2377]

Looks great! Only change I think it needs is the aspect ratio story css only works for v10, we could just add an additional selector with cds or use prefix:

carbon/packages/react/src/components/AspectRatio/AspectRatio-story.scss

Line 8 in 3068b42

.aspect-ratio-story .bx--aspect-ratio {

[tay1orjones]

Yeah, we're missing the purple boxes

[joshblack]

Thanks for the catch @jnm2377 @tay1orjones! Updated