Components
Utilities
Fonts
Components
Utilities
Fonts
The Slider
The Slider is a component that lets you define a fixed height and width to elements that will be placed inline. Therefore you can easily create a carrousel for your pictures
- item-width: the width of child elements.
- height: the height of the slider component.
- gap: the space between child elements.
- hide-bar: hide the scroll bar.
Examples
Here we defined the slider's height at 200px and item-width at 250px, try to change these 2 values in the example bellow.






In this example we set a item-width value in percentage, in this case each element take 25% of the visible width. We use a gap set to 1 to space elements between them.






If you add the attribute `hide-bar` you can see that the scroll bar is not visible anymore. It can be usefull if you want to create a carousel with left and right arrow as the only way to navigate between elements.





