79 lines
3.0 KiB
React
79 lines
3.0 KiB
React
function Features() {
|
||
const features = [
|
||
{
|
||
emoji: "💨",
|
||
title: "تمرین تنفسی هوشمند",
|
||
description: "یک تنفس عمیق و استرسات نابود شه. الگوریتم هوشمند برای هر لحظه.",
|
||
gradient: "from-teal-50 to-teal-100",
|
||
delay: "delay-100"
|
||
},
|
||
{
|
||
emoji: "🎛️",
|
||
title: "الگوی تنفسی انتخابی",
|
||
description: "تمرینهای تنفسی خود را طراحی کنید و تمام خاصیتها را کنترل کنید.",
|
||
gradient: "from-green-50 to-green-100",
|
||
delay: "delay-200"
|
||
},
|
||
{
|
||
emoji: "📦",
|
||
title: "صندوق دغدغهها",
|
||
description: "دغدغههایت رو در یک صندوق خیالی بگذار و ذهنت رو سبکتر کن.",
|
||
gradient: "from-blue-50 to-blue-100",
|
||
delay: "delay-300"
|
||
},
|
||
{
|
||
emoji: "🤖",
|
||
title: "مشاور هوش مصنوعی",
|
||
description: "همراه هوشمندی که همیشه کنار توست برای پاسخگویی به سوالات.",
|
||
gradient: "from-purple-50 to-purple-100",
|
||
delay: "delay-400"
|
||
},
|
||
{
|
||
emoji: "💬",
|
||
title: "چت بدون حد",
|
||
description: "هر وقت، هرقدر که بخواهی صحبت کن. با خرید اشتراک نامحدود.",
|
||
gradient: "from-pink-50 to-pink-100",
|
||
delay: "delay-100"
|
||
},
|
||
{
|
||
emoji: "🎶",
|
||
title: "موسیقی آرامبخش انحصاری",
|
||
description: "موسیقیای که مستقیم بر روی آرامشت تأثیر میگذاره.",
|
||
gradient: "from-yellow-50 to-yellow-100",
|
||
delay: "delay-200"
|
||
}
|
||
];
|
||
|
||
return (
|
||
<div className="my-20">
|
||
<h2 className="text-4xl md:text-5xl font-bold text-gray-800 text-center mb-16 animate-fadeInUp">
|
||
✨ ویژگیهای خاص آراملند
|
||
</h2>
|
||
|
||
<div className="grid md:grid-cols-2 gap-6 mb-16">
|
||
{features.map((feature, index) => (
|
||
<div
|
||
key={index}
|
||
className={`bg-gradient-to-br ${feature.gradient} rounded-2xl p-8 hover:shadow-2xl transition-all duration-300 animate-fadeInUp ${feature.delay}`}
|
||
>
|
||
<div className="flex items-center mb-4">
|
||
<span className="text-3xl ml-3">{feature.emoji}</span>
|
||
<h3 className="text-xl font-bold text-gray-800">{feature.title}</h3>
|
||
</div>
|
||
<p className="text-gray-700">{feature.description}</p>
|
||
</div>
|
||
))}
|
||
</div>
|
||
|
||
<div className="text-center bg-gradient-to-r from-teal-50 to-green-50 rounded-3xl p-12 animate-fadeInUp delay-300">
|
||
<p className="text-2xl md:text-3xl font-medium text-gray-700 leading-relaxed">
|
||
سفر به سمت آرامش از همین امروز شروع میشه.
|
||
<br />
|
||
<span className="text-teal-700 font-bold">آمادهای؟</span>
|
||
</p>
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|
||
|
||
export default Features; |