261 lines
13 KiB
TypeScript
261 lines
13 KiB
TypeScript
"use client"
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
|
import HeroSplit from '@/components/sections/hero/HeroSplit';
|
|
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
|
import FeatureProcessSteps from '@/components/sections/feature/FeatureProcessSteps';
|
|
import AboutMetric from '@/components/sections/about/AboutMetric';
|
|
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
|
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
|
import FooterBase from '@/components/sections/footer/FooterBase';
|
|
import { Award, Globe, Smartphone, Sparkles, Users } from 'lucide-react';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="bounce-effect"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="sharp"
|
|
contentWidth="mediumSmall"
|
|
sizing="medium"
|
|
background="none"
|
|
cardStyle="layered-gradient"
|
|
primaryButtonStyle="flat"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="bold"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingOverlay
|
|
brandName="iPhone"
|
|
navItems={[
|
|
{ name: "Products", id: "products" },
|
|
{ name: "Features", id: "features" },
|
|
{ name: "Reviews", id: "reviews" },
|
|
{ name: "Contact", id: "contact" }
|
|
]}
|
|
button={{
|
|
text: "Shop Now", href: "#products"
|
|
}}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplit
|
|
title="Experience the Future of Mobile"
|
|
description="Introducing the latest iPhone. Featuring an advanced camera system, stunning display, and all-day battery life. Designed for excellence."
|
|
tag="New Collection"
|
|
tagIcon={Sparkles}
|
|
background={{ variant: "plain" }}
|
|
imageSrc="https://img.b2bpic.net/free-photo/still-life-books-versus-technology_23-2150063043.jpg"
|
|
imageAlt="Latest iPhone smartphone with premium design"
|
|
imagePosition="right"
|
|
buttons={[
|
|
{ text: "Explore Products", href: "#products" },
|
|
{ text: "Learn More", href: "#features" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardFour
|
|
title="Shop Our Collection"
|
|
description="Discover the perfect iPhone for your lifestyle. Premium quality, innovative features, and exceptional performance."
|
|
tag="Available Now"
|
|
textboxLayout="default"
|
|
gridVariant="uniform-all-items-equal"
|
|
animationType="slide-up"
|
|
useInvertedBackground="noInvert"
|
|
products={[
|
|
{
|
|
id: "iphone-pro-max", name: "iPhone Pro Max", price: "$1,199", variant: "6.7-inch Display, 5 Colors", imageSrc: "https://img.b2bpic.net/free-photo/wireless-earbuds-with-neon-cyberpunk-style-lighting_23-2151074279.jpg", imageAlt: "iPhone Pro Max flagship model", isFavorited: false
|
|
},
|
|
{
|
|
id: "iphone-pro", name: "iPhone Pro", price: "$999", variant: "6.1-inch Display, 4 Colors", imageSrc: "https://img.b2bpic.net/free-vector/neon-landing-page-with-smartphone_52683-28248.jpg", imageAlt: "iPhone Pro premium smartphone", isFavorited: false
|
|
},
|
|
{
|
|
id: "iphone-plus", name: "iPhone Plus", price: "$899", variant: "6.7-inch Display, 6 Colors", imageSrc: "https://img.b2bpic.net/free-vector/mobile-futuristic-technology-concept-background_1017-29935.jpg", imageAlt: "iPhone Plus with large display", isFavorited: false
|
|
},
|
|
{
|
|
id: "iphone-standard", name: "iPhone", price: "$799", variant: "6.1-inch Display, 5 Colors", imageSrc: "https://img.b2bpic.net/free-vector/neon-landing-page-with-smartphone_52683-28248.jpg", imageAlt: "iPhone standard model", isFavorited: false
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureProcessSteps
|
|
title="Why Choose iPhone"
|
|
description="Experience unmatched innovation, security, and performance. Every detail crafted for excellence."
|
|
tag="Premium Technology"
|
|
tagIcon={Sparkles}
|
|
useInvertedBackground="invertDefault"
|
|
steps={[
|
|
{
|
|
number: "01", title: "Advanced Camera System", tag: "Pro Innovation", description: "Capture stunning photos and cinematic videos with our enhanced optical system and computational photography."
|
|
},
|
|
{
|
|
number: "02", title: "Stunning Display", tag: "Immersive", description: "ProMotion technology delivers up to 120Hz refresh rate for incredibly smooth scrolling and responsiveness."
|
|
},
|
|
{
|
|
number: "03", title: "All-Day Battery", tag: "Reliability", description: "Intelligent power management keeps your device running longer. Optional MagSafe charging for convenient top-ups."
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<AboutMetric
|
|
title="Trusted by Millions Worldwide. Leading Innovation Since Day One."
|
|
useInvertedBackground="noInvert"
|
|
metrics={[
|
|
{
|
|
icon: Smartphone,
|
|
label: "Units Sold", value: "2.2B+"
|
|
},
|
|
{
|
|
icon: Globe,
|
|
label: "Countries", value: "195"
|
|
},
|
|
{
|
|
icon: Users,
|
|
label: "Active Users", value: "1.8B+"
|
|
},
|
|
{
|
|
icon: Award,
|
|
label: "Industry Awards", value: "500+"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="reviews" data-section="reviews">
|
|
<TestimonialCardTwo
|
|
title="Customer Reviews"
|
|
description="Discover what iPhone users love about their devices"
|
|
tag="User Feedback"
|
|
textboxLayout="default"
|
|
useInvertedBackground="invertDefault"
|
|
animationType="slide-up"
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Sarah Chen", role: "Professional Photographer", testimonial: "The camera system is absolutely revolutionary. I've replaced my DSLR with my iPhone Pro. The computational photography is simply unmatched.", imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageAlt: "Sarah Chen professional headshot"
|
|
},
|
|
{
|
|
id: "2", name: "Marcus Johnson", role: "Software Developer", testimonial: "Performance is incredible. Apps load instantly, multitasking is seamless, and the battery lasts all day. Couldn't be happier.", imageSrc: "https://img.b2bpic.net/free-photo/smiling-homosexual-man-official-suit-looking-camera-close-up-shot-happy-gay-getting-dressed-wedding-ceremony-standing-hotel-room-with-his-partner-background-love-emotion-concept_74855-22675.jpg", imageAlt: "Marcus Johnson professional headshot"
|
|
},
|
|
{
|
|
id: "3", name: "Elena Rodriguez", role: "Content Creator", testimonial: "The display is stunning and ProMotion makes everything feel silky smooth. Perfect for video editing on the go.", imageSrc: "https://img.b2bpic.net/free-photo/close-up-competitive-employee_1098-2870.jpg", imageAlt: "Elena Rodriguez professional headshot"
|
|
},
|
|
{
|
|
id: "4", name: "James Mitchell", role: "Business Executive", testimonial: "Security and privacy are paramount. iPhone's approach to data protection gives me peace of mind every single day.", imageSrc: "https://img.b2bpic.net/free-photo/closeup-handsome-middle-aged-business-leader_1262-4822.jpg", imageAlt: "James Mitchell professional headshot"
|
|
},
|
|
{
|
|
id: "5", name: "Lisa Park", role: "Student", testimonial: "The ecosystem is seamless. Everything syncs perfectly across my devices. Once you go Apple, you never go back.", imageSrc: "https://img.b2bpic.net/free-photo/happy-young-professional-posing-office_1262-21170.jpg", imageAlt: "Lisa Park professional headshot"
|
|
},
|
|
{
|
|
id: "6", name: "David Thompson", role: "Designer", testimonial: "The design is timeless. It's not just a phone, it's a statement of quality and craftsmanship. Absolutely premium.", imageSrc: "https://img.b2bpic.net/free-photo/positive-middle-aged-business-leader-window_1262-5388.jpg", imageAlt: "David Thompson professional headshot"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCTA
|
|
tag="Get Started"
|
|
title="Ready to Upgrade Your Phone?"
|
|
description="Join millions of satisfied users worldwide. Experience the innovation, performance, and design that sets iPhone apart."
|
|
background={{ variant: "plain" }}
|
|
useInvertedBackground="noInvert"
|
|
buttons={[
|
|
{ text: "Shop Now", href: "#products" },
|
|
{ text: "View All Models", href: "#products" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="product" data-section="product">
|
|
<ProductCardFour
|
|
title="Shop Our WORST Products"
|
|
description="These are our least popular models, but they still come with a warranty. Maybe you'll find a hidden gem!"
|
|
tag="Available Now"
|
|
textboxLayout="default"
|
|
gridVariant="uniform-all-items-equal"
|
|
animationType="slide-up"
|
|
useInvertedBackground="noInvert"
|
|
products={[
|
|
{
|
|
id: "iphone-4s",
|
|
name: "iPhone 4S",
|
|
price: "$50",
|
|
variant: "4-inch Display, 2 Colors",
|
|
imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80",
|
|
imageAlt: "iPhone 4S retro model",
|
|
isFavorited: false
|
|
},
|
|
{
|
|
id: "iphone-5",
|
|
name: "iPhone 5",
|
|
price: "$60",
|
|
variant: "4-inch Display, 2 Colors",
|
|
imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80",
|
|
imageAlt: "iPhone 5 older model",
|
|
isFavorited: false
|
|
},
|
|
{
|
|
id: "iphone-5s",
|
|
name: "iPhone 5S",
|
|
price: "$70",
|
|
variant: "4-inch Display, 3 Colors",
|
|
imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80",
|
|
imageAlt: "iPhone 5S slightly better model",
|
|
isFavorited: false
|
|
},
|
|
{
|
|
id: "iphone-6",
|
|
name: "iPhone 6",
|
|
price: "$80",
|
|
variant: "4.7-inch Display, 2 Colors",
|
|
imageSrc: "https://images.unsplash.com/photo-1519681393784-d120267933ba?w=800&q=80",
|
|
imageAlt: "iPhone 6 first large display model",
|
|
isFavorited: false
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBase
|
|
logoText="iPhone"
|
|
copyrightText="© 2025 iPhone. All rights reserved."
|
|
columns={[
|
|
{
|
|
title: "Shop", items: [
|
|
{ label: "iPhone Pro Max", href: "#products" },
|
|
{ label: "iPhone Pro", href: "#products" },
|
|
{ label: "iPhone Plus", href: "#products" },
|
|
{ label: "iPhone", href: "#products" }
|
|
]
|
|
},
|
|
{
|
|
title: "Support", items: [
|
|
{ label: "Technical Support", href: "#contact" },
|
|
{ label: "Warranty Info", href: "#contact" },
|
|
{ label: "FAQs", href: "#contact" },
|
|
{ label: "Contact Us", href: "#contact" }
|
|
]
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{ label: "About iPhone", href: "#features" },
|
|
{ label: "Sustainability", href: "#features" },
|
|
{ label: "Careers", href: "#features" },
|
|
{ label: "Press", href: "#features" }
|
|
]
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |