buildo / bento-design-system

A customizable and extensible Design System framework for React.js projects
https://www.bento-ds.com
MIT License
107 stars 12 forks source link

Fix Columns layout to respect space between columns #836

Open veej opened 6 months ago

veej commented 6 months ago

Strategy inspired by braid. Instead of using gap, we use a marginLeft on each column content (inside the column, so that it's taken into account in determining the width of the real content).

Tested successfully on collapse

I added a new story to verify that the behavior is consistent in different cases (both columns with an explicit width, explicit width + auto, explicit width + content, ...)