Activity Timeline
Activity Timeline
The activity timeline displays each of the user’s upcoming, current, and past activities.
Base
Preview
No content has been added for this component.
No content has been added for this component.
About Activity Timeline
Each Activity timeline item receives its width from the parent list. It can consume the full width of the main page area or be placed in the smaller right sidebar.
Accessibility
Text describing the type of timeline item is placed in a span. It is the
first element in the timeline item and should be hidden with the
.slds-assistive-text class. The SVG image does not need the
.slds-assistive-text class.
Overview of CSS Classes
| Selector | .slds-timeline__media |
|---|---|
| Summary | Create each activity timeline item in a list |
| Support | dev-ready |
| Restrict | .slds-media |
| Variant | True |
| Selector | .slds-timeline__title |
|---|---|
| Summary | |
| Restrict | .slds-timeline__media h3 |
| Selector | .slds-timeline__icon |
|---|---|
| Summary | Icon associated with timeline item |
| Restrict | .slds-timeline__media .slds-media__figure |
| Selector | .slds-timeline__media_call |
|---|---|
| Summary | |
| Restrict | .slds-timeline__media |
| Variant | True |
| Selector | .slds-timeline__media_email |
|---|---|
| Summary | |
| Restrict | .slds-timeline__media |
| Variant | True |
| Selector | .slds-timeline__media_event |
|---|---|
| Summary | |
| Restrict | .slds-timeline__media |
| Variant | True |
| Selector | .slds-timeline__media_task |
|---|---|
| Summary | |
| Restrict | .slds-timeline__media |
| Variant | True |