1import Box from '@material-ui/core/Box';
 2import CustomArrow from './CustomArrow';
 3
 4const sliderSettings = {
 5  accessibility: true,
 6  dots: true,
 7  appendDots: dots => (
 8    <Box
 9      top={0}
10      left={0}
11      p={1}
12      height={36}
13      component="ul"
14      overflow="auto"
15      display="flex"
16    >
17      <Box display="flex" margin="0 auto">
18        {dots}
19      </Box>
20    </Box>
21  ),
22  nextArrow: <CustomArrow right={16} />,
23  prevArrow: <CustomArrow left={16} />,
24  arrows: true,
25  infinite: false,
26  speed: 500,
27  initialSlide: 0,
28  lazyLoad: true,
29  draggable: true,
30  swipeToSlide: false,
31  swipe: true,
32  slidesToScroll: 5,
33  slidesToShow: 5,
34  responsive: [
35    {
36      breakpoint: 600,
37      settings: {
38        slidesToScroll: 1,
39        slidesToShow: 1,
40        arrows: false,
41      },
42    },
43    {
44      breakpoint: 960,
45      settings: {
46        slidesToScroll: 2,
47        slidesToShow: 2,
48        arrows: false,
49      },
50    },
51    {
52      breakpoint: 1280,
53      settings: {
54        slidesToScroll: 3,
55        slidesToShow: 3,
56      },
57    },
58    {
59      breakpoint: 1920,
60      settings: {
61        slidesToScroll: 4,
62        slidesToShow: 4,
63      },
64    },
65  ],
66};
67
68export default sliderSettings;