Skip to content

Commit a43c09b

Browse files
Abraham123-devAbraham123-dev
authored
Merge pull request #122 from Axile-Event/Abraham
did the referral
2 parents 9fe6675 + b1a4332 commit a43c09b

8 files changed

Lines changed: 663 additions & 103 deletions

File tree

‎package-lock.json‎

Lines changed: 144 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
"lint": "eslint"
1010
},
1111
"dependencies": {
12+
"@radix-ui/react-accordion": "^1.2.12",
1213
"@radix-ui/react-dropdown-menu": "^2.1.16",
1314
"@radix-ui/react-label": "^2.1.8",
1415
"@radix-ui/react-select": "^2.2.6",

‎src/app/page.jsx‎

Lines changed: 35 additions & 75 deletions
Original file line numberDiff line numberDiff line change
@@ -110,21 +110,21 @@ const LandingPage = () => {
110110
};
111111

112112
return (
113-
<div className="min-h-screen bg-background text-foreground selection:bg-primary/30 overflow-x-hidden">
114-
<section className="relative pt-20 pb-32 lg:pt-32 lg:pb-40 overflow-hidden">
113+
<div className="min-h-screen bg-background text-foreground selection:bg-primary/20 overflow-x-hidden">
114+
<section className="relative pt-28 pb-40 lg:pt-48 lg:pb-56 overflow-hidden">
115115
{/* Animated Background */}
116116
<div className="absolute inset-0 pointer-events-none">
117117
<motion.div
118118
animate={{
119-
scale: [1, 1.1, 1],
119+
scale: [1, 1.08, 1],
120120
opacity: [0.3, 0.5, 0.3],
121121
}}
122122
transition={{ duration: 8, repeat: Infinity }}
123123
className="absolute top-0 left-1/4 w-[500px] h-[500px] bg-primary/10 rounded-full blur-[120px]"
124124
/>
125125
<motion.div
126126
animate={{
127-
scale: [1, 1.2, 1],
127+
scale: [1, 1.15, 1],
128128
opacity: [0.2, 0.4, 0.2],
129129
}}
130130
transition={{ duration: 10, repeat: Infinity }}
@@ -152,7 +152,7 @@ const LandingPage = () => {
152152
{/* Main Headline */}
153153
<motion.h1
154154
variants={fadeInScale}
155-
className="text-5xl sm:text-6xl md:text-7xl lg:text-8xl font-black tracking-tight leading-[1.1]"
155+
className="text-6xl sm:text-7xl md:text-8xl lg:text-9xl font-black tracking-tighter leading-[1.0] mb-6"
156156
>
157157
Experience Events
158158
<br />
@@ -169,21 +169,21 @@ const LandingPage = () => {
169169
{/* Subheadline */}
170170
<motion.p
171171
variants={fadeInScale}
172-
className="text-lg md:text-2xl text-muted-foreground max-w-3xl mx-auto leading-relaxed"
172+
className="text-xl md:text-2xl text-muted-foreground max-w-3xl mx-auto leading-relaxed mb-2"
173173
>
174-
The all-in-one platform connecting <span className="text-foreground font-semibold">attendees</span> to unforgettable events and empowering <span className="text-foreground font-semibold">organizers</span> to sell out shows.
174+
Connect attendees to unforgettable events. Empower organizers to sell out. All-in-one platform for the culture.
175175
</motion.p>
176176

177177
{/* CTA Buttons */}
178-
<motion.div variants={fadeInScale} className="flex flex-col sm:flex-row items-center justify-center gap-4 pt-4">
178+
<motion.div variants={fadeInScale} className="flex flex-col sm:flex-row items-center justify-center gap-4 pt-6">
179179
<Link href="/events">
180-
<Button size="lg" className="h-14 px-10 text-lg bg-primary hover:bg-primary/90 shadow-lg shadow-primary/30 hover:shadow-primary/50 transition-all rounded-2xl">
180+
<Button size="lg" className="h-16 px-12 text-lg bg-primary hover:bg-primary/90 shadow-xl shadow-primary/40 hover:shadow-primary/60 transition-all rounded-2xl font-bold">
181181
Explore Events
182182
<ArrowRight className="ml-2 h-5 w-5" />
183183
</Button>
184184
</Link>
185185
<Link href="/signup?tab=organizer">
186-
<Button size="lg" variant="outline" className="h-14 px-10 text-lg border-border hover:bg-muted group rounded-2xl">
186+
<Button size="lg" variant="outline" className="h-16 px-12 text-lg border-border hover:bg-muted hover:border-primary/50 group rounded-2xl font-bold transition-all">
187187
Start Selling Tickets
188188
<TrendingUp className="ml-2 h-5 w-5 group-hover:translate-x-1 transition-transform" />
189189
</Button>
@@ -210,14 +210,14 @@ const LandingPage = () => {
210210
</section>
211211

212212
{/* Stats Section */}
213-
<section className="py-16 border-y border-border bg-muted/30">
213+
<section className="py-20 border-b border-border/50">
214214
<div className="container mx-auto px-4">
215215
<motion.div
216216
variants={staggerContainer}
217217
initial="hidden"
218218
whileInView="visible"
219219
viewport={{ once: true }}
220-
className="grid grid-cols-2 md:grid-cols-3 gap-8 max-w-5xl mx-auto"
220+
className="grid grid-cols-2 md:grid-cols-3 gap-6 md:gap-8 max-w-6xl mx-auto"
221221
>
222222
<StatCard icon={<Calendar className="h-6 w-6" />} value={loadingStats ? "…" : stats.events} label="Events Hosted" />
223223
<StatCard icon={<Users className="h-6 w-6" />} value={loadingStats ? "…" : stats.tickets} label="Tickets Sold" />
@@ -530,26 +530,19 @@ const StatCard = ({ icon, value, label }) => (
530530
hidden: { opacity: 0, y: 20 },
531531
visible: { opacity: 1, y: 0, transition: { duration: 0.6 } }
532532
}}
533-
className="text-center space-y-2 p-6 rounded-3xl bg-secondary/20 border border-border/50 hover:border-primary/30 transition-colors group relative overflow-hidden"
533+
whileHover={{ y: -4, transition: { duration: 0.3 } }}
534+
className="text-center space-y-4 p-10 rounded-2xl bg-card border border-border/40 hover:border-primary/30 transition-all duration-300 hover:shadow-md group"
534535
>
535-
{/* Subtle African Elevation Lines */}
536-
<div className="absolute inset-0 pointer-events-none opacity-[0.03] group-hover:opacity-[0.06] transition-opacity duration-500">
537-
<svg className="w-full h-full" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid slice">
538-
<circle cx="50" cy="50" r="40" fill="none" stroke="currentColor" strokeWidth="0.8" className="text-amber-600"/>
539-
<circle cx="50" cy="50" r="30" fill="none" stroke="currentColor" strokeWidth="0.6" className="text-amber-600"/>
540-
<circle cx="50" cy="50" r="20" fill="none" stroke="currentColor" strokeWidth="0.5" className="text-amber-500"/>
541-
<circle cx="50" cy="50" r="10" fill="none" stroke="currentColor" strokeWidth="0.4" className="text-amber-500"/>
542-
</svg>
543-
</div>
544-
545-
<div className="relative z-10 flex items-center justify-center text-primary mb-2 group-hover:scale-110 transition-transform">
536+
<div className="flex items-center justify-center text-primary group-hover:scale-110 transition-transform duration-300">
546537
{icon}
547538
</div>
548-
<div className="relative z-10 text-4xl md:text-5xl font-black text-foreground">
549-
{value} <span className="text-md">+</span>
550-
</div>
551-
<div className="relative z-10 text-xs text-muted-foreground font-black uppercase tracking-widest opacity-60">
552-
{label}
539+
<div>
540+
<div className="text-5xl md:text-6xl font-black text-foreground tracking-tighter">
541+
{value}
542+
</div>
543+
<div className="text-xs text-muted-foreground font-semibold uppercase tracking-widest mt-3 opacity-70">
544+
{label}
545+
</div>
553546
</div>
554547
</motion.div>
555548
);
@@ -560,29 +553,14 @@ const FeatureCard = ({ icon, title, description, color }) => (
560553
hidden: { opacity: 0, y: 30, scale: 0.95 },
561554
visible: { opacity: 1, y: 0, scale: 1, transition: { duration: 0.6 } }
562555
}}
563-
whileHover={{ y: -12, transition: { duration: 0.3 } }}
564-
className="p-10 rounded-[2.5rem] bg-card border border-border hover:border-primary/30 transition-all duration-500 hover:shadow-[0_20px_50px_rgba(225,29,72,0.08)] group relative overflow-hidden"
556+
whileHover={{ y: -8, transition: { duration: 0.3 } }}
557+
className="p-10 rounded-2xl bg-card border border-border/40 hover:border-primary/30 transition-all duration-300 hover:shadow-md group"
565558
>
566-
{/* African Topographic Contour Lines */}
567-
<div className="absolute inset-0 pointer-events-none opacity-[0.04] group-hover:opacity-[0.08] transition-opacity duration-700">
568-
<svg className="w-full h-full" viewBox="0 0 200 200" preserveAspectRatio="xMidYMid slice">
569-
<path d="M-20,100 Q30,40 100,60 Q170,80 220,30" fill="none" stroke="currentColor" strokeWidth="1" className="text-amber-600"/>
570-
<path d="M-20,120 Q40,60 100,80 Q160,100 220,50" fill="none" stroke="currentColor" strokeWidth="1" className="text-amber-600"/>
571-
<path d="M-20,140 Q50,80 100,100 Q150,120 220,70" fill="none" stroke="currentColor" strokeWidth="1" className="text-amber-600"/>
572-
<path d="M-20,160 Q60,100 100,120 Q140,140 220,90" fill="none" stroke="currentColor" strokeWidth="1" className="text-amber-600"/>
573-
<path d="M-20,180 Q70,120 100,140 Q130,160 220,110" fill="none" stroke="currentColor" strokeWidth="0.8" className="text-amber-500"/>
574-
<path d="M-20,200 Q80,140 100,160 Q120,180 220,130" fill="none" stroke="currentColor" strokeWidth="0.8" className="text-amber-500"/>
575-
<circle cx="160" cy="40" r="25" fill="none" stroke="currentColor" strokeWidth="0.6" className="text-amber-600"/>
576-
<circle cx="160" cy="40" r="18" fill="none" stroke="currentColor" strokeWidth="0.6" className="text-amber-600"/>
577-
<circle cx="160" cy="40" r="10" fill="none" stroke="currentColor" strokeWidth="0.6" className="text-amber-600"/>
578-
</svg>
579-
</div>
580-
581-
<div className={`relative z-10 mb-8 p-5 rounded-2xl w-fit ${color} group-hover:scale-110 transition-transform duration-500 group-hover:rotate-6 shadow-sm`}>
559+
<div className={`mb-8 p-4 rounded-xl w-fit ${color} group-hover:scale-110 transition-transform duration-300 shadow-sm`}>
582560
{icon}
583561
</div>
584-
<h3 className="relative z-10 text-2xl font-black tracking-tight mb-4 group-hover:text-primary transition-colors duration-300">{title}</h3>
585-
<p className="relative z-10 text-muted-foreground leading-relaxed text-lg opacity-80 group-hover:opacity-100 transition-opacity">
562+
<h3 className="text-2xl font-bold tracking-tight mb-3 text-foreground group-hover:text-primary transition-colors duration-300">{title}</h3>
563+
<p className="text-muted-foreground leading-relaxed opacity-85 group-hover:opacity-100 transition-opacity">
586564
{description}
587565
</p>
588566
</motion.div>
@@ -594,42 +572,24 @@ const TestimonialCard = ({ quote, author, role }) => (
594572
hidden: { opacity: 0, scale: 0.95 },
595573
visible: { opacity: 1, scale: 1, transition: { duration: 0.6 } }
596574
}}
597-
whileHover={{ scale: 1.02, transition: { duration: 0.3 } }}
598-
className="p-10 rounded-[2.5rem] bg-card border border-border hover:border-primary/20 transition-all duration-500 space-y-8 relative overflow-hidden group shadow-sm hover:shadow-xl"
575+
whileHover={{ y: -8, transition: { duration: 0.3 } }}
576+
className="p-10 rounded-2xl bg-card border border-border/40 hover:border-primary/20 transition-all duration-300 space-y-6 group shadow-sm hover:shadow-md"
599577
>
600-
{/* African River & Terrain Contour Lines */}
601-
<div className="absolute inset-0 pointer-events-none opacity-[0.03] group-hover:opacity-[0.06] transition-opacity duration-700">
602-
<svg className="w-full h-full" viewBox="0 0 200 250" preserveAspectRatio="xMidYMid slice">
603-
<path d="M0,200 Q40,180 60,190 Q100,210 140,180 Q180,150 200,160" fill="none" stroke="currentColor" strokeWidth="1.2" className="text-amber-700"/>
604-
<path d="M0,210 Q50,190 70,200 Q110,220 150,190 Q190,160 200,170" fill="none" stroke="currentColor" strokeWidth="1" className="text-amber-600"/>
605-
<path d="M0,220 Q60,200 80,210 Q120,230 160,200 Q200,170 220,180" fill="none" stroke="currentColor" strokeWidth="0.8" className="text-amber-600"/>
606-
<path d="M0,230 Q70,210 90,220 Q130,240 170,210 Q210,180 230,190" fill="none" stroke="currentColor" strokeWidth="0.6" className="text-amber-500"/>
607-
<ellipse cx="30" cy="50" rx="20" ry="30" fill="none" stroke="currentColor" strokeWidth="0.8" className="text-amber-600" transform="rotate(-15 30 50)"/>
608-
<ellipse cx="30" cy="50" rx="14" ry="22" fill="none" stroke="currentColor" strokeWidth="0.6" className="text-amber-600" transform="rotate(-15 30 50)"/>
609-
<ellipse cx="30" cy="50" rx="8" ry="14" fill="none" stroke="currentColor" strokeWidth="0.6" className="text-amber-500" transform="rotate(-15 30 50)"/>
610-
<path d="M150,0 Q160,30 155,60 Q150,90 160,120" fill="none" stroke="currentColor" strokeWidth="0.6" className="text-amber-500"/>
611-
<path d="M160,0 Q170,30 165,60 Q160,90 170,120" fill="none" stroke="currentColor" strokeWidth="0.6" className="text-amber-500"/>
612-
</svg>
613-
</div>
614-
615-
<div className="absolute top-0 right-0 p-8 opacity-5 group-hover:opacity-10 transition-opacity">
616-
<Star size={80} className="fill-primary text-primary" />
617-
</div>
618-
<div className="flex gap-1.5 relative z-10">
578+
<div className="flex gap-1.5">
619579
{[...Array(5)].map((_, i) => (
620580
<Star key={i} className="h-4 w-4 fill-primary text-primary" />
621581
))}
622582
</div>
623-
<p className="text-xl leading-relaxed text-foreground font-medium relative z-10">
583+
<p className="text-lg leading-relaxed text-foreground font-medium">
624584
"{quote}"
625585
</p>
626-
<div className="pt-6 border-t border-border flex items-center gap-4 relative z-10">
627-
<div className="h-12 w-12 rounded-full bg-primary/10 flex items-center justify-center font-black text-primary">
586+
<div className="pt-6 border-t border-border/30 flex items-center gap-3">
587+
<div className="h-10 w-10 rounded-full bg-primary/10 flex items-center justify-center font-bold text-primary text-sm">
628588
{author.charAt(0)}
629589
</div>
630590
<div>
631-
<div className="font-black text-foreground text-sm tracking-tight">{author}</div>
632-
<div className="text-[10px] text-muted-foreground font-black uppercase tracking-widest opacity-60">{role}</div>
591+
<div className="font-semibold text-foreground text-sm">{author}</div>
592+
<div className="text-xs text-muted-foreground opacity-60 uppercase tracking-wide">{role}</div>
633593
</div>
634594
</div>
635595
</motion.div>

0 commit comments

Comments
 (0)