fix(section): apply a block padding override to both axes

[markdumay]

Follow-up to #186, which honoured padding on cta and panels but applied it to the vertical axis only.

Why that was wrong

One number producing two different values surprises authors. With the default config a block carrying padding: 4 rendered:

24px vertical   /   48px horizontal

— an asymmetric box, and the only section on its page off the site's rhythm. That is how this surfaced: a reviewer looked at the output and asked why px and py disagreed.

After

Both axes take the override, scoped to the inner content container:

Case	Inner padding
no override	48px all sides — site default, unchanged
padding: 4	24px all sides
padding: 0	0px all sides

The outer container keeps the site padding

This is the part that makes the horizontal axis safe to touch. section.html builds two containers, and until now both derived their x from the same value:

                outer                              inner
no override     px-xxl-0 px-3 px-md-5 py-0         px-3 px-md-5 py-5
padding: 4      px-xxl-0 px-3 px-md-5 py-0         px-4 py-4
padding: 0      px-xxl-0 px-3 px-md-5 py-0         px-0 py-0

The outer row is now identical in all three cases. Measured on a fixture page with all three side by side:

1440px   section edges at x=48 for all three, outer padding 48px each
 390px   section edges at x=16 for all three, outer padding 16px each

So an overridden section still lines up with its neighbours — the author is repadding their content, not moving the section out of the page grid.

#186 avoided the horizontal axis precisely because it fed the outer container. Splitting the two removes that constraint instead of trading against it.

Mobile overrides

The site-level taper is dropped along with the values it refines. [main.padding.mobile] exists to taper the site defaults; an author naming one number for one section is not asking for a taper.

At 390px with the site's mobile.x = 3, an unoverridden section renders 48px vertical / 16px horizontal while padding: 4 renders 24px on all four sides — and the outer container still tapers to 16px either way.

Blast radius

Nothing on the sites I can check sets padding on a cta or panels block today — infusal.io removed the last of them in infusal/infusal.io#394, and it uses no panels. So this changes the semantics for future use rather than moving anything currently rendered.

Checks

pnpm test passes: 40 pages, no errors. Verified on a 1119-page site across all three cases at 1440px and 390px.

[markdumay]

🎉 This PR is included in version 2.3.4 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀