irongit
93 lines3.1 KBJavaScript
1import Slider from "react-slick"
2const settings = {
3 dots: false,
4 infinite: true,
5 speed: 1000,
6 autoplay: true,
7 arrows: false,
8 slidesToShow: 4,
9 slidesToScroll: 1,
10 responsive: [
11 {
12 breakpoint: 1400,
13 settings: {
14 slidesToShow: 3,
15 slidesToScroll: 1,
16 infinite: true,
17 }
18 },
19 {
20 breakpoint: 1200,
21 settings: {
22 slidesToShow: 3,
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: 3,
38 slidesToScroll: 1,
39 arrows: false,
40 }
41 },
42 {
43 breakpoint: 575,
44 settings: {
45 slidesToShow: 2,
46 slidesToScroll: 1,
47 arrows: false,
48 }
49 },
50 ]
51}
52export default function Brand2() {
53 return (
54 <>
55 <div className="brand-area-two">
56 <div className="container">
57 <div className="row justify-content-end">
58 <div className="col-lg-6">
59 <h6 className="brand-title">Trusted by big brands</h6>
60 <Slider {...settings} className="row brand-active-two">
61 <div className="col-12">
62 <div className="brand-item">
63 <img src="/assets/img/brand/h2_brand_img01.png" alt="" />
64 </div>
65 </div>
66 <div className="col-12">
67 <div className="brand-item">
68 <img src="/assets/img/brand/h2_brand_img02.png" alt="" />
69 </div>
70 </div>
71 <div className="col-12">
72 <div className="brand-item">
73 <img src="/assets/img/brand/h2_brand_img03.png" alt="" />
74 </div>
75 </div>
76 <div className="col-12">
77 <div className="brand-item">
78 <img src="/assets/img/brand/h2_brand_img02.png" alt="" />
79 </div>
80 </div>
81 <div className="col-12">
82 <div className="brand-item">
83 <img src="/assets/img/brand/h2_brand_img03.png" alt="" />
84 </div>
85 </div>
86 </Slider>
87 </div>
88 </div>
89 </div>
90 </div>
91 </>
92 )
93}