-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Eliott
committed
Oct 15, 2024
1 parent
675460f
commit d094d4e
Showing
1 changed file
with
88 additions
and
34 deletions.
There are no files selected for viewing
122 changes: 88 additions & 34 deletions
122
packages/react/components/timeline/Timeline.example.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,41 +1,95 @@ | ||
import React from 'react' | ||
import { Timeline, TimelineItem, TimelineMarker, TimelineContent } from './index' | ||
import { Columns, ColumnsItem } from '../columns' | ||
|
||
const TimelineExample: React.ReactNode = | ||
|
||
<Timeline> | ||
<TimelineItem undone> | ||
<TimelineMarker iconName='tri-search' /> | ||
<TimelineContent | ||
content='Modification de votre identifiant de connexion' | ||
contentLink="Voir l'email" | ||
heading='20 Septembre' | ||
link='link' | ||
/> | ||
</TimelineItem> | ||
<TimelineItem active> | ||
<TimelineMarker iconName='tri-search' /> | ||
<TimelineContent | ||
content='SMS Bon voyage avec seuil usage inclus' | ||
contentLink='Voir le SMS' | ||
heading='08 Juillet' | ||
link='link' | ||
/> | ||
</TimelineItem> | ||
<TimelineItem done> | ||
<TimelineMarker iconName='tri-search' /> | ||
<TimelineContent | ||
content='Passage en boutique concernant un accessoire' | ||
heading='06 Juillet' | ||
/> | ||
</TimelineItem> | ||
<TimelineItem done> | ||
<TimelineMarker iconName='tri-search' /> | ||
<TimelineContent | ||
content='Modification de votre adresse de facturation' | ||
heading='05 Mai' | ||
/> | ||
</TimelineItem> | ||
</Timeline> | ||
<Columns> | ||
<ColumnsItem> | ||
<Timeline> | ||
<TimelineItem undone> | ||
<TimelineMarker iconName='tri-bell' /> | ||
<TimelineContent | ||
content='Modification de votre identifiant de connexion' | ||
contentLink="Voir l'email" | ||
heading='20 Septembre' | ||
link='link' | ||
/> | ||
</TimelineItem> | ||
<TimelineItem active> | ||
<TimelineMarker iconName='tri-bell' /> | ||
<TimelineContent | ||
content='SMS Bon voyage avec seuil usage inclus' | ||
contentLink='Voir le SMS' | ||
heading='08 Juillet' | ||
link='link' | ||
/> | ||
</TimelineItem> | ||
<TimelineItem done> | ||
<TimelineMarker iconName='tri-bell' /> | ||
<TimelineContent | ||
content='Passage en boutique concernant un accessoire' | ||
heading='06 Juillet' | ||
/> | ||
</TimelineItem> | ||
<TimelineItem done> | ||
<TimelineMarker iconName='tri-bell' /> | ||
<TimelineContent | ||
content='Modification de votre adresse de facturation' | ||
heading='05 Mai' | ||
/> | ||
</TimelineItem> | ||
</Timeline> | ||
</ColumnsItem> | ||
<ColumnsItem> | ||
<Timeline horizontal> | ||
<TimelineItem done> | ||
<TimelineMarker iconName='tri-bell' /> | ||
<TimelineContent | ||
content='Modification de votre identifiant de connexion' | ||
contentLink="Voir l'email" | ||
heading='20 Septembre' | ||
link='https://bouyguestelecom.fr' | ||
/> | ||
</TimelineItem> | ||
<TimelineItem done> | ||
<TimelineMarker | ||
iconColor='WHITE' | ||
iconName='tri-bell' | ||
/> | ||
<TimelineContent | ||
content='SMS Bon voyage avec seuil usage inclus' | ||
contentLink='Voir le SMS' | ||
heading='08 Juillet' | ||
link='link' | ||
/> | ||
</TimelineItem> | ||
<TimelineItem active> | ||
<TimelineMarker | ||
iconColor='WHITE' | ||
iconName='tri-bell' | ||
/> | ||
<TimelineContent | ||
content='SMS Bon voyage avec seuil usage inclus' | ||
contentLink='Voir le SMS' | ||
heading='08 Juillet' | ||
link='link' | ||
/> | ||
</TimelineItem> | ||
<TimelineItem undone> | ||
<TimelineMarker | ||
iconColor='WHITE' | ||
iconName='tri-bell' | ||
/> | ||
<TimelineContent | ||
content='SMS Bon voyage avec seuil usage inclus' | ||
contentLink='Voir le SMS' | ||
heading='08 Juillet' | ||
link='link' | ||
/> | ||
</TimelineItem> | ||
</Timeline> | ||
</ColumnsItem> | ||
</Columns> | ||
|
||
export default TimelineExample |