Improve dividers and allow sidebar positioning when Layout is flowing as row.

[manuelpuyol]

Dividers

Dividers in the Layout component weren't correctly set when the layout was flowing as a row. Here, I extracted the flow-as-row logic to a mixing, making it also adjust the necessary gutters and sizes for dividers. I'm also adding the Layout-divider--flowRow-shallow and Layout-divider--flowRow-hidden classes that were missing.

Before	After

Sidebar positioning

This PR also adds the Layout--sidebarPosition-flowRow-XYZ classes, which allows the user to decide where the sidebar should be placed when the Layout is flowing as row.

cc @vdepizzol

[changeset-bot]

🦋 Changeset detected

Latest commit: 3955254

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@primer/css	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[jonrohan]

👍🏻

Not part of this PR, but I was wondering if we should use something other than border to show the containers, just in case someone thinks that's part of the component?

[manuelpuyol]

👍🏻

Not part of this PR, but I was wondering if we should use something other than border to show the containers, just in case someone thinks that's part of the component?

agree 100%! we can refactor the docs later :)

[manuelpuyol]

@jonrohan @simurai I've just changed the divider class a bit if you want to take another look 3955254