shawon/JML
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add 3D scooter model and landing page layout enhancements

Browse Source
This commit is contained in:
sazzadulalambd
2026-06-22 16:51:48 +06:00
parent 87d3421606
commit eb38a01976
5 changed files with 1778497 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
src/app/page.tsx
View File

@@ -5,7 +5,6 @@ import { useRouter } from 'next/navigation';
import Image from 'next/image';
import HeroBackground3D from '@/components/ui/3d/HeroBackground3D';
import CardIcon3D from '@/components/ui/3d/CardIcon3D';
import { users } from '@/data/mockData';
import { Zap, ArrowRight, Bike, Wallet, Leaf, ShieldCheck, MapPin, Truck, ChevronRight, BarChart3, BatteryCharging, Clock, Activity } from 'lucide-react';
export default function LandingPage() {
@@ -73,7 +72,7 @@ export default function LandingPage() {
</div>
<div className="flex items-center gap-4">
<button
onClick={() => router.push('/login')}
onClick={() => router.push('/coming-soon')}
className={`px-5 py-2.5 rounded-full font-semibold transition-all flex items-center gap-2 ${scrolled
? 'bg-accent text-white hover:bg-accent-dark shadow-md hover:shadow-lg'
: 'bg-white text-accent hover:bg-slate-100 shadow-xl'
@@ -86,28 +85,30 @@ export default function LandingPage() {
</header>
{/* Hero Section */}
<section className="relative pt-32 pb-20 lg:pt-48 lg:pb-32 overflow-hidden bg-slate-900">
<section className="relative pt-32 pb-24 lg:pt-48 lg:pb-40 overflow-hidden bg-slate-900 min-h-[88vh] lg:min-h-screen flex items-center">
<div className="absolute inset-0 bg-gradient-to-br from-slate-900 via-slate-800 to-accent/20 z-0" />
<div className="absolute inset-0 bg-[url('/noise.png')] opacity-20 mix-blend-overlay z-0"></div>
<HeroBackground3D />
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10 text-center">
<div className="inline-flex items-center gap-2 px-4 py-2 bg-white/10 backdrop-blur-md border border-white/20 rounded-full text-white text-sm font-medium mb-8">
<Leaf className="w-4 h-4 text-emerald-400" /> Bangladesh&apos;s Leading EV Platform
</div>
<h1 className="text-4xl sm:text-5xl lg:text-7xl font-extrabold text-white mb-6 leading-tight tracking-tight">
Ditch Petrol. <br className="hidden sm:block" />
<span className="text-transparent bg-clip-text bg-gradient-to-r from-accent via-emerald-400 to-accent-light">Go Electric</span> with JAIBEN.
</h1>
<p className="text-slate-300 text-lg sm:text-xl max-w-2xl mx-auto mb-10">
The largest EV Tech platform enabling the Gig Economy. Rent, Rent-to-Own, or Invest in EVs. Join the sustainable mobility revolution today.
</p>
<div className="flex flex-col sm:flex-row items-center justify-center gap-4">
<button
onClick={() => router.push('/coming-soon')}
className="w-full sm:w-auto px-8 py-4 bg-accent text-white rounded-full font-bold text-lg hover:bg-accent-dark transition-all transform hover:scale-105 shadow-xl shadow-accent/30 flex items-center justify-center gap-2"
>
Get Started Now <ArrowRight className="w-5 h-5" />
</button>
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10 w-full text-center lg:text-left">
<div className="max-w-2xl lg:max-w-xl">
<div className="inline-flex items-center gap-2 px-4 py-2 bg-white/10 backdrop-blur-md border border-white/20 rounded-full text-white text-sm font-medium mb-8">
<Leaf className="w-4 h-4 text-emerald-400" /> Bangladesh&apos;s Leading EV Platform
</div>
<h1 className="text-4xl sm:text-5xl lg:text-7xl font-extrabold text-white mb-6 leading-tight tracking-tight drop-shadow-2xl">
Ditch Petrol. <br className="hidden sm:block" />
<span className="text-transparent bg-clip-text bg-gradient-to-r from-accent via-emerald-400 to-accent-light">Go Electric</span> with JAIBEN.
</h1>
<p className="text-slate-300 text-lg sm:text-xl mb-10 drop-shadow-lg">
The largest EV Tech platform enabling the Gig Economy. Rent, Rent-to-Own, or Invest in EVs. Join the sustainable mobility revolution today.
</p>
<div className="flex flex-col sm:flex-row items-center lg:items-start justify-center lg:justify-start gap-4">
<button
onClick={() => router.push('/coming-soon')}
className="w-full sm:w-auto px-8 py-4 bg-accent text-white rounded-full font-bold text-lg hover:bg-accent-dark transition-all transform hover:scale-105 shadow-xl shadow-accent/30 flex items-center justify-center gap-2"
>
Get Started Now <ArrowRight className="w-5 h-5" />
</button>
</div>
</div>
</div>
@@ -156,7 +157,7 @@ export default function LandingPage() {
</div>
<h4 className="text-2xl font-bold text-slate-900 mb-3 relative z-10">Biker Rentals</h4>
<p className="text-slate-600 mb-8 flex-grow relative z-10">Save on petrol costs and rent a high-performance e-scooter for your daily commute or delivery gigs.</p>
<button
<button
onClick={() => router.push('/coming-soon')}
disabled={loading}
className="inline-flex items-center gap-2 text-biker font-bold group-hover:translate-x-2 transition-transform relative z-10"
@@ -190,7 +191,7 @@ export default function LandingPage() {
</div>
<h4 className="text-2xl font-bold text-slate-900 mb-3 relative z-10">Swap Stations</h4>
<p className="text-slate-600 mb-8 flex-grow relative z-10">Never wait to charge. Swap your depleted battery for a fully charged one in less than 2 minutes.</p>
<button
<button
onClick={() => router.push('/coming-soon')}
disabled={loading}
className="inline-flex items-center gap-2 text-purple-600 font-bold group-hover:translate-x-2 transition-transform relative z-10"
@@ -209,7 +210,7 @@ export default function LandingPage() {
<div>
<h4 className="text-2xl font-bold text-slate-900 mb-3">Merchants & Deliveries</h4>
<p className="text-slate-600 mb-6 max-w-xl">Are you a delivery partner or company? Request any amount of riders for your delivery needs. Partner with us for dedicated EV riders.</p>
<button
<button
onClick={() => router.push('/coming-soon')}
className="inline-flex items-center gap-2 text-accent font-bold group-hover:translate-x-2 transition-transform"
>