bug(Forms): using Form.SubHeading inside a card with stack doesn't display the stack border

[langz]

🐛 Bug Report

Using Form.SubHeading inside a card with stack doesn't display the stack border between the elements in the card.

I'm not 100% sure what we want the expected result to be here, but I find it strange that the "stack border" doesn't display in this scenario.

There's a lot of demos/examples in the docs that's written like this, and the "stack border" is not displayed. So it would be nice to know if it should be like this, or not 🙏

To Reproduce

Take a look in the following CSB.
It includes a few different demos/examples, using Form and Card stack.

[joakbjerk]

It looks like you can fix this by wrapping the Form.SubHeading inside a Flex.Item. Not sure if this is the intended way for the user to fix this problem, or if it should work without the wrapping. On another note thought the Form.SubHeading itself do receive a grey underline beneath it by doing this, not sure if that is correct either, visually 🤔

CSB

[langz]

It looks like you can fix this by wrapping the Form.SubHeading inside a Flex.Item. Not sure if this is the intended way for the user to fix this problem, or if it should work without the wrapping. On another note thought the Form.SubHeading itself do receive a grey underline beneath it by doing this, not sure if that is correct either, visually 🤔

CSB

A lot of question, and uncertainties 😄 🤔

[joakbjerk]

Conclusion of discussion: Remove stack property from Forms demo examples that uses the Card component

[tujoworker]

Actually, we rather should make "space" the default separator and make the line "opt-in".

I have started on this change already.

[tujoworker]

🎉 This issue has been resolved in version 10.17.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀