46 lines
2.0 KiB
JavaScript
46 lines
2.0 KiB
JavaScript
import { card1, card2, card3 } from "../asset";
|
|
|
|
export default function FeatureCards() {
|
|
const features = [
|
|
{
|
|
icon: card1,
|
|
title: "Kemudahan Pengelolaan Dokumen",
|
|
description:
|
|
"Dengan fitur pengelolaan dokumen yang mudah dan cepat, anda dapat dengan mudah mengelola semua dokumen anda saat dan berikutnya.",
|
|
},
|
|
{
|
|
icon: card3,
|
|
title: "Efisiensi dalam Sehari-Hari",
|
|
description:
|
|
"Dengan fitur pencarian yang canggih, anda dapat dengan cepat menemukan pengaturan upload, penghapus, dan semua kebutuhan praktis, sehingga anda bisa fokus pada hal yang penting.",
|
|
},
|
|
{
|
|
icon: card2,
|
|
title: "Teknologi yang Mudah Diakses",
|
|
description:
|
|
"Seluruh fitur di dalam aplikasi kami dirancang dengan teknologi yang aman, yang dapat memberikan manfaat keseluruhan kepada semua pengguna layanan kami.",
|
|
},
|
|
];
|
|
|
|
return (
|
|
<div className="container mx-auto px-4 py-16 md:mt-[-185px] text-center mb-[-70px]">
|
|
<h2 className="text-[#212121] text-[32px] font-semibold mb-[91px] mt-[81px]">
|
|
Dengan <span className="text-[#CA2B68]">#Rekan AI</span>, Anda bisa menghemat waktu, meningkatkan produktivitas, dan mendapatkan solusi yang benar-benar relevan dengan kebutuhan Anda.
|
|
</h2>
|
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-[50px]">
|
|
{features.map((feature, index) => (
|
|
<div
|
|
key={index}
|
|
className="px-6 py-12 bg-white rounded-[10px] border shadow-lg transition-shadow duration-300 flex flex-col items-center text-center"
|
|
>
|
|
<div className="mb-4 relative w-16 h-16">
|
|
<img src={feature.icon} alt={feature.title} className="object-contain" />
|
|
</div>
|
|
<h3 className="text-[16px] font-semibold mb-3 text-[#212121]">{feature.title}</h3>
|
|
<p className="text-[#212121] text-[14px] leading-relaxed">{feature.description}</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
);
|
|
} |