Skip to content

Timeline block with animated line #246

@bph

Description

@bph

Discussed in #240

Originally posted by colorful-tones March 15, 2024
I feel inspired by Keith Devon's (co-founder of Highrise Digital) original Twitter (X) share here: https://x.com/keithdevon/status/1764938947233263861?s=20

He shared a neat timeline feature he built. It is a series of grouped elements stacked vertically in reverse chronological order. Each grouped timeline event has a date, a brief description, and a picture. As the user scrolls down the page, a vertical line visually ties each event on the timeline together by animating down the page (when in scroll view).

This could be tied to a CSS class and applied to a Group or Query block wrapper, in which we could use a block variation to extend core blocks to apply the class and then utilize the Interactivity API to apply the animated line.

This would tie together a lot of new and recent stuff coming out, and I would be happy to dive in.

Metadata

Metadata

Type

No type

Projects

Status

Published (Done)

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions