irongit
Sign inRegister
huncholanehuncholane/slroofPublic
slroof/components/sections/Brand1.js
100 lines3.4 KBJavaScript
RawDownloadHistory
1import Slider from "react-slick"
2const settings = {
3 dots: false,
4 infinite: true,
5 speed: 1000,
6 autoplay: true,
7 arrows: false,
8 slidesToShow: 6,
9 slidesToScroll: 2,
10 responsive: [
11 {
12 breakpoint: 1400,
13 settings: {
14 slidesToShow: 5,
15 slidesToScroll: 1,
16 infinite: true,
17 }
18 },
19 {
20 breakpoint: 1200,
21 settings: {
22 slidesToShow: 4,
23 slidesToScroll: 1,
24 infinite: true,
25 }
26 },
27 {
28 breakpoint: 992,
29 settings: {
30 slidesToShow: 3,
31 slidesToScroll: 1
32 }
33 },
34 {
35 breakpoint: 767,
36 settings: {
37 slidesToShow: 2,
38 slidesToScroll: 1,
39 arrows: false,
40 }
41 },
42 {
43 breakpoint: 575,
44 settings: {
45 slidesToShow: 1,
46 slidesToScroll: 1,
47 arrows: false,
48 }
49 },
50 ]
51}
52export default function Brand1() {
53 return (
54 <>
55 <div className="brand-area">
56 <div className="container">
57 <div className="brand-inner">
58 <Slider {...settings} className="row brand-active">
59 <div className="col-12">
60 <div className="brand-item">
61 <img src="/assets/img/brand/brand_img01.png" alt="" />
62 </div>
63 </div>
64 <div className="col-12">
65 <div className="brand-item">
66 <img src="/assets/img/brand/brand_img02.png" alt="" />
67 </div>
68 </div>
69 <div className="col-12">
70 <div className="brand-item">
71 <img src="/assets/img/brand/brand_img03.png" alt="" />
72 </div>
73 </div>
74 <div className="col-12">
75 <div className="brand-item">
76 <img src="/assets/img/brand/brand_img04.png" alt="" />
77 </div>
78 </div>
79 <div className="col-12">
80 <div className="brand-item">
81 <img src="/assets/img/brand/brand_img05.png" alt="" />
82 </div>
83 </div>
84 <div className="col-12">
85 <div className="brand-item">
86 <img src="/assets/img/brand/brand_img06.png" alt="" />
87 </div>
88 </div>
89 <div className="col-12">
90 <div className="brand-item">
91 <img src="/assets/img/brand/brand_img03.png" alt="" />
92 </div>
93 </div>
94 </Slider>
95 </div>
96 </div>
97 </div>
98 </>
99 )
100}