svrjs-nextjs-website/components/shared/Testimonials.tsx

105 lines
3.1 KiB
TypeScript

import React from "react";
import TestimonialCard from "../cards/testimonialCard";
const testimonials = [
{
name: "John Doe",
role: "CEO, Example Corp.",
avatar: "avatar1",
testimonial:
"Working with this team was a fantastic experience. They developed our website exactly to our specifications, and everything was seamless and well-integrated.",
rating: 5,
},
{
name: "Jane Smith",
role: "CEO, CleanCo",
avatar: "avatar2",
testimonial:
"We're thrilled with the website. It's simple, clean, and has significantly boosted our sales. The developers did an excellent job.",
rating: 4,
},
{
name: "Sam Green",
role: "Web Developer",
avatar: "avatar3",
testimonial:
"Collaborating with this team to build a SaaS-integrated website was a perfect experience. I look forward to working with them again.",
rating: 5,
},
{
name: "Chris Brown",
role: "Web Coder",
avatar: "avatar4",
testimonial:
"The team's understanding of our needs and their ability to provide fitting solutions was impressive. Their support and guidance were invaluable.",
rating: 4,
},
{
name: "Alex Johnson",
avatar: "avatar5",
testimonial:
"Exceptional service and outstanding results. They consistently deliver on time and within budget, making them our go-to partner for all our projects.",
rating: 5,
},
{
name: "Patricia Taylor",
role: "Web Developer",
avatar: "avatar6",
testimonial:
"It was great to work with them. I needed a design for a SaaS project, and it was delivered within 2 days.",
rating: 4,
},
{
name: "Emily Davis",
role: "UX Designer, Creative Agency",
avatar: "avatar7",
testimonial:
"Collaborating with them has been a pleasure. Their creativity and user-centric approach have significantly enhanced our product's usability.",
rating: 5,
},
{
name: "Michael Lee",
avatar: "avatar8",
testimonial:
"They have a keen understanding of our business needs and consistently deliver top-notch solutions. Their reliability and efficiency are commendable.",
rating: 5,
},
{
name: "Sarah Wilson",
avatar: "avatar9",
testimonial:
"Their dedication to client satisfaction is evident in everything they do. We've seen remarkable improvements in our processes thanks to their expertise.",
rating: 4,
},
];
const Testimonials = () => {
return (
<section className="mx-auto flex w-full max-w-7xl flex-col pt-12 md:pt-24">
<div className="flex flex-row items-center justify-center space-x-1">
<span className="text-white/50 text-xs lg:text-base">Testimonials</span>
</div>
<h1 className="text-3xl md:text-5xl font-bold text-center">
Hear it from{" "}
<span className="bg-gradient-to-b from-green-300 to-primary text-transparent bg-clip-text">
our users
</span>
</h1>
<ul className="wrapper columns-1 gap-5 md:columns-2 lg:columns-3 py-6 mt-6">
{testimonials.map((testimonial, idx) => (
<TestimonialCard
avatar={testimonial.avatar}
name={testimonial.name}
role={testimonial.role}
testimonial={testimonial.testimonial}
rating={testimonial.rating}
key={idx}
/>
))}
</ul>
</section>
);
};
export default Testimonials;