@if (isset($extraits) && count($extraits) > 0)
<!-- Begin Slider -->
<div class="py-24">
    <div class="slider md:-mx-5 quote-message">
        @foreach($extraits as $extrait)
        <div class="text-center px-5 md:px-64 mb-16">
            <h2 class="font-extrabold text-4xl font-HeptaSlab mb-6">Extraits de la collection</h2>
            <div class="text-sm mb-8">
                {!! $extrait->content !!}
            </div>
            <div class="short-line"></div>
            <span class="text-sm font-bold text-light-purple mb-10">{{ $extrait->author }}</span>
        </div>
        @endforeach
    </div>
</div>
<!-- End Slider -->
@endif

@section('js')
    @parent
    <script>
        $("#collection-story .slider").slick({
            infinite: false,
            slidesToShow: 1,
            dots: true,
            arrows: false,
        });
    </script>
@endsection