Padding & Margin

Something easy to use, mostly to customize the padding and margin on mobile version, in desktop too, but i think will be more useful on mobile version.

Hello @Sumo-Ling5 thanks for this feedback. Here is a solution we are experimenting with.
Do you think we should retain Spacing as an easy name for the control or Padding?
When the desktop icon is clicked, it toggles the mobile so you can modify it based on the device.


The problem with S, M, L and XL Spacing is that maybe for a header it’s small. As example in the main header is an XL spacing size, from that, we jump to a complete page fit. If we have more margin lets says from 0 to 300px and 2 bars one for margin and one for padding (idea set up is to have separated bars for each direction that you can lock to move it together or not), i think will be a good option.

The spacing on mobile version sometimes is not ok, maybe to short or even some module is next to other link with no space, with this tool we can fix that while you get a final solution.

Let me show you a mobile example i attached:

In this case, the best option is just to add some padding on the bottom after the buttons of the main header, no need to add on top. That’s why I think a solution with the 4 independent vectors is the best option.

1 Like

About retain spacing, i think not, and here it comes another idea that i would add separatedly… the gap between assets on the same module. As example:

Here i can use some “spacing” between pricing cards… so maybe “spacing” is a good fit for that function if added instead of using for padding. Or you can use both, it just an idea to avoid any confusion.

1 Like

The content should be organized in tabs instead of being listed vertically. But I understand that it may not be feasible to make this change at the moment.

1 Like