296 lines
16 KiB
TypeScript
296 lines
16 KiB
TypeScript
"use client"
|
|
|
|
import { Camera, Facebook, Instagram, Linkedin, Monitor, Shield, ShoppingBag, Sparkles, Twitter, Zap } from "lucide-react";
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
|
|
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
|
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
|
|
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
|
|
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
|
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
|
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
|
import FooterCard from '@/components/sections/footer/FooterCard';
|
|
|
|
export default function iPhoneLandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="bounce-effect"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="pill"
|
|
contentWidth="compact"
|
|
sizing="mediumSizeLargeTitles"
|
|
background="circleGradient"
|
|
cardStyle="solid"
|
|
primaryButtonStyle="double-inset"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="normal"
|
|
>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleCentered
|
|
brandName="iPhone Store"
|
|
navItems={[
|
|
{ name: "Products", id: "products" },
|
|
{ name: "Features", id: "features" },
|
|
{ name: "Reviews", id: "testimonials" },
|
|
{ name: "FAQ", id: "faq" },
|
|
{ name: "Contact", id: "contact" }
|
|
]}
|
|
button={{ text: "Shop Now", href: "products" }}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboardCarousel
|
|
title="Revolutionary iPhone Technology"
|
|
description="Experience the next generation of innovation with cutting-edge performance, stunning displays, and advanced camera systems. Discover why millions choose iPhone."
|
|
tag="New Release"
|
|
tagIcon={Sparkles}
|
|
background={{ variant: "sparkles-gradient" }}
|
|
mediaItems={[
|
|
{
|
|
imageSrc: "https://img.b2bpic.net/free-psd/new-smartphone-17-pro-social-media-banner-design-template_47987-33087.jpg", imageAlt: "Latest iPhone Model"
|
|
},
|
|
{
|
|
imageSrc: "https://img.b2bpic.net/free-photo/mockup-mobile-phone-screen_53876-63379.jpg", imageAlt: "iPhone Camera System"
|
|
},
|
|
{
|
|
imageSrc: "https://img.b2bpic.net/free-psd/smartphone-16-pro-discount-sale-banner-social-media-design-template_47987-25305.jpg", imageAlt: "iPhone Design"
|
|
},
|
|
{
|
|
imageSrc: "https://img.b2bpic.net/free-photo/people-holding-colorful-smartphones_23-2151969201.jpg", imageAlt: "iPhone Color Options"
|
|
},
|
|
{
|
|
imageSrc: "https://img.b2bpic.net/free-photo/business-woman-talking-phone-staying-late-night-office_1303-27089.jpg", imageAlt: "iPhone Features"
|
|
},
|
|
{
|
|
imageSrc: "https://img.b2bpic.net/free-photo/woman-looking-her-smartphone_1157-2036.jpg", imageAlt: "iPhone Performance"
|
|
}
|
|
]}
|
|
buttons={[
|
|
{ text: "Explore Models", href: "products" },
|
|
{ text: "Learn More", href: "features" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardOne
|
|
title="Our iPhone Collection"
|
|
description="Browse our premium selection of iPhone models, each engineered for excellence and designed for you."
|
|
tag="Available Now"
|
|
tagIcon={ShoppingBag}
|
|
textboxLayout="default"
|
|
useInvertedBackground="invertDefault"
|
|
animationType="slide-up"
|
|
gridVariant="three-columns-all-equal-width"
|
|
products={[
|
|
{
|
|
id: "iphone-pro-max", name: "iPhone Pro Max", price: "$1,199", imageSrc: "https://img.b2bpic.net/free-photo/low-angle-man-using-smartphone-outdoors_23-2150747684.jpg", imageAlt: "iPhone Pro Max - Premium flagship model"
|
|
},
|
|
{
|
|
id: "iphone-pro", name: "iPhone Pro", price: "$999", imageSrc: "https://img.b2bpic.net/free-photo/attractive-elegant-businesman-sunglasses-is-sitting-cafe-outside-while-chatting-mobile-phone_613910-20835.jpg", imageAlt: "iPhone Pro - Professional-grade smartphone"
|
|
},
|
|
{
|
|
id: "iphone-mini", name: "iPhone Mini", price: "$799", imageSrc: "https://img.b2bpic.net/free-psd/new-smartphone-a18-bionic-social-media-banner-design-template_47987-33085.jpg", imageAlt: "iPhone Mini - Compact powerhouse"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardTwentyFive
|
|
title="Why Choose iPhone"
|
|
description="Discover the features that make iPhone the world's most powerful personal device."
|
|
tag="Innovation"
|
|
tagIcon={Zap}
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
animationType="slide-up"
|
|
features={[
|
|
{
|
|
title: "Advanced Camera System", description: "Capture stunning photos and videos with industry-leading computational photography and optical excellence.", icon: Camera,
|
|
mediaItems: [
|
|
{
|
|
imageSrc: "https://img.b2bpic.net/free-photo/man-hands-taking-picture-with-mobile-phone-sunset_657883-728.jpg", imageAlt: "Professional camera capabilities"
|
|
},
|
|
{
|
|
imageSrc: "https://img.b2bpic.net/free-photo/man-hands-taking-picture-with-mobile-phone-sunset_657883-728.jpg", imageAlt: "Advanced photography features"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "All-Day Battery", description: "Powerful battery performance keeps you connected from morning to night with exceptional longevity.", icon: Zap,
|
|
mediaItems: [
|
|
{
|
|
imageSrc: "https://img.b2bpic.net/free-photo/senior-woman-traveling-areound-world_23-2149172097.jpg", imageAlt: "Extended battery life"
|
|
},
|
|
{
|
|
imageSrc: "https://img.b2bpic.net/free-photo/senior-woman-traveling-areound-world_23-2149172097.jpg", imageAlt: "Power efficiency"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Premium Display", description: "Stunning Super Retina display with vibrant colors, sharp contrast, and immersive viewing experience.", icon: Monitor,
|
|
mediaItems: [
|
|
{
|
|
imageSrc: "https://img.b2bpic.net/free-photo/low-angle-man-using-smartphone-outdoors_23-2150747684.jpg", imageAlt: "Retina display technology"
|
|
},
|
|
{
|
|
imageSrc: "https://img.b2bpic.net/free-photo/attractive-elegant-businesman-sunglasses-is-sitting-cafe-outside-while-chatting-mobile-phone_613910-20835.jpg", imageAlt: "Color accuracy and brightness"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
title: "Secure & Private", description: "Industry-leading privacy features and Face ID technology keep your data safe and secure always.", icon: Shield,
|
|
mediaItems: [
|
|
{
|
|
imageSrc: "https://img.b2bpic.net/free-psd/new-smartphone-a18-bionic-social-media-banner-design-template_47987-33085.jpg", imageAlt: "Security features"
|
|
},
|
|
{
|
|
imageSrc: "https://img.b2bpic.net/free-photo/low-angle-man-using-smartphone-outdoors_23-2150747684.jpg", imageAlt: "Privacy protection"
|
|
}
|
|
]
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardEleven
|
|
title="Trusted by Millions"
|
|
description="Join a global community of iPhone users who experience excellence daily."
|
|
textboxLayout="default"
|
|
useInvertedBackground="invertDefault"
|
|
animationType="slide-up"
|
|
metrics={[
|
|
{
|
|
id: "1", value: "2B+", title: "Active Users", description: "Over 2 billion devices sold worldwide", imageSrc: "https://img.b2bpic.net/free-vector/success-business_1057-2057.jpg", imageAlt: "Global iPhone adoption"
|
|
},
|
|
{
|
|
id: "2", value: "98%", title: "Customer Satisfaction", description: "Highest satisfaction ratings in the industry", imageSrc: "https://img.b2bpic.net/free-vector/business-growth-concept-with-rocket_23-2147780577.jpg", imageAlt: "Customer happiness metrics"
|
|
},
|
|
{
|
|
id: "3", value: "15+", title: "Years Innovation", description: "Continuous advancement and excellence", imageSrc: "https://img.b2bpic.net/free-photo/low-angle-man-using-smartphone-outdoors_23-2150747684.jpg", imageAlt: "Innovation history"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSixteen
|
|
title="What Users Love About iPhone"
|
|
description="Hear from real customers who have transformed their digital lives with iPhone."
|
|
textboxLayout="default"
|
|
useInvertedBackground="noInvert"
|
|
animationType="slide-up"
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Sarah Johnson", role: "Photographer", company: "Creative Studios", rating: 5,
|
|
imageSrc: "https://img.b2bpic.net/free-photo/handsome-business-man-wearing-suit-looking-camera-smiling-broadly-with-happy-face-standing-white-background_141793-54115.jpg", imageAlt: "Sarah Johnson testimonial"
|
|
},
|
|
{
|
|
id: "2", name: "Marcus Chen", role: "Entrepreneur", company: "Tech Ventures", rating: 5,
|
|
imageSrc: "https://img.b2bpic.net/free-photo/smiling-businessman-standing-airport_107420-85035.jpg", imageAlt: "Marcus Chen testimonial"
|
|
},
|
|
{
|
|
id: "3", name: "Emily Rodriguez", role: "Designer", company: "Digital Agency", rating: 5,
|
|
imageSrc: "https://img.b2bpic.net/free-photo/alone-specialist-handsome-daydreaming-collar_1262-870.jpg", imageAlt: "Emily Rodriguez testimonial"
|
|
},
|
|
{
|
|
id: "4", name: "David Kim", role: "Student", company: "University", rating: 5,
|
|
imageSrc: "https://img.b2bpic.net/free-photo/smiling-businessman-standing-airport-terminal_107420-85070.jpg", imageAlt: "David Kim testimonial"
|
|
}
|
|
]}
|
|
kpiItems={[
|
|
{ value: "4.9/5", label: "Average Rating" },
|
|
{ value: "99%", label: "Would Recommend" },
|
|
{ value: "50K+", label: "Happy Customers" }
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitText
|
|
sideTitle="Frequently Asked Questions"
|
|
sideDescription="Find answers to common questions about iPhone features, purchasing, and support."
|
|
textPosition="left"
|
|
useInvertedBackground="invertDefault"
|
|
animationType="smooth"
|
|
faqs={[
|
|
{
|
|
id: "1", title: "What is the warranty coverage?", content: "All iPhones come with a one-year limited warranty covering hardware defects. AppleCare+ extends coverage to two years with accidental damage protection."
|
|
},
|
|
{
|
|
id: "2", title: "How long does the battery last?", content: "iPhone provides all-day battery life with typical usage. Actual battery life depends on usage patterns, but most users get 15-20 hours per charge."
|
|
},
|
|
{
|
|
id: "3", title: "Can I trade in my old device?", content: "Yes! We offer competitive trade-in values for your old iPhone. The value depends on the model, condition, and age of your device."
|
|
},
|
|
{
|
|
id: "4", title: "What payment options are available?", content: "We accept all major credit cards, Apple Pay, financing plans, and other digital payment methods for your convenience."
|
|
},
|
|
{
|
|
id: "5", title: "Do you offer free shipping?", content: "Yes, we provide free standard shipping on orders over $100. Express and overnight shipping options are also available at checkout."
|
|
},
|
|
{
|
|
id: "6", title: "How do I set up my new iPhone?", content: "Setup is simple with the Quick Start feature. You can transfer data from your old device wirelessly or manually configure your new iPhone."
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplitForm
|
|
title="Get in Touch"
|
|
description="Have questions about our iPhones? Our expert team is here to help you find the perfect device for your needs."
|
|
useInvertedBackground="noInvert"
|
|
mediaPosition="right"
|
|
imageSrc="https://img.b2bpic.net/free-photo/young-beautiful-female-support-phone-operator-speaking-consulting-office_176420-952.jpg"
|
|
imageAlt="Customer support team"
|
|
inputs={[
|
|
{
|
|
name: "name", type: "text", placeholder: "Your Name", required: true
|
|
},
|
|
{
|
|
name: "email", type: "email", placeholder: "your@email.com", required: true
|
|
},
|
|
{
|
|
name: "phone", type: "tel", placeholder: "+1 (555) 000-0000", required: false
|
|
}
|
|
]}
|
|
textarea={{
|
|
name: "message", placeholder: "Tell us how we can help...", rows: 5,
|
|
required: true
|
|
}}
|
|
buttonText="Send Message"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterCard
|
|
logoText="iPhone Store"
|
|
copyrightText="© 2025 iPhone Store. All rights reserved."
|
|
socialLinks={[
|
|
{
|
|
icon: Facebook,
|
|
href: "https://facebook.com", ariaLabel: "Facebook"
|
|
},
|
|
{
|
|
icon: Twitter,
|
|
href: "https://twitter.com", ariaLabel: "Twitter"
|
|
},
|
|
{
|
|
icon: Instagram,
|
|
href: "https://instagram.com", ariaLabel: "Instagram"
|
|
},
|
|
{
|
|
icon: Linkedin,
|
|
href: "https://linkedin.com", ariaLabel: "LinkedIn"
|
|
}
|
|
]}
|
|
/>
|
|
</div>
|
|
</ThemeProvider>
|
|
);
|
|
} |