Quasar 
Timeline
A Timeline is a display of a list of events in chronological order. It is typically a graphic design showing a long bar labelled with dates alongside itself and usually events. Timelines can use any time scale, depending on the subject and data.
QTimelines have 3 media breakpoints. View on a desktop and click the “View Desktop” link on the right side, then resize the browser window to see the media breakpoints in action.
Installation
Edit /quasar.conf.js:framework: {
components: [
'QTimeline',
'QTimelineEntry'
]
}
Basic Usage
<q-timeline color="secondary"> |
QTimeline (Parent) Vue Properties
| Vue Property | Type | Description |
|---|---|---|
color | String | Color of the text |
dark | Boolean | When rendering on a dark background. |
QTimelineEntry (Child) Vue Properties
| Vue Property | Type | Description |
|---|---|---|
heading | Boolean | Display a timeline subject which helps group timeline entries into separate chunks. |
tag | String | HTML tag to use to render the timeline entry DOM element. |
side | Boolean | On wider windows, you can choose on which side to display this entry. Default is on the right side. |
icon | String | Icon to use. |
color | String | Color to use for this entry. |
title | String | Title of the entry. |
subtitle | String | Addition to title of the entry. |