Addon-docs: Fix layout of Preview container

[necolas]

Issue: #8377

The Preview component doesn't always contain its content. Make sure that the Preview container has a max width of 100% of its parent so that stories it contains do not cause it to expand horizontally.

What I did

Edited some styles so the preview container cannot exceed 100% of its parent width

How to test

• Is this testable with Jest or Chromatic screenshots?
• Does this need a new example in the kitchen sink apps?
• Does this need an update to the documentation?

I don't know if this is something you'd include in your tests.

[vercel]

This pull request is being automatically deployed with ZEIT Now (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://zeit.co/storybook/monorepo/gnzndivi3
🌍 Preview: https://monorepo-git-fork-necolas-next-preview-container.storybook.now.sh

[shilman]

Hi @necolas - thanks for putting this together! official-storybook is a collection of test stories that we use for exercising various bugs etc.

• I went through all the stories looking for a difference on the Docs tab due to this PR
• I added a new commit to try to test out this change, but that also didn't work.

You can see the official storybook on now.sh, auto-deployed: https://monorepo-git-fork-necolas-next-preview-container.storybook.now.sh/official-storybook/

You can also run it locally on your fork:

yarn bootstrap --core
cd examples/official-storybook
yarn storybook

Would you mind overwriting my commit with a story that exercises this change & shows how it improves the layout? I'll verify the before & after.

Thanks so much for your patience & contribution!

[ndelangen]

I think there's a div that needs overflow auto here:

[ndelangen]

@shilman WDYT?

[necolas]

You can see the issue here: http://necolas.github.io/react-native-web/docs/?path=/docs/components-scrollview--horizontal

[ndelangen]

@shilman can this PR receive your approval?

[shilman]

This looks great. Thanks @necolas and @ndelangen !!!