Vertical Timeline

Hi Bubblers,

I am currently trying to build a vertical timeline into my app. The aim consists of building a timeline as depicted in the image below. Each section in the timeline section contains an image, text, and date that I retrieve from the database.
I tried building this with plugins but they don’t offer enough customizability. I already tried building it with a repeating group but I failed at pushing the content from left to right. (Even if this would work, I aim to animate the icons when scrolling down, which would make it even more complicated)

Does anybody have an approach on how to tackle this in the best way? Any hint is highly appreciated! Many thanks in advance.

Did you figure this out? If yes, how?

I can’t fully remember how I built it back then, but you could for example use two repeating groups (one left and one right) that have the exact data source. When the left one’s index (Current cells index) is uneven (1,3,5 etc.) make the block visible. When the right one’s index is even make the block visible. :slight_smile:

Hi @kepro,

Have a look here: https://bubble.io/page?type=page&name=test&id=employee-dir&tab=tabs-1. It is a repeating group with a couple groups, icons and texts in it. It uses the condition modulo to either show the group on the left or on the right.

Hope this helps,

Gerbert
MVP Design

Exactly, that’s it! If the cell index is uneven/even you can play with the modulo. That’s the info that I skipped above. :slight_smile:

1 Like