Gap/blank/spacer blueprint "field"

Today I tried to do something on the layout of my client’s panel that I supposed others might have wanted to do before: to layout fields leaving blank spaces in order to align certain fields in a grid. For this the width attribute is very helpful but still not enough.

Here’s an example of what I wanted to achieve:

With a “blank” type field this could be doable using a 1/4 width blank before and a 1/2 width blank after the checkbox.

If this feature already exist, please take this as a “how can I do this?”

Thanks!

There is no blank field, and it would probably be easier to achieve this with custom panel css.

You could, however, easily create a blank custom field yourself.

Having said that, IMHO, it would be better to place the checkbox right after the time field, anyway (so as to have four fields, why should the end date take up double the space of the start date field?)

True, I could create my own custom field. That would be easy and handy. Thanks for the tip!

The custom css approach could work for one isolated case, but it would be messy if you had different combinations of field widths in different templates, etc

Having said that, IMHO, it would be better to place the checkbox right after the time field, anyway (so as to have four fields, why should the end date take up double the space of the start date field?)

OK, you’re right. Maybe that wasn’t the best example. Actually in the end I solved it with a completely different approach, but it got me thinking about the possibilities of a grid-intensive form. Imagine you want to have rows with each 5 fields for 5 similar fields that work make more sense displayed in line, but only two of them need an extra checkbox (or any field) bound to it. You don’t want to have 7 columns - that would mess up the whole 5-column scheme. But anyway, yes, a custom field would totally do the trick. Thank for the tip again.

I eventually discovered that an info field can be used as a spacer by simply not giving it a label or text. Thought of posting it here in case anyone needs it one day.

gap:
    type: info
    width: 1/2

1 Like