IDEA: Allow Repeating Group Separator to be a conditional option

IDEA: Allow Repeating Group Separator to be a conditional option

REASON:
It’s impossible as far as I can tell to have the separator of the repeating group be responsive so that on iPad for example, the repeating group separator is applied between empty cells of the repeating group, as well as the last filled cell.

The use case for the separator being conditional is that I can turn it off completely when the current width of the screen is a certain size so at least the separators don’t display at all - it’s better to have no separator than broken looking ones.

4 Likes

Possible workaround, add a group with conditionals borders in the cell. I know it’s heavier, but it gives you a lot of ui flexibility. As I usually add one for hover effects anyway, it’s what I do when I need conditional dividers…

I started to do that but the number of conditionals was getting crazy and I wanted a border on the whole repeating group too so ended up with double borders in certain scenarios…

has there been a new option for this or we still cant do it, by me its still impossible!

I ran into something similar recently when creating a grid to contain logos that would repond nicely down to mobile. Here’s a snapshot at tablet size:

I faked the 1px ‘separator’ for both horizontal and vertical cells by nesting the RG within a group which had the background colour of the separator I wanted (grey), then set the RG cell background to white with transparent separators & min widths (which solved for empty cells). For the top and bottom, I just gave the RG 1px margin to fake the separators. I then set the RG column # to change based on page width.

If I remove a logo it still works fine.

Not sure if this solves your problem, but happy to post a more detailed follow up if it sounds helpful.

You can play with it here (bottom of page).

Reproductive Health Australia (bubbleapps.io)

1 Like

That site looks good. Is that a client project or yours?

Thanks, it’s a client project.