function SampleNextArrow(props) { const { onClick } = props; return ( <button type="button" onClick={onClick} className="slick-arrow slick-next"> <i className="far fa-angle-right"></i> </button> ); } function SamplePrevArrow(props) { const { onClick } = props; return ( <button type="button" onClick={onClick} className="slick-arrow slick-prev"> <i className="far fa-angle-left"></i> </button> ); } export const projectSliderOne = { infinite: true, dots: false, arrows: false, speed: 500, slidesToShow: 5, slidesToScroll: 1, autoplay: true, autoplaySpeed: 5000, responsive: [ { breakpoint: 1800, settings: { slidesToShow: 4, }, }, { breakpoint: 1200, settings: { slidesToShow: 3, }, }, { breakpoint: 992, settings: { slidesToShow: 2, }, }, { breakpoint: 650, settings: { slidesToShow: 1, }, }, ], }; export const projectSliderTwo = { infinite: true, dots: false, arrows: true, speed: 500, slidesToShow: 2, slidesToScroll: 1, nextArrow: <SampleNextArrow />, prevArrow: <SamplePrevArrow />, autoplay: true, autoplaySpeed: 5000, responsive: [ { breakpoint: 992, settings: { slidesToShow: 1, }, }, { breakpoint: 576, settings: { slidesToShow: 1, arrows: false, }, }, ], }; export const imageTextBlockSlider = { infinite: true, dots: false, arrows: true, nextArrow: <SampleNextArrow />, prevArrow: <SamplePrevArrow />, speed: 600, slidesToShow: 1, slidesToScroll: 1, autoplay: true, autoplaySpeed: 5000, responsive: [ { breakpoint: 576, settings: { slidesToShow: 1, arrows: false, }, }, ], }; export const teamSlider = { infinite: true, dots: false, arrows: false, speed: 500, slidesToShow: 5, slidesToScroll: 1, autoplay: true, autoplaySpeed: 5000, responsive: [ { breakpoint: 1750, settings: { slidesToShow: 4, }, }, { breakpoint: 1200, settings: { slidesToShow: 3, }, }, { breakpoint: 992, settings: { slidesToShow: 2, }, }, { breakpoint: 620, settings: { slidesToShow: 1, }, }, ], };