Design System Grosfillex
Créé par Dedi.
Sliders
Les sliders sont des éléments graphiques permettant d'afficher des éléments sur plusieurs pages. Cela peut notamment servir pour présenter des galeries de médias, des produits, des actus etc.
Slider principal
<div class="default-slider">
<div>
...
</div>
<div>
...
</div>
</div>
Visuels produit
<div class="product-slider-wrapper">
<div class="product-show-images-slider slick-thumbnails">
<div>
<a href="IMG_ORIGINALE" data-lightbox="sylius-product-image">
<img data-lazy="IMG_LARGE_THUMBNAIL">
</a>
</div>
<div>
<a href="IMG_ORIGINALE" data-lightbox="sylius-product-image">
<img data-lazy="IMG_LARGE_THUMBNAIL">
</a>
</div>
</div>
<div class="product-show-images-thumbnail slick-thumbnails-dots">
<div class="slick-dot">
<img data-lazy="IMG_SMALL_THUMBNAIL">
</div>
<div class="slick-dot">
<img data-lazy="IMG_SMALL_THUMBNAIL">
</div>
</div>
</div>
Slider produits
<div class="cross-slider slick-arrow-btn">
<div class="item">
<div class="col">
<div class="product-box-container">...</div>
</div>
</div>
<div class="item">
<div class="col">
<div class="product-box-container">...</div>
</div>
</div>
</div>
<div class="cross-slider-dots"></div>