Add horizontal option for templated list editor of data list

[dawoe]

Now all options are displayed vertical.

Would be nice if we could have the option to display them horizontal.
This could be a config setting on the editor.

And then in the editor view instead of applying the class btn-group-vertical it could be btn-group-justified

[leekelleher]

Hi @dawoe, apologies for not replying sooner.

What I've been doing to get the horizontal layout with Data List's Templated List is to add CSS classes to the container.

In the configuration, the HTML attributes field, I add a key of class and a value of umb-property-editor--limit-width flex flex-wrap justify-between.

(of course, not very visible in a screengrab!)

To note, umb-property-editor--limit-width restricts the width of the property-editor (to 800px), the rest are Umbraco's own flexbox classes.

With all that said, I totally appreciate that this is a "sure, that's great if you know the CSS classes!" ... and a toggle would be much more friendly. 👍 I shall take a look when I'm next working on Data List. I just wanted to offer an immediate workaround if it was needed.

[leekelleher]

For anyone wanting to see the full configuration example...

Screenshot of Data List's Templated List configuration.

Screenshot of Data List using the Templated List (with the Number Range data-source).