forked from UKSOURCE/hailearning.edu.vn
75 lines
3.5 KiB
TypeScript
75 lines
3.5 KiB
TypeScript
interface TestimonialsProps {
|
|
data: {
|
|
heading: string;
|
|
subheading: string;
|
|
videoUrl: string;
|
|
videoThumbnail: string;
|
|
items: {
|
|
name: string;
|
|
role: string;
|
|
country: string;
|
|
rating: number;
|
|
comment: string;
|
|
avatar: string;
|
|
}[];
|
|
};
|
|
}
|
|
|
|
const Testimonials = ({ data }: TestimonialsProps) => {
|
|
return (
|
|
<section className="testimonial-section section-padding pb-0 fix">
|
|
<div className="container">
|
|
<div className="section-title text-center">
|
|
<span className="sub-title wow fadeInUp">{data.subheading}</span>
|
|
<h2 className="split-text-right split-text-in-right">
|
|
{data.heading}
|
|
</h2>
|
|
</div>
|
|
<div className="testimonial-wrapper">
|
|
<div className="row g-4">
|
|
<div className="col-lg-4">
|
|
<div className="testimonia-image tp-clip-anim p-relative">
|
|
<img src={data.videoThumbnail} alt="img" className="tp-anim-img" data-animate="true" />
|
|
<a href={data.videoUrl} className="video-btn video-popup">
|
|
<i className="fa-solid fa-play"></i></a>
|
|
<h5>Real stories</h5>
|
|
</div>
|
|
</div>
|
|
<div className="col-lg-8">
|
|
<div className="swiper testimonial-slider">
|
|
<div className="swiper-wrapper">
|
|
{data.items.map((testimonial, index) => (
|
|
<div key={index} className="swiper-slide">
|
|
<div className="testimonial-box">
|
|
<div className="star">
|
|
{Array.from({ length: testimonial.rating }).map((_, i) => (
|
|
<i key={i} className="fa-solid fa-star"></i>
|
|
))}
|
|
</div>
|
|
<p>
|
|
{testimonial.comment}
|
|
</p>
|
|
<div className="info-item">
|
|
<div className="client-image">
|
|
<img src={testimonial.avatar} alt="img" />
|
|
</div>
|
|
<div className="content">
|
|
<h5>{testimonial.name}</h5>
|
|
<span>{testimonial.country}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export default Testimonials;
|