Timeline - Keep React

Timeline Component is a graphical representation used to visualize a sequence of events or activities over time. It presents information in a chronological order, allowing users to track the progression of events, milestones, or changes. Timelines often include markers, labels, and other visual cues to enhance understanding and engagement.

Table of Contents#

Default Timeline#

The Default Timeline is a fundamental component that visually presents a sequence of events over time.

  1. September 23,2022

    Step 1 Completed

    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima, incidunt.

  2. September 23,2022

    Step 2 Completed

    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima, incidunt.

  3. September 23,2022

    Step 3 Completed

    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima, incidunt.

Dashed Border Timeline#

The Dashed Border Timeline component represents a timeline with dashed borders.

  1. September 23,2022

    Step 1 Completed

    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima, incidunt.

  2. September 23,2022

    Step 2 Completed

    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima, incidunt.

  3. September 23,2022

    Step 3 Completed

    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima, incidunt.

Timeline With Image#

The Image Timeline is a dynamic component that showcases a sequence of events along with corresponding images.

  1. September 23,2022

    Step 1 Completed

    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima, incidunt.

    item1

  2. November 10, 2023

    Step 2 Completed

    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima, incidunt.

    item2

  3. December 20,2023

    Step 3 Completed

    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima, incidunt.

    item3