Amirmahdi/aramejan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: primary color from tailwind

Browse Source
This commit is contained in:
Amirmahdi
2025-11-07 13:27:36 +03:30
parent a6980bc35b
commit 81a10f6269
15 changed files with 340 additions and 279 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/components/WhyAramland.jsx
+17 -17
View File
@@ -5,7 +5,7 @@ function WhyAramland() {
text: "مدیتیشن و تمرین تنفسی",
description: "تمرین‌های متنوع برای هر سلیقه و نیاز",
icon: "🧘‍♀️",
gradient: "from-[#C3C7FF] to-[#A8B1FF]",
gradient: "from-primary-500 to-primary-600",
delay: "delay-100"
},
{
@@ -13,7 +13,7 @@ function WhyAramland() {
text: "ساعت محتوای صوتی فارسی",
description: "هدایت‌شده توسط متخصصان ایرانی",
icon: "🎧",
gradient: "from-[#C3C7FF] to-[#A8B1FF]",
gradient: "from-primary-500 to-primary-600",
delay: "delay-200"
},
{
@@ -21,7 +21,7 @@ function WhyAramland() {
text: "دسترسی همیشه و همه جا",
description: "در هر زمان و مکان به آرامش برسید",
icon: "🌙",
gradient: "from-[#C3C7FF] to-[#A8B1FF]",
gradient: "from-primary-500 to-primary-600",
delay: "delay-300"
},
{
@@ -29,7 +29,7 @@ function WhyAramland() {
text: "رضایت کاربران",
description: "تجربه‌ای که کاربران عاشقش هستند",
icon: "⭐",
gradient: "from-[#C3C7FF] to-[#A8B1FF]",
gradient: "from-primary-500 to-primary-600",
delay: "delay-400"
}
];
@@ -58,12 +58,12 @@ function WhyAramland() {
<div className="bg-white rounded-3xl shadow-2xl border border-gray-100 p-12 mb-12 animate-fadeInUp hover:shadow-3xl transition-all duration-500">
{/* Section Header */}
<div className="text-center mb-16">
<div className="inline-flex items-center gap-2 bg-[#C3C7FF]/10 text-[#C3C7FF] px-4 py-2 rounded-full text-sm font-medium mb-4">
<div className="inline-flex items-center gap-2 bg-primary-500/10 text-primary-500 px-4 py-2 rounded-full text-sm font-medium mb-4">
<span className="text-lg">🚀</span>
برتری آرام‌لند
</div>
<h2 className="text-4xl md:text-5xl font-bold text-gray-900 mb-4">
چرا <span className="text-[#C3C7FF]">هزاران نفر</span> آرام‌لند را انتخاب می‌کنند؟
چرا <span className="text-primary-500">هزاران نفر</span> آرام‌لند را انتخاب می‌کنند؟
</h2>
<p className="text-xl text-gray-600 max-w-2xl mx-auto">
تجربه‌ای متفاوت از آرامش، طراحی شده مخصوص فارسی‌زبانان
@@ -83,7 +83,7 @@ function WhyAramland() {
</div>
{/* Number */}
<div className="text-4xl font-bold bg-gradient-to-r from-[#C3C7FF] to-[#A8B1FF] bg-clip-text text-transparent mb-2">
<div className="text-4xl font-bold bg-gradient-to-r from-primary-500 to-primary-600 bg-clip-text text-transparent mb-2">
{stat.number}
</div>
@@ -100,9 +100,9 @@ function WhyAramland() {
{/* Divider */}
<div className="flex items-center justify-center mb-12">
<div className="h-px bg-gradient-to-r from-transparent via-[#C3C7FF] to-transparent w-32"></div>
<div className="mx-4 text-[#C3C7FF] text-lg">✨</div>
<div className="h-px bg-gradient-to-r from-transparent via-[#C3C7FF] to-transparent w-32"></div>
<div className="h-px bg-gradient-to-r from-transparent via-primary-500 to-transparent w-32"></div>
<div className="mx-4 text-primary-500 text-lg">✨</div>
<div className="h-px bg-gradient-to-r from-transparent via-primary-500 to-transparent w-32"></div>
</div>
{/* Features Grid */}
@@ -112,7 +112,7 @@ function WhyAramland() {
key={index}
className="text-center group hover:transform hover:translate-y-[-8px] transition-all duration-300"
>
<div className="bg-[#C3C7FF]/10 w-16 h-16 rounded-2xl flex items-center justify-center mx-auto mb-4 group-hover:bg-[#C3C7FF]/20 transition-colors duration-300">
<div className="bg-primary-500/10 w-16 h-16 rounded-2xl flex items-center justify-center mx-auto mb-4 group-hover:bg-primary-500/20 transition-colors duration-300">
<span className="text-2xl">{feature.icon}</span>
</div>
<h3 className="text-lg font-bold text-gray-900 mb-3">{feature.title}</h3>
@@ -125,7 +125,7 @@ function WhyAramland() {
</div>
{/* Social Proof Section */}
<div className="bg-gradient-to-r from-[#C3C7FF]/5 to-[#A8B1FF]/5 rounded-3xl p-8 border border-[#C3C7FF]/20">
<div className="bg-gradient-to-r from-primary-500/5 to-primary-600/5 rounded-3xl p-8 border border-primary-500/20">
<div className="flex flex-col md:flex-row items-center justify-between gap-6">
<div className="flex-1">
<h4 className="text-2xl font-bold text-gray-900 mb-3">
@@ -140,7 +140,7 @@ function WhyAramland() {
{[1, 2, 3, 4].map((item) => (
<div
key={item}
className="w-12 h-12 bg-gradient-to-r from-[#C3C7FF] to-[#A8B1FF] rounded-full border-2 border-white flex items-center justify-center text-white font-bold text-sm"
className="w-12 h-12 bg-gradient-to-r from-primary-500 to-primary-600 rounded-full border-2 border-white flex items-center justify-center text-white font-bold text-sm"
>
{item}
</div>
@@ -156,15 +156,15 @@ function WhyAramland() {
{/* Bottom CTA */}
<div className="text-center mt-8">
<button className="bg-gradient-to-r from-[#C3C7FF] to-[#A8B1FF] text-white font-bold py-4 px-8 rounded-2xl hover:shadow-2xl transition-all duration-300 transform hover:scale-105 shadow-lg inline-flex items-center gap-2">
{/* <button className="bg-gradient-to-r from-primary-500 to-primary-600 text-white font-bold py-4 px-8 rounded-2xl hover:shadow-2xl transition-all duration-300 transform hover:scale-105 shadow-lg inline-flex items-center gap-2">
<span>شروع سفر آرامش</span>
<svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 7l5 5m0 0l-5 5m5-5H6" />
</svg>
</button>
<p className="text-gray-500 text-sm mt-4">
</button> */}
{/* <p className="text-gray-500 text-sm mt-4">
هیچ کارت اعتباری نیاز نیست • تضمین بازگشت وجه ۷ روزه
</p>
</p> */}
</div>
</div>
);