Svelte Vertical Timeline

Overview

The Svelte Vertical Timeline is a collection of Svelte components that allow users to create a vertical timeline. It provides a variety of features and customization options to meet the needs of different projects.

Features

• Basic Timeline: Display a list of events in a basic timeline format.
• Left Positioned Timeline: Position the main content of the timeline on the left side.
• Alternating Timeline: Display events on alternating sides of the timeline.
• Opposite Content: Display additional content on the opposite sides of the timeline.
• Customization: Customize the appearance of the timeline components.

Installation

To install the Svelte Vertical Timeline, follow these steps:

1. Install the package using npm:

npm install svelte-vertical-timeline

2. Import the required components into your project:

import { Timeline, TimelineItem, TimelineSeparator, TimelineDot, TimelineConnector, TimelineContent, TimelineOppositeContent } from 'svelte-vertical-timeline';

3. Use the components in your Svelte templates as needed:

<Timeline>
  <TimelineItem>
    <TimelineSeparator>
      <TimelineDot></TimelineDot>
      <TimelineConnector></TimelineConnector>
    </TimelineSeparator>
    <TimelineContent></TimelineContent>
    <TimelineOppositeContent></TimelineOppositeContent>
  </TimelineItem>
</Timeline>

Summary

The Svelte Vertical Timeline is a useful library for creating vertical timelines in Svelte projects. It offers a range of features such as basic timelines, left positioned timelines, alternating timelines, and customizable components. By following the installation guide, users can easily incorporate this library into their projects and create visually appealing and functional timelines.