Timeline

The timeline section displays chronological events or milestones. It supports two layout variants: a vertical layout (default) with optional alternating left/right positioning, and a horizontal scrollable layout for compact displays.

Configuration

- sectionType: timeline
  containerTag: section
  text:
    title: 'Our History'
    subTitle: 'Milestones that define us'
  timeline:
    layout: 'vertical'       # Options: vertical, horizontal
    alternating: true        # Alternate left/right (vertical only)
    events:
      - year: '2020'
        title: 'Founded'
        description: 'Company was established.'
        icon: 'rocket'       # Optional icon

Configuration Options

Layout Options

Property	Type	Required	Description
`timeline.layout`	string	No	Layout type ('vertical', 'horizontal'). Defaults to 'vertical'
`timeline.alternating`	boolean	No	Alternate left/right in vertical layout. Defaults to true

Event Properties

Property	Type	Required	Description
`year`	string	No	Year or time label (e.g., '2024', 'Q1')
`title`	string	Yes	Event title
`description`	string	No	Event description
`icon`	string	No	Icon name for the marker

Icons

The timeline uses the site's icon library from lib/layouts/icons/. Any icon name matching a file in that directory can be used (e.g., rocket, package, trending-up, globe, users, star, award, flag, zap, check-circle). If no icon is specified, a simple circle marker is shown.