243 lines
15 KiB
TypeScript
243 lines
15 KiB
TypeScript
"use client";
|
|
|
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
|
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
|
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
|
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
|
|
import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
|
|
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
|
|
import AboutMetric from '@/components/sections/about/AboutMetric';
|
|
import ContactText from '@/components/sections/contact/ContactText';
|
|
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import { Sparkles, Package, Zap, Smartphone, Crown, Users, Award, TrendingUp, Globe } from 'lucide-react';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="hover-magnetic"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="pill"
|
|
contentWidth="smallMedium"
|
|
sizing="mediumLarge"
|
|
background="circleGradient"
|
|
cardStyle="elevated"
|
|
primaryButtonStyle="flat"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="normal"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple
|
|
brandName="iPhone"
|
|
navItems={[
|
|
{ name: "Products", id: "products" },
|
|
{ name: "Features", id: "features" },
|
|
{ name: "Pricing", id: "pricing" },
|
|
{ name: "Testimonials", id: "testimonials" },
|
|
{ name: "Contact", id: "contact" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboard
|
|
title="Experience the Power of Innovation in Your Pocket"
|
|
description="Discover the latest iPhone with revolutionary features, stunning design, and unmatched performance. Step into the future of mobile technology."
|
|
background={{ variant: "sparkles-gradient" }}
|
|
tag="Latest Release"
|
|
tagIcon={Sparkles}
|
|
imageSrc="https://img.b2bpic.net/free-photo/smartphone-minimal-display-marble_23-2149554980.jpg"
|
|
imageAlt="iPhone showcase"
|
|
buttons={[
|
|
{ text: "Shop Now", href: "#products" },
|
|
{ text: "Learn More", href: "#features" }
|
|
]}
|
|
avatarText="Loved by 50M+ users worldwide"
|
|
avatars={[
|
|
{ src: "https://img.b2bpic.net/free-photo/closeup-young-female-professional-making-eye-contact-against-colored-background_662251-651.jpg", alt: "User 1" },
|
|
{ src: "https://img.b2bpic.net/free-photo/smiling-businessman-face-portrait-wearing-suit_53876-148135.jpg", alt: "User 2" },
|
|
{ src: "https://img.b2bpic.net/free-photo/happy-professional_1098-12931.jpg", alt: "User 3" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardFour
|
|
title="iPhone Models"
|
|
description="Choose the perfect iPhone that matches your lifestyle and needs"
|
|
tag="Featured Collection"
|
|
tagIcon={Package}
|
|
textboxLayout="default"
|
|
gridVariant="uniform-all-items-equal"
|
|
animationType="slide-up"
|
|
carouselMode="buttons"
|
|
useInvertedBackground="noInvert"
|
|
products={[
|
|
{
|
|
id: "iphone-15-pro-max", name: "iPhone 15 Pro Max", price: "$1,199", variant: "Titanium 3 Colors", imageSrc: "https://img.b2bpic.net/free-photo/smartphone-minimal-display-marble_23-2149554984.jpg", imageAlt: "iPhone 15 Pro Max", isFavorited: false
|
|
},
|
|
{
|
|
id: "iphone-15-pro", name: "iPhone 15 Pro", price: "$999", variant: "Titanium 3 Colors", imageSrc: "https://img.b2bpic.net/free-photo/smartphone-minimal-display-marble_23-2149554984.jpg", imageAlt: "iPhone 15 Pro", isFavorited: false
|
|
},
|
|
{
|
|
id: "iphone-15", name: "iPhone 15", price: "$799", variant: "Black 5 Colors", imageSrc: "https://img.b2bpic.net/free-photo/smartphone-minimal-display-marble_23-2149554966.jpg", imageAlt: "iPhone 15", isFavorited: false
|
|
},
|
|
{
|
|
id: "iphone-15-plus", name: "iPhone 15 Plus", price: "$899", variant: "Black 5 Colors", imageSrc: "https://img.b2bpic.net/free-photo/smartphone-minimal-display-marble_23-2149554966.jpg", imageAlt: "iPhone 15 Plus", isFavorited: false
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardThree
|
|
title="Revolutionary Features"
|
|
description="Experience technology that adapts to you with cutting-edge innovations"
|
|
tag="Innovation"
|
|
tagIcon={Zap}
|
|
textboxLayout="default"
|
|
gridVariant="bento-grid"
|
|
animationType="slide-up"
|
|
useInvertedBackground="noInvert"
|
|
features={[
|
|
{
|
|
id: "01", title: "Pro Camera System", description: "Capture stunning photos with advanced computational photography and pro-level controls", imageSrc: "https://img.b2bpic.net/free-vector/smartphone-template-with-camera-interface_1361-1529.jpg", imageAlt: "Pro camera system"
|
|
},
|
|
{
|
|
id: "02", title: "All-Day Battery", description: "Incredible all-day battery life that goes all day and then some with smart power management", imageSrc: "https://img.b2bpic.net/free-photo/woman-taking-photo-two-croissants_23-2149277917.jpg", imageAlt: "Battery performance"
|
|
},
|
|
{
|
|
id: "03", title: "Stunning Display", description: "Super Retina XDR display with adaptive refresh rates for immersive viewing", imageSrc: "https://img.b2bpic.net/free-photo/portrait-woman-using-smartphone-with-pop-socket-outdoors_23-2150168486.jpg", imageAlt: "Display technology"
|
|
},
|
|
{
|
|
id: "04", title: "Lightning Performance", description: "A17 Pro chip delivers extraordinary performance with industry-leading efficiency", imageSrc: "https://img.b2bpic.net/free-photo/close-up-hands-taking-coffee-photos_23-2149294500.jpg", imageAlt: "A17 Pro performance"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="pricing" data-section="pricing">
|
|
<PricingCardFive
|
|
title="Simple, Transparent Pricing"
|
|
description="Choose the iPhone that fits your budget and lifestyle"
|
|
textboxLayout="default"
|
|
animationType="slide-up"
|
|
useInvertedBackground="noInvert"
|
|
plans={[
|
|
{
|
|
id: "iphone-15-standard", tag: "iPhone 15", tagIcon: Smartphone,
|
|
price: "$799", period: "one-time", description: "Perfect for everyday power users who want the latest innovation", button: { text: "Buy Now", href: "#products" },
|
|
featuresTitle: "What's Included:", features: [
|
|
"6.1-inch Super Retina XDR display", "Advanced dual camera system", "A17 Pro chip", "All-day battery life", "Water resistance (IP68)", "5-year warranty"
|
|
]
|
|
},
|
|
{
|
|
id: "iphone-15-pro", tag: "iPhone 15 Pro", tagIcon: Crown,
|
|
price: "$999", period: "one-time", description: "For professionals who demand uncompromising performance and pro-level features", button: { text: "Buy Now", href: "#products" },
|
|
featuresTitle: "What's Included:", features: [
|
|
"6.1-inch Pro display with 120Hz ProMotion", "Pro camera system with telephoto", "Titanium design", "A17 Pro chip optimized for pro apps", "Advanced computational photography", "6-year warranty + AppleCare+"
|
|
]
|
|
},
|
|
{
|
|
id: "iphone-15-pro-max", tag: "iPhone 15 Pro Max", tagIcon: Zap,
|
|
price: "$1,199", period: "one-time", description: "The ultimate iPhone for creators and power users", button: { text: "Buy Now", href: "#products" },
|
|
featuresTitle: "What's Included:", features: [
|
|
"6.7-inch Pro display XDR", "Pro camera system with advanced zoom", "Titanium premium build", "Extended battery life", "Pro-level video recording", "6-year warranty + AppleCare+ 24/7 support"
|
|
]
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTen
|
|
title="What Our Customers Say"
|
|
description="Hear from real users about their iPhone experience"
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
testimonials={[
|
|
{
|
|
id: "1", title: "Best Camera Phone Ever", quote: "The camera quality on iPhone 15 Pro is absolutely phenomenal. I've completely replaced my dedicated camera for most of my photography work. The computational photography and portrait mode are unmatched.", name: "Sarah Chen", role: "Professional Photographer", imageSrc: "https://img.b2bpic.net/free-photo/closeup-young-female-professional-making-eye-contact-against-colored-background_662251-651.jpg", imageAlt: "Sarah Chen"
|
|
},
|
|
{
|
|
id: "2", title: "Battery Life is Game Changing", quote: "I used to be glued to a charger. With iPhone 15, I get through 2 full days without charging. The battery optimization is incredible and makes my life so much easier.", name: "Marcus Thompson", role: "Software Developer", imageSrc: "https://img.b2bpic.net/free-photo/smiling-businessman-face-portrait-wearing-suit_53876-148135.jpg", imageAlt: "Marcus Thompson"
|
|
},
|
|
{
|
|
id: "3", title: "Worth Every Penny", quote: "I upgraded from an older model and the performance difference is night and day. Apps load instantly, multitasking is seamless, and gaming is buttery smooth. The A17 Pro is incredible.", name: "Emma Rodriguez", role: "Content Creator", imageSrc: "https://img.b2bpic.net/free-photo/happy-professional_1098-12931.jpg", imageAlt: "Emma Rodriguez"
|
|
},
|
|
{
|
|
id: "4", title: "Premium Feel, Premium Experience", quote: "The titanium design looks and feels so premium. It's lightweight but durable, and the colors are beautiful. This phone is a complete package for anyone looking for quality and performance.", name: "James Wilson", role: "Business Executive", imageSrc: "https://img.b2bpic.net/free-photo/happy-businessman-smiling-camera_1163-4660.jpg", imageAlt: "James Wilson"
|
|
},
|
|
{
|
|
id: "5", title: "Perfect for Everything", quote: "From photography to video editing to gaming, iPhone 15 handles everything I throw at it. The display is stunning and the overall experience is smooth and intuitive.", name: "Lisa Kim", role: "Video Editor", imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-caucasian-unshaved-man-eyeglasses-looking-camera-with-sincere-smile-isolated-gray_171337-630.jpg", imageAlt: "Lisa Kim"
|
|
},
|
|
{
|
|
id: "6", title: "Best Investment", quote: "Three years later and my iPhone still runs like new. The durability and longevity are unmatched. It's definitely worth the investment compared to other smartphones.", name: "David Martinez", role: "Tech Enthusiast", imageSrc: "https://img.b2bpic.net/free-photo/portrait-business-woman-office_1398-6.jpg", imageAlt: "David Martinez"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<AboutMetric
|
|
title="Trusted by Millions. Celebrated Worldwide."
|
|
useInvertedBackground="noInvert"
|
|
metrics={[
|
|
{ icon: Users, label: "Active Users", value: "1.5B+" },
|
|
{ icon: Award, label: "Industry Awards", value: "200+" },
|
|
{ icon: TrendingUp, label: "Customer Satisfaction", value: "98%" },
|
|
{ icon: Globe, label: "Countries Sold In", value: "195" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactText
|
|
text="Ready to experience the future? Get your iPhone today and discover why millions trust Apple."
|
|
animationType="entrance-slide"
|
|
background={{ variant: "plain" }}
|
|
useInvertedBackground="noInvert"
|
|
buttons={[
|
|
{ text: "Shop iPhone", href: "#products" },
|
|
{ text: "Contact Support", href: "https://support.apple.com" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterMedia
|
|
imageSrc="https://img.b2bpic.net/free-photo/fingers-opening-future_1134-120.jpg"
|
|
imageAlt="Footer tech background"
|
|
logoText="iPhone"
|
|
copyrightText="© 2025 Apple Inc. All rights reserved."
|
|
columns={[
|
|
{
|
|
title: "Products", items: [
|
|
{ label: "iPhone 15 Pro", href: "#products" },
|
|
{ label: "iPhone 15", href: "#products" },
|
|
{ label: "Compare Models", href: "#products" },
|
|
{ label: "Accessories", href: "#products" }
|
|
]
|
|
},
|
|
{
|
|
title: "Support", items: [
|
|
{ label: "Documentation", href: "https://support.apple.com" },
|
|
{ label: "Tech Specs", href: "https://support.apple.com" },
|
|
{ label: "Environmental", href: "https://support.apple.com" },
|
|
{ label: "Repair Service", href: "https://support.apple.com" }
|
|
]
|
|
},
|
|
{
|
|
title: "Company", items: [
|
|
{ label: "About Apple", href: "https://www.apple.com" },
|
|
{ label: "Newsroom", href: "https://www.apple.com" },
|
|
{ label: "Careers", href: "https://www.apple.com" },
|
|
{ label: "Contact", href: "#contact" }
|
|
]
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |