73 lines
3.0 KiB
TypeScript
73 lines
3.0 KiB
TypeScript
"use client";
|
|
|
|
import { PageContainer } from "@/components/shared/PageContainer";
|
|
import { SectionContainer } from "@/components/shared/SectionContainer";
|
|
import { SectionHeading } from "@/components/shared/SectionHeading";
|
|
|
|
export function TestimonialsSection() {
|
|
const testimonials = [
|
|
{
|
|
text: "Working with Aiero has been a game-changer for our business. Their AI solutions have revolutionized our operations, enabling us to automate repetitive tasks and make data-driven decisions. The level of efficiency we've achieved is unprecedented.",
|
|
author: "David Smith",
|
|
role: "CEO Company",
|
|
},
|
|
{
|
|
text: "Aiero has been a game-changer for our business. Their AI solutions have revolutionized our operations, enabling us to automate repetitive tasks and make data-driven decisions. The level of efficiency we've achieved is unprecedented.",
|
|
author: "Mark Dowson",
|
|
role: "Manager",
|
|
},
|
|
];
|
|
|
|
return (
|
|
<SectionContainer paddingY="lg" className="bg-aiero-card-dark">
|
|
<PageContainer>
|
|
<div className="mb-16">
|
|
<SectionHeading
|
|
tag="testimonials"
|
|
title="Discover what our clients have to say about our AI solutions"
|
|
titleClassName="text-white max-w-[650px]"
|
|
/>
|
|
</div>
|
|
|
|
<div className="grid grid-cols-1 gap-8 md:grid-cols-2">
|
|
{testimonials.map((t, i) => (
|
|
<div
|
|
key={i}
|
|
className="flex flex-col justify-between rounded-[25px] border border-aiero-card-border bg-[#1A1A1A] p-10 lg:p-12"
|
|
>
|
|
<div className="mb-8">
|
|
<div className="mb-6 flex gap-1 text-aiero-teal">
|
|
{[...Array(5)].map((_, index) => (
|
|
<svg key={index} width="16" height="16" viewBox="0 0 24 24" fill="currentColor">
|
|
<path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/>
|
|
</svg>
|
|
))}
|
|
</div>
|
|
<p className="text-[18px] leading-[1.8] text-white">"{t.text}"</p>
|
|
</div>
|
|
<div className="flex items-center gap-4">
|
|
<div className="h-[60px] w-[60px] overflow-hidden rounded-full bg-aiero-dark">
|
|
<img
|
|
src={`/images/aiero/client-${i + 1}.jpg`}
|
|
alt={t.author}
|
|
className="h-full w-full object-cover"
|
|
onError={(e) => {
|
|
(e.target as HTMLImageElement).src = "/images/aiero/home-9-img.png";
|
|
}}
|
|
/>
|
|
</div>
|
|
<div>
|
|
<h5 className="text-[18px] font-bold text-white" style={{ fontFamily: "var(--font-dm-sans)" }}>
|
|
{t.author}
|
|
</h5>
|
|
<p className="text-[14px] text-aiero-teal">{t.role}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</PageContainer>
|
|
</SectionContainer>
|
|
);
|
|
}
|