78 lines
2.7 KiB
JavaScript
78 lines
2.7 KiB
JavaScript
"use client";
|
|
import { testimonials2 } from "@/data/testimonials";
|
|
import React from "react";
|
|
import { Swiper, SwiperSlide } from "swiper/react";
|
|
import Image from "next/image";
|
|
import { Pagination } from "swiper/modules";
|
|
export default function Testimonials() {
|
|
return (
|
|
<div className="section-testimonial style-6">
|
|
<div className="tf-container-2">
|
|
<div className="heading-section gap_12 text-center mb_58">
|
|
<div className="heading-tag d-flex gap_12 mx-auto mb_20 text_mono-dark-8 fw-5">
|
|
<div className="icon">
|
|
<i className="icon-star" />
|
|
</div>
|
|
<p className="text-body-3">Testimonials</p>
|
|
</div>
|
|
<h2 className="title text_mono-dark-9 fw-5 split-text effect-right">
|
|
Voices of our <span className="text-gradient">partners</span> in
|
|
growth
|
|
</h2>
|
|
</div>
|
|
<div className="section-testimonial style-3">
|
|
<div className="wrapper">
|
|
<Swiper
|
|
className="swiper sw-layout"
|
|
spaceBetween={15}
|
|
breakpoints={{
|
|
768: {
|
|
spaceBetween: 20,
|
|
},
|
|
992: {
|
|
spaceBetween: 24,
|
|
},
|
|
}}
|
|
modules={[Pagination]}
|
|
pagination={{
|
|
clickable: true,
|
|
el: ".spd11",
|
|
}}
|
|
>
|
|
{testimonials2.map((testimonial) => (
|
|
<SwiperSlide
|
|
className="swiper-slide"
|
|
key={`testimonial-${testimonial.id}`}
|
|
>
|
|
<div className="testimonial style-2">
|
|
<div className="logo">
|
|
<Image
|
|
alt="logo"
|
|
src={testimonial.logo}
|
|
width={testimonial.logoWidth}
|
|
height={testimonial.logoHeight}
|
|
/>
|
|
</div>
|
|
<h5 className="text text_white fw-6">
|
|
{testimonial.quote}
|
|
</h5>
|
|
<div className="author">
|
|
<h6 className="name fw-5 text_white mb_2">
|
|
{testimonial.name}
|
|
</h6>
|
|
<p className="text-body-2 text_mono-gray-5">
|
|
{testimonial.position}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</SwiperSlide>
|
|
))}
|
|
<div className="sw-dots style-default sw-pagination-layout style-1 mt_24 justify-content-center d-flex spd11" />
|
|
</Swiper>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|