58 lines
3.5 KiB
TypeScript
58 lines
3.5 KiB
TypeScript
import React from "react";
|
|
import { testimonialSlides } from "@/utils/data";
|
|
|
|
const TestimonialsSection = () => (
|
|
<section className="testimonials-two-section fix section-space">
|
|
<div className="container-fluid g-0">
|
|
<div className="row g-0">
|
|
<div className="col-xxl-4 col-xl-4 col-lg-12">
|
|
<div className="testimonials-video-area p-relative">
|
|
<figure className="image w-img"><img src="/assets/imgs/resources/video-1.jpg" alt="" /></figure>
|
|
<div className="play-btn">
|
|
<div className="video_player_btn">
|
|
<a href="https://www.youtube.com/watch?v=eEzD-Y97ges" className="popup-video"><i className="fa-solid fa-play"></i></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className="col-xxl-8 col-xl-8 col-lg-12">
|
|
<div className="testimonials-two-area section-space-medium bg-color-1 p-relative">
|
|
<div className="shape-1" style={{ backgroundImage: "url(/assets/imgs/shapes/shape-36.png)" }}></div>
|
|
<div className="sec-title-wrapper wow fadeInLeft mb-60" data-wow-delay=".5s">
|
|
<div className="sec-title">
|
|
<div className="sec-title__shape"></div>
|
|
<h6 className="sec-title__tagline">TESTIMONIALS</h6>
|
|
<h3 className="sec-title__title">Our Client Feedback</h3>
|
|
</div>
|
|
<img src="https://bracketweb.com/pelocishtml/assets/images/shapes/text-shape-2.png" alt="" className="sec-title__text-shape" />
|
|
</div>
|
|
<div className="swiper testimonial-active-2">
|
|
<div className="swiper-wrapper">
|
|
{[1, 2, 1].map((num, i) => (
|
|
<div key={i} className="swiper-slide">
|
|
<div className="testimonials-two-box">
|
|
<div className="author-image"><img src={`/assets/imgs/resources/testimonials-${num}.png`} alt="" /></div>
|
|
<div className="icon-1"><i className="fa-solid fa-quote-right"></i></div>
|
|
<h4>Kathryn Murphy</h4>
|
|
<span>Engineering</span>
|
|
<ul className="ratings">
|
|
{[1, 2, 3, 4, 5].map((r) => <li key={r}><i className="fa-solid fa-star"></i></li>)}
|
|
</ul>
|
|
<p>“ Consectetur adipiscing elit. Integer is nunc viverra laoreet est the is porta pretium metus aliquam eget maecenas porta is nunc viverra Aenean ”</p>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
<div className="testimonial-dot-inner text-center mt-60">
|
|
<div className="testimonial-swiper-dot"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
|
|
export default TestimonialsSection;
|