Need help making sure I fixed those issues correctly.

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 90.46%. Comparing base (28bc599) to head (38e42eb).
Report is 192 commits behind head on dev.

@@            Coverage Diff             @@
##              dev    #8910      +/-   ##
==========================================
+ Coverage   89.82%   90.46%   +0.63%     
==========================================
  Files         412      419       +7     
  Lines       11878    12210     +332     
  Branches     2364     2385      +21     
==========================================
+ Hits        10670    11046     +376     
+ Misses        681      628      -53     
- Partials      527      536       +9     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

@ncigula @aabney-Tamus @fabianschurz This PR should fix your issues. If you want to confirm, please do so.

@danielchalmers What if we allow up to 20 as the max value of spacings? Because if you used Spacing="10" before you got bigger gaps than when you use Spacing="16" now, right?

What shall we write in the migration guide? How to calculate from old spacing to new one?

Yes, it looks like this should fix #4869

@danielchalmers What if we allow up to 20 as the max value of spacings? Because if you used Spacing="10" before you got bigger gaps than when you use Spacing="16" now, right?

What shall we write in the migration guide? How to calculate from old spacing to new one?

It uses the CSS gap utility which only goes up to 16. Would be good to see that increased.

The calculation is a little complex because the width, padding, and margin were changed before and now it's just gap. I would just tell people to revise it by eye. @henon

@henon This should be ready to go - I've completely reworked the grid spacing system and it should be the best of both worlds now. In the Migration Guide it just needs to say "it's been scaled 2x so you need to double your current spacing". Very easy to switch over and fixes the original issues while keeping it close to the original design.

The old grid used 8px as the spacing unit?

The old grid used 8px as the spacing unit?

Yes; It was applying 4px to all sides. Now only top & left

Thanks @danielchalmers

Added this to the migration guide

@ncigula @aabney-Tamus @fabianschurz This PR should fix your issues. If you want to confirm, please do so.

@henon Yes i believe it would with the changes in _grid.scss because the margin value would no longer be bigger then the value added on top the 100% width