Love the new padding/margin controls as of 1.5.1rc, however, I’d love to see more space on the left and right inputs to allow for longer variables or calc()'s.
My current fix:
.handle.left input:focus,
.handle.right input:focus {
background-color: var(--builder-bg-3) !important;
width: auto;
height: 26px;
position: absolute;
top: 2px;
}
.handle.right input:focus {
right: 0;
}
.handle.left input:focus {
left: 0;
}
I’ve seen what this looks like and it’s not bad.
However, I’d like to see what elegant design solution the team can come up with.
I do agree though that CSS variables should be better and more elegantly displayed.
At the same time, I also like the new 4-quadrant approach, similar to Webflow.
There has to be a middle ground somehow. I heard Zion has an interesting take on this.
I like the new UI for the margin and padding.
Btw, I wish that the previous UNIT remain as previous. Bricks Unit is intelligent. We can just type the value and unit in the value field(exp: 14rem), then hit enter to see the unit changes(to REM) accordingly. We can use the dropdown when we need it.
Please bring the unit back.
Nice Ui but bad function. Please bring units back.
Maybe autocomplete is a valid way.
You save additional clicks (good ux) and show the available units (good ui).
Yes. Removing the UNIT is not ideal. It would cause more inconvenience than convenience.
I used to double-click the value field to highlight all text and type a new value. Now, I had to carefully highlight the value when I wanted to change the value after the UNIT was removed.
Is there any scenario where all can be satisfied? Margin / Padding control in a single box like webflow, more space to enter var and ability to have units dropdown? I don’t think so.
I agree that we should have the units back. I didn’t update my sites to rc just because of this change.
And of course we can have everybody satisfied. Just add an option for this in the settings so we can enable or disable units.
If we divide in “is necessary from ux / ui” side and "personal wishes yes I think there are scenarios.
single box like webflow: nice ui but bad ux because
no units - bad ux because you won’t get the possibilities and have to try what works and what not
two boxes for margin / Padding: not as charming as a single one but gives the space for larger inputs. Acceptable if both are in the viewport for short mouse ways without scrolling.
additional unit fiels - acceptable from UI maybe not the best option from ux because you need two additional mouseclicks to choose
larger inputfields with autocomplete list - works I think. You’re able to add variables but also classic units that are shown up in a autocomplete. That shows what units are possible. Also typing things like “auto” would work.
May be all of them as user preference. So user choose what he wants. But I am not sure how much maintenance work this will increase for Bricks team and if Bricks UI is ready to accomodate such flexibility.
Waiting to see if Thomas will bring the one more powerful than the previous one later.
I have tested and noticed something.
The UNIT removal is for the plan of setting the default unit(on the roadmap as it is in progress).
When I type a value without a unit, it outputs the unit as px as default.
https://sc.jornes.com/conversations/d1ca4636-e5d9-58f4-8a10-d88f8f52fe88
I still prefer to have the UNIT back…I find it will work better. Or is Thomas implementing something better for the UNIT?
I agree with @jornes below, let Bricks gather feedback and create the next iteration of Units. I would rather not provide user choice on the units layout, as this will increase Bricks maintenance complexity, and I would prefer Bricks to focus on upcoming priority items. We can live with (and get used to) whatever Bricks decides.
Suggestion: remove the margin name (such as margin-right) in the center of the margin controls. Adds visual clutter without adding value. Use that blank space to expand the space for the left and right margins to allow more room for variable names.
I’d love to see a mockup/prototype of this idea.
This might actually be a great solution.
It’s important for me (as a heavy user of CSS variables) to be able to see, at a glance, what the values are set to.
As it stands with the new version 1.5.1 RC, you can only really see the top/bottom values, and not the right/left ones.
That said, it’s a welcome improvement over the original version. 
Good to know, I wouldn’t have thought of doing inputting without the unit type. If we can combine that with setting default units from the roadmap, might actually work fairly well for some workflows. Just maybe in the very middle show the default unit for all 4 sides so that it is visible on builder UI?
But you can use different units on different sides though, such as % right/left and rem top/bottom, or any other variation.
Unless I’ve misunderstood your suggestion.
Yeah, your right. Sorry, I should’ve finished my thought. I was thinking show the default unit in the middle but still be able to enter the unit specifically in each individual box. Does that make more sense?
I’m not sure.
What I am sure of though, is that the Bricks team will give things A LOT of thought and will research how this problem has been tackled in all the other popular platforms, while keeping in mind that CSS variables are very, very important to power users, and they should be readable… AND that the available units being selectable are very important to beginners (or those who forget what they are often, lol).
Yeah, just putting an idea out there. I’m not sure about it either. I just was intrigued by what @jornes showed of maybe not needing to add the unit, I just thought it would be nice to see the default unit type shown somewhere for reference if you do that. Especially for novice users, like myself. But agreed, I’ve been very happy with what the Bricks Team has been able to come up with so far and I’m just happy that we can give some feedback that actually gets looked at.
That doesn’t solve your problem that you still don’t know what Bricks can handle.
An input based on trial and error is not good.
We are not only talking about px, em and rem here. Also newer units like ch, svw, svh, dvw, dvh,lh and more have to be considered.