:D
This commit is contained in:
g
129
app/page.tsx
129
app/page.tsx
@@ -6,6 +6,7 @@ import { Button } from "@/components/ui/button";
|
||||
import Link from "next/link";
|
||||
import { AnimatedStatsSection } from "@/components/animated-stats-section";
|
||||
import { isDecember } from "@/lib/utils/christmas";
|
||||
import { MotionWrapper } from "@/components/ui/motion-wrapper";
|
||||
|
||||
export const dynamic = 'force-dynamic';
|
||||
|
||||
@@ -35,22 +36,20 @@ export default async function Home() {
|
||||
|
||||
return (
|
||||
<div className={`flex flex-col min-h-screen bg-black text-white ${isDec ? 'christmas-theme' : ''}`}>
|
||||
<div className={`absolute inset-0 bg-gradient-to-br pointer-events-none scale-100 ${
|
||||
isDec
|
||||
? 'from-red-500/10 via-green-500/5 to-transparent'
|
||||
: 'from-[#D53F8C]/10 via-[#D53F8C]/3 to-transparent'
|
||||
}`} />
|
||||
<div className={`absolute inset-0 bg-gradient-to-br pointer-events-none scale-100 ${isDec
|
||||
? 'from-red-500/10 via-green-500/5 to-transparent'
|
||||
: 'from-[#D53F8C]/10 via-[#D53F8C]/3 to-transparent'
|
||||
}`} />
|
||||
<HomeNavbar />
|
||||
|
||||
{/* Hero Section */}
|
||||
{/* Hero Section */}
|
||||
<section className="relative overflow-hidden">
|
||||
<div className="relative flex flex-col items-center px-4 py-20 md:py-32 mx-auto max-w-7xl">
|
||||
<div className="flex flex-col items-center text-center space-y-6 max-w-3xl">
|
||||
<div className={`inline-flex items-center px-4 py-2 rounded-full border mb-4 ${
|
||||
isDec
|
||||
? 'bg-red-500/10 border-red-500/20'
|
||||
: 'bg-[#D53F8C]/10 border-[#D53F8C]/20'
|
||||
}`}>
|
||||
<div className={`inline-flex items-center px-4 py-2 rounded-full border mb-4 ${isDec
|
||||
? 'bg-red-500/10 border-red-500/20'
|
||||
: 'bg-[#D53F8C]/10 border-[#D53F8C]/20'
|
||||
}`}>
|
||||
<Sparkles className={`h-4 w-4 mr-2 ${isDec ? 'text-red-400' : 'text-[#D53F8C]'}`} />
|
||||
<span className={`text-sm font-medium ${isDec ? 'text-red-400' : 'text-[#D53F8C]'}`}>
|
||||
Secure Crypto Payments
|
||||
@@ -60,20 +59,19 @@ export default async function Home() {
|
||||
The Future of <span className={isDec ? 'text-red-400' : 'text-[#D53F8C]'}>E-commerce</span> Management
|
||||
</h1>
|
||||
<p className="text-lg md:text-xl text-zinc-400 max-w-2xl">
|
||||
{isDec
|
||||
{isDec
|
||||
? 'Spread joy this holiday season with our all-in-one platform. Secure payments, order tracking, and analytics wrapped up in one beautiful package. 🎄'
|
||||
: 'Streamline your online business with our all-in-one platform. Secure payments, order tracking, and analytics in one place.'
|
||||
}
|
||||
</p>
|
||||
<div className="flex flex-col sm:flex-row gap-4 mt-4">
|
||||
<Link href="/dashboard">
|
||||
<Button
|
||||
size="lg"
|
||||
className={`gap-2 text-white border-0 h-12 px-8 ${
|
||||
isDec
|
||||
? 'bg-gradient-to-r from-red-500 to-green-500 hover:from-red-600 hover:to-green-600'
|
||||
: 'bg-[#D53F8C] hover:bg-[#B83280]'
|
||||
}`}
|
||||
<Button
|
||||
size="lg"
|
||||
className={`gap-2 text-white border-0 h-12 px-8 ${isDec
|
||||
? 'bg-gradient-to-r from-red-500 to-green-500 hover:from-red-600 hover:to-green-600'
|
||||
: 'bg-[#D53F8C] hover:bg-[#B83280]'
|
||||
}`}
|
||||
>
|
||||
Get Started
|
||||
<ArrowRight className="h-4 w-4" />
|
||||
@@ -87,56 +85,55 @@ export default async function Home() {
|
||||
{/* Features Grid */}
|
||||
<section className="relative py-20 px-4">
|
||||
<div className="max-w-7xl mx-auto space-y-20">
|
||||
<div className="grid md:grid-cols-3 gap-6">
|
||||
{[
|
||||
{
|
||||
icon: Shield,
|
||||
title: "Secure Payments",
|
||||
description: "Built-in cryptocurrency support with maximum privacy and security for your transactions."
|
||||
},
|
||||
{
|
||||
icon: LineChart,
|
||||
title: "Real-time Analytics",
|
||||
description: "Track your business performance with detailed insights and reporting tools."
|
||||
},
|
||||
{
|
||||
icon: Zap,
|
||||
title: "Lightning Fast",
|
||||
description: "Optimized for speed with real-time updates and instant notifications."
|
||||
}
|
||||
].map((feature, i) => {
|
||||
const christmasColors = ['from-red-500/5', 'from-green-500/5', 'from-yellow-500/5'];
|
||||
const christmasBorders = ['border-red-500/30', 'border-green-500/30', 'border-yellow-500/30'];
|
||||
const christmasIcons = ['text-red-400', 'text-green-400', 'text-yellow-400'];
|
||||
const christmasBgs = ['bg-red-500/10', 'bg-green-500/10', 'bg-yellow-500/10'];
|
||||
|
||||
return (
|
||||
<div
|
||||
key={i}
|
||||
className={`group relative overflow-hidden rounded-xl bg-gradient-to-b p-6 border ${
|
||||
isDec
|
||||
? `from-zinc-800/30 to-transparent ${christmasBorders[i % 3]}`
|
||||
<MotionWrapper>
|
||||
<div className="grid md:grid-cols-3 gap-6">
|
||||
{[
|
||||
{
|
||||
icon: Shield,
|
||||
title: "Secure Payments",
|
||||
description: "Built-in cryptocurrency support with maximum privacy and security for your transactions."
|
||||
},
|
||||
{
|
||||
icon: LineChart,
|
||||
title: "Real-time Analytics",
|
||||
description: "Track your business performance with detailed insights and reporting tools."
|
||||
},
|
||||
{
|
||||
icon: Zap,
|
||||
title: "Lightning Fast",
|
||||
description: "Optimized for speed with real-time updates and instant notifications."
|
||||
}
|
||||
].map((feature, i) => {
|
||||
const christmasColors = ['from-red-500/5', 'from-green-500/5', 'from-yellow-500/5'];
|
||||
const christmasBorders = ['border-red-500/30', 'border-green-500/30', 'border-yellow-500/30'];
|
||||
const christmasIcons = ['text-red-400', 'text-green-400', 'text-yellow-400'];
|
||||
const christmasBgs = ['bg-red-500/10', 'bg-green-500/10', 'bg-yellow-500/10'];
|
||||
|
||||
return (
|
||||
<div
|
||||
key={i}
|
||||
className={`group relative overflow-hidden rounded-xl bg-gradient-to-b p-6 border transition-all duration-300 hover:scale-[1.02] hover:shadow-lg ${isDec
|
||||
? `from-zinc-800/30 to-transparent ${christmasBorders[i % 3]}`
|
||||
: 'from-zinc-800/30 to-transparent border-zinc-800'
|
||||
}`}
|
||||
>
|
||||
<div
|
||||
className={`absolute inset-0 bg-gradient-to-b to-transparent opacity-0 group-hover:opacity-100 transition-opacity ${
|
||||
isDec ? christmasColors[i % 3] : 'from-[#D53F8C]/5'
|
||||
}`}
|
||||
/>
|
||||
<div className="relative">
|
||||
<div className={`h-12 w-12 flex items-center justify-center rounded-lg mb-4 ${
|
||||
isDec ? christmasBgs[i % 3] : 'bg-[#D53F8C]/10'
|
||||
}`}>
|
||||
<feature.icon className={`h-6 w-6 ${isDec ? christmasIcons[i % 3] : 'text-[#D53F8C]'}`} />
|
||||
}`}
|
||||
>
|
||||
<div
|
||||
className={`absolute inset-0 bg-gradient-to-b to-transparent opacity-0 group-hover:opacity-100 transition-opacity ${isDec ? christmasColors[i % 3] : 'from-[#D53F8C]/5'
|
||||
}`}
|
||||
/>
|
||||
<div className="relative">
|
||||
<div className={`h-12 w-12 flex items-center justify-center rounded-lg mb-4 ${isDec ? christmasBgs[i % 3] : 'bg-[#D53F8C]/10'
|
||||
}`}>
|
||||
<feature.icon className={`h-6 w-6 ${isDec ? christmasIcons[i % 3] : 'text-[#D53F8C]'}`} />
|
||||
</div>
|
||||
<h3 className="text-lg font-semibold text-white mb-2">{feature.title}</h3>
|
||||
<p className="text-sm text-zinc-400">{feature.description}</p>
|
||||
</div>
|
||||
<h3 className="text-lg font-semibold text-white mb-2">{feature.title}</h3>
|
||||
<p className="text-sm text-zinc-400">{feature.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</MotionWrapper>
|
||||
|
||||
{/* Stats Section */}
|
||||
<div className="relative">
|
||||
|
||||
Reference in New Issue
Block a user