Component <Snapshots />
Props
| Props | Type | Meaning | Possible values |
|---|---|---|---|
| images | array | Array of images links | Array of strings |
| imageSize | number / string | Set image size | from 0 to any number or string with units |
| borderRadius | number / string | Set image border radius | from 0 to any number or string with units |
| shift | number | Set image border radius | from 0 to any number |
Images
Examples:
<Snapshots images={['https://assets.moneymade.io/images/profile/1.png', 'https://assets.moneymade.io/images/profile/2.png']} />
<Snapshots images={['https://assets.moneymade.io/images/profile/1.png', 'https://assets.moneymade.io/images/profile/2.png', 'https://assets.moneymade.io/images/profile/3.png', 'https://assets.moneymade.io/images/profile/4.png', 'https://assets.moneymade.io/images/profile/5.png']} />
Image Size
Examples:
<Snapshots imageSize={48} images={['https://assets.moneymade.io/images/profile/1.png', 'https://assets.moneymade.io/images/profile/2.png', 'https://assets.moneymade.io/images/profile/3.png', 'https://assets.moneymade.io/images/profile/4.png', 'https://assets.moneymade.io/images/profile/5.png']} />
<Snapshots imageSize="58px" images={['https://assets.moneymade.io/images/profile/1.png', 'https://assets.moneymade.io/images/profile/2.png', 'https://assets.moneymade.io/images/profile/3.png', 'https://assets.moneymade.io/images/profile/4.png', 'https://assets.moneymade.io/images/profile/5.png']} />
Border Radius
Examples:
<Snapshots imageSize={48} borderRadius={0} images={['https://assets.moneymade.io/images/profile/1.png', 'https://assets.moneymade.io/images/profile/2.png', 'https://assets.moneymade.io/images/profile/3.png', 'https://assets.moneymade.io/images/profile/4.png', 'https://assets.moneymade.io/images/profile/5.png']} />
<Snapshots imageSize={48} borderRadius="50%" images={['https://assets.moneymade.io/images/profile/1.png', 'https://assets.moneymade.io/images/profile/2.png', 'https://assets.moneymade.io/images/profile/3.png', 'https://assets.moneymade.io/images/profile/4.png', 'https://assets.moneymade.io/images/profile/5.png']} />
Shift
Examples:
<Snapshots imageSize={48} shift={0} images={['https://assets.moneymade.io/images/profile/1.png', 'https://assets.moneymade.io/images/profile/2.png', 'https://assets.moneymade.io/images/profile/3.png', 'https://assets.moneymade.io/images/profile/4.png', 'https://assets.moneymade.io/images/profile/5.png']} />
<Snapshots imageSize={48} shift={30} images={['https://assets.moneymade.io/images/profile/1.png', 'https://assets.moneymade.io/images/profile/2.png', 'https://assets.moneymade.io/images/profile/3.png', 'https://assets.moneymade.io/images/profile/4.png', 'https://assets.moneymade.io/images/profile/5.png']} />