fix: Columns/Column styles to not rely on Stack styles

[gnapse]

Closes #...

Short description

For simplicity (and lazyness) the Columns component reused the Stack styles to make sure column cells also had the vertical spacing applied for when they are collapsed into a stack in narrower viewports (i.e. its feature of being responsive).

Since we changed the Stack styles recently, this broke the Columns styling. This PR brings back the styles but not they are part of the core Columns css and not a cross-component reference anymore (which admittedly was always a bad idea).

PR Checklist

• Added tests for bugs / new features
• Updated docs (storybooks, readme)
• Executed npm run validate and made sure no errors / warnings were shown
• Described changes in CHANGELOG.md
• Bumped version in package.json and package-lock.json (npm --no-git-tag-version version <major|minor|patch>) ref
• Updated all static build artifacts (npm run build-all)

Versioning

v9.2.0-beta.8

[gnapse]

Github's gotta be kidding me. I assigned the product group so that I could get a random assignment (because I want to involve in these reviews more people than just Frankie and me), and it assignes Frankie anyway.

I was still going to assign Frankie manually after the fact, but it's funny how this "random" assignment often behaves.

[frankieyan]

Maybe it's a good opportunity to move away from the negative margins now that we're decoupling from the Stack component's styles, as it does make it a bit confusing to debug when looking at the devtools. Perhaps we can leverage the collapseBelow prop to apply the responsive classes we need here? Something like:

.collapse-below-tablet.space-xsmall .column:not(:first-child) {
	margin-top: var(--reactist-spacing-xsmall);
}

// The rest of the space rules...

@media (min-width: 768px /* --reactist-breakpoint-tablet */) {
    .collapse-below-desktop.space-xsmall .column:not(:first-child) {
	    margin-top: var(--reactist-spacing-xsmall);
    }

    // The rest of the space rules...
}

@media (min-width: 992px /* --reactist-breakpoint-desktop */) {
	.column:not(:first-child) {
	    margin-top: 0 !important;
    }
}

Perhaps combining the min-width and the max-width queries as well we can omit that desktop override.

[gnapse]

I agree there's room for improvement, but unless there's an actual bug with the current approach, I'd like to move on with this PR for now. It is blocking the use of Columns right now in Twist, and I'd rather not take the detour now.