68 lines
2.4 KiB
TypeScript
68 lines
2.4 KiB
TypeScript
import { PageContainer } from "@/components/shared/PageContainer";
|
|
import { SectionContainer } from "@/components/shared/SectionContainer";
|
|
import { SectionHeading } from "@/components/shared/SectionHeading";
|
|
import { IconBox } from "@/components/shared/IconBox";
|
|
|
|
export function ServiceFeaturesSection() {
|
|
const features = [
|
|
{
|
|
title: "AI Technology",
|
|
desc: "Emphasize the expertise and knowledge of your team in developing and implementing neural networks.",
|
|
},
|
|
{
|
|
title: "Tailored solutions",
|
|
desc: "Mention your ability to create customized neural network solutions that specifically address your clients.",
|
|
},
|
|
{
|
|
title: "Cutting-edge technology",
|
|
desc: "Highlight that you use the latest and most advanced neural network frameworks and technologies.",
|
|
},
|
|
{
|
|
title: "AI consultancy & strategy",
|
|
desc: "Emphasize the expertise and knowledge of your team in developing and implementing neural networks.",
|
|
},
|
|
{
|
|
title: "Computer vision",
|
|
desc: "Mention your ability to create customized neural network solutions that specifically address your clients.",
|
|
},
|
|
{
|
|
title: "Deployment & Integration",
|
|
desc: "Highlight that you use the latest and most advanced neural network frameworks and technologies.",
|
|
},
|
|
];
|
|
|
|
const DefaultIcon = () => (
|
|
<div className="flex h-full w-full items-center justify-center rounded-[18px] bg-aiero-card-purple">
|
|
<svg width="32" height="32" viewBox="0 0 24 24" fill="none" className="text-white">
|
|
<path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/>
|
|
</svg>
|
|
</div>
|
|
);
|
|
|
|
return (
|
|
<SectionContainer paddingY="lg">
|
|
<PageContainer>
|
|
<div className="mb-16">
|
|
<SectionHeading
|
|
tag="features"
|
|
title="The unique selling points & advantages of our service"
|
|
titleClassName="text-white max-w-[700px]"
|
|
/>
|
|
</div>
|
|
|
|
<div className="grid grid-cols-1 gap-x-12 gap-y-12 md:grid-cols-2 lg:grid-cols-3">
|
|
{features.map((feat, i) => (
|
|
<IconBox
|
|
key={i}
|
|
icon={<DefaultIcon />}
|
|
title={feat.title}
|
|
description={feat.desc}
|
|
hasBorder={i < 3} // The original has a border for the first row
|
|
/>
|
|
))}
|
|
</div>
|
|
</PageContainer>
|
|
</SectionContainer>
|
|
);
|
|
}
|