wrap nav and snippet in a div

[miguelcobain]

This just wraps the nav and snippet in a div.
This way it's very easy to have horizontal demos by just adding the docs-flex docs-flex-row classes to the docs-demo component. Results in something like this:

Doesn't affect any existing vertical demos.

If an horizontal=true flag is desired, I can add it. It could add those classes to the container and also apply a left border on the snippet.

[samselikoff]

hm - I'd like to think a little more about this.

In the meantime, docs-flex and other Tailwind utility classes should not be seen as Public API. I think we need to make this more clear.

[miguelcobain]

Yes. I would use those assuming the risk.
But one could easily write css for the class that sets flex direction row.

This can either be seen as a "request to support horizontal demos" or just a "request to add a div that facilitates this hack". :)

[samselikoff]

haha true - but its still public API! and should be tested

[miguelcobain]

When I first created this, I wasn't trying to make ec-addon-docs support horizontal demos.

If such a thing is desired, please let me know and I can do it properly, with tests and proper documentation.
This PR was just a simple way to support it unofficially.

[samselikoff]

Understood. I'm fine with that as long as you are ok with the risk!