Compare commits
55 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 81aefdd23b | |||
| d65fbf4dac | |||
| 41fff7802d | |||
| 71b69fcc46 | |||
| e54649c334 | |||
| 8921aa2791 | |||
| ef49f0d0b8 | |||
| 678d50a693 | |||
| 7cce6a0015 | |||
| 94cfb7710d | |||
| 92df796b2b | |||
| 278936c33a | |||
| ec3b9fc5d9 | |||
| 50df050c7e | |||
| 35c3057c5c | |||
| a066a34b20 | |||
| 7365d6e893 | |||
| 7bceb9f420 | |||
| f21da29950 | |||
| a0bda1c8d2 | |||
| 68870915f0 | |||
| 15b83f5b6d | |||
| 98e5ff0199 | |||
| 8a83eec546 | |||
| ab348847cf | |||
| 3be746e09e | |||
| e695168ea6 | |||
| 8942533033 | |||
| 442f54c68d | |||
| a132a5a352 | |||
| c8a6e0064c | |||
| 023a187a88 | |||
| 1b36715a75 | |||
| 171fd84221 | |||
| 1789bf384f | |||
| e584e0d39f | |||
| 474747dbe1 | |||
| e8a0022561 | |||
| ff9b761c95 | |||
| a11667954b | |||
| 53395a3d8b | |||
| 8b0df1b664 | |||
| 4d47235d5f | |||
| 39e45097f8 | |||
| 73f852d237 | |||
| f2c048dc30 | |||
| 61b5bbb2be | |||
| 620d13dbd5 | |||
| 8c88ae39a7 | |||
| 0033fe0a6f | |||
| 24300e858c | |||
| f1ed8af50d | |||
| 1b0cfd73ff | |||
| 0517ec26fc | |||
| a225ae0a45 |
@@ -2,14 +2,11 @@
|
|||||||
|
|
||||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||||||
import HeroSplit from "@/components/sections/hero/HeroSplit";
|
import MediaAbout from "@/components/sections/about/MediaAbout";
|
||||||
import TextSplitAbout from "@/components/sections/about/TextSplitAbout";
|
|
||||||
import AboutMetric from "@/components/sections/about/AboutMetric";
|
import AboutMetric from "@/components/sections/about/AboutMetric";
|
||||||
import TeamCardOne from "@/components/sections/team/TeamCardOne";
|
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
|
||||||
import FeatureCardTwentySeven from "@/components/sections/feature/FeatureCardTwentySeven";
|
|
||||||
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
|
||||||
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
||||||
import { Zap, Heart, Globe, Award, Headphones } from "lucide-react";
|
import { Award, Users, Target, Zap, Battery, Globe } from "lucide-react";
|
||||||
|
|
||||||
export default function AboutPage() {
|
export default function AboutPage() {
|
||||||
return (
|
return (
|
||||||
@@ -35,122 +32,60 @@ export default function AboutPage() {
|
|||||||
{ name: "Support", id: "/" },
|
{ name: "Support", id: "/" },
|
||||||
{ name: "Reviews", id: "/reviews" },
|
{ name: "Reviews", id: "/reviews" },
|
||||||
{ name: "About", id: "/about" },
|
{ name: "About", id: "/about" },
|
||||||
|
{ name: "Pricing", id: "/pricing" },
|
||||||
|
{ name: "Contact", id: "/contact" },
|
||||||
]}
|
]}
|
||||||
button={{ text: "Shop Now", href: "/" }}
|
button={{ text: "Shop Now", href: "/" }}
|
||||||
animateOnLoad={true}
|
animateOnLoad={true}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="hero" data-section="hero">
|
<div id="about-hero" data-section="about-hero">
|
||||||
<HeroSplit
|
<MediaAbout
|
||||||
title="About PodsX - Redefining Wireless Audio"
|
title="About PodsX - Revolutionizing Audio Technology"
|
||||||
description="We're passionate about creating the future of audio. At PodsX, we combine cutting-edge technology with exceptional design to deliver premium wireless earbuds that seamlessly integrate into your life."
|
description="We're committed to delivering premium wireless audio experiences that seamlessly integrate with your lifestyle. Since our founding, we've been dedicated to innovation, quality, and customer satisfaction."
|
||||||
background={{ variant: "plain" }}
|
|
||||||
tag="Our Story"
|
tag="Our Story"
|
||||||
tagIcon={Zap}
|
tagIcon={Award}
|
||||||
tagAnimation="slide-up"
|
tagAnimation="slide-up"
|
||||||
buttons={[
|
buttons={[{ text: "Explore Our Mission", href: "/" }]}
|
||||||
{ text: "Join Our Community", href: "#" },
|
|
||||||
{ text: "Explore Products", href: "/" },
|
|
||||||
]}
|
|
||||||
buttonAnimation="slide-up"
|
buttonAnimation="slide-up"
|
||||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/modern-tech-company-office-with-innovati-1772884352920-b1c2d3e4.png"
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/a-sleek-premium-product-shot-of-airpods--1772884352155-5b47d23f.png"
|
||||||
imageAlt="PodsX innovation and design studio"
|
imageAlt="PodsX company headquarters and innovation center"
|
||||||
mediaAnimation="blur-reveal"
|
|
||||||
imagePosition="right"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="mission" data-section="mission">
|
|
||||||
<TextSplitAbout
|
|
||||||
title="Our Mission"
|
|
||||||
description={[
|
|
||||||
"At PodsX, our mission is to democratize premium audio technology. We believe everyone deserves access to exceptional sound quality, innovative features, and seamless connectivity.", "We're committed to pushing the boundaries of what's possible in wireless audio. Through relentless innovation, meticulous engineering, and a deep understanding of user needs, we create products that elevate everyday moments.", "Our vision extends beyond products. We're building a community of audio enthusiasts who appreciate quality, innovation, and the power of great sound to enhance life."]}
|
|
||||||
buttons={[
|
|
||||||
{ text: "Learn More", href: "#" },
|
|
||||||
{ text: "Join Community", href: "#" },
|
|
||||||
]}
|
|
||||||
buttonAnimation="slide-up"
|
|
||||||
showBorder={true}
|
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="values" data-section="values">
|
<div id="about-metrics" data-section="about-metrics">
|
||||||
<AboutMetric
|
<AboutMetric
|
||||||
title="Our Core Values Guiding Innovation"
|
title="Our Impact and Growth"
|
||||||
metrics={[
|
metrics={[
|
||||||
{ icon: Zap, label: "Innovation First", value: "Cutting-Edge" },
|
{ icon: Users, label: "Active Users Worldwide", value: "50+ Million" },
|
||||||
{ icon: Heart, label: "User-Centric Design", value: "Premium" },
|
{ icon: Target, label: "Countries We Serve", value: "150+" },
|
||||||
{ icon: Globe, label: "Global Reach", value: "Worldwide" },
|
{ icon: Zap, label: "Products Developed", value: "12+" },
|
||||||
{ icon: Award, label: "Quality Excellence", value: "Best-in-Class" },
|
{ icon: Globe, label: "Years of Innovation", value: "10+" },
|
||||||
]}
|
]}
|
||||||
metricsAnimation="slide-up"
|
metricsAnimation="slide-up"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="team" data-section="team">
|
<div id="social-proof" data-section="social-proof">
|
||||||
<TeamCardOne
|
<SocialProofOne
|
||||||
title="Meet the Team Behind the Innovation - Passionate Creators Dedicated to Audio Excellence"
|
title="Trusted Partnerships"
|
||||||
description="Get to know the talented individuals driving our mission forward"
|
description="Collaborating with leading technology and audio companies to bring you the best experience"
|
||||||
tag="Our Team"
|
tag="Our Partners"
|
||||||
|
tagIcon={Award}
|
||||||
tagAnimation="slide-up"
|
tagAnimation="slide-up"
|
||||||
members={[
|
names={[
|
||||||
{
|
"Apple", "Spotify", "Amazon", "Google", "Samsung", "Sony", "Microsoft"
|
||||||
id: "1", name: "Alexander Johnson", role: "CEO", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/professional-headshot-of-tech-executive-1772884352456-c1d2e3f4.png", imageAlt: "Alexander Johnson, CEO"},
|
]}
|
||||||
{
|
logos={[
|
||||||
id: "2", name: "Maria Rodriguez", role: "Chief Product Officer", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/professional-headshot-woman-tech-leader-1772884352567-d2e3f4g5.png", imageAlt: "Maria Rodriguez, Chief Product Officer"},
|
"http://img.b2bpic.net/free-photo/top-view-apples-around-frame-white-background-with-copy-space_141793-11956.jpg", "http://img.b2bpic.net/free-vector/flat-design-minimal-music-festival-youtube-channel-art_23-2149155264.jpg", "http://img.b2bpic.net/free-vector/set-retro-music-stickers_23-2147592207.jpg", "http://img.b2bpic.net/free-vector/music-festival-logo-collection-with-flat-design_23-2147825729.jpg", "http://img.b2bpic.net/free-vector/gradient-colored-dj-logo-set_23-2148874408.jpg", "http://img.b2bpic.net/free-vector/flat-design-dj-logo-collection_23-2148872847.jpg", "http://img.b2bpic.net/free-vector/neumorph-business-card_52683-59098.jpg"
|
||||||
{
|
|
||||||
id: "3", name: "David Liu", role: "Chief Technology Officer", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/professional-headshot-asian-tech-engineer-1772884352678-e3f4g5h6.png", imageAlt: "David Liu, Chief Technology Officer"},
|
|
||||||
{
|
|
||||||
id: "4", name: "Sophie Martin", role: "Head of Design", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/professional-headshot-european-designer-1772884352789-f4g5h6i7.png", imageAlt: "Sophie Martin, Head of Design"},
|
|
||||||
]}
|
]}
|
||||||
gridVariant="four-items-2x2-equal-grid"
|
|
||||||
animationType="slide-up"
|
|
||||||
textboxLayout="default"
|
textboxLayout="default"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
/>
|
speed={40}
|
||||||
</div>
|
showCard={true}
|
||||||
|
|
||||||
<div id="why-podsx" data-section="why-podsx">
|
|
||||||
<FeatureCardTwentySeven
|
|
||||||
title="Why Choose PodsX"
|
|
||||||
description="Discover what sets us apart in the competitive audio market."
|
|
||||||
tag="Our Advantage"
|
|
||||||
tagIcon={Zap}
|
|
||||||
tagAnimation="slide-up"
|
|
||||||
features={[
|
|
||||||
{
|
|
||||||
id: "1", title: "Innovation at Heart", description: "We invest heavily in R&D to bring you the latest audio technology and features.", imageSrc: "/placeholders/placeholder1.webp?_wi=1", imageAlt: "Innovation focus"},
|
|
||||||
{
|
|
||||||
id: "2", title: "Global Impact", description: "Trusted by millions of users worldwide, delivering premium audio experiences.", imageSrc: "/placeholders/placeholder1.webp?_wi=2", imageAlt: "Global reach"},
|
|
||||||
{
|
|
||||||
id: "3", title: "Sustainable Practices", description: "We're committed to eco-friendly manufacturing and packaging.", imageSrc: "/placeholders/placeholder1.webp?_wi=3", imageAlt: "Sustainable practices"},
|
|
||||||
{
|
|
||||||
id: "4", title: "Customer First", description: "Exceptional support and warranty programs backed by our commitment to satisfaction.", imageSrc: "/placeholders/placeholder1.webp?_wi=4", imageAlt: "Customer focus"},
|
|
||||||
]}
|
|
||||||
gridVariant="four-items-2x2-equal-grid"
|
|
||||||
animationType="slide-up"
|
|
||||||
textboxLayout="default"
|
|
||||||
useInvertedBackground={false}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="contact-cta" data-section="contact-cta">
|
|
||||||
<ContactCTA
|
|
||||||
tag="Let's Connect"
|
|
||||||
tagIcon={Headphones}
|
|
||||||
tagAnimation="slide-up"
|
|
||||||
title="Experience the PodsX Difference"
|
|
||||||
description="Join our community of audio enthusiasts and discover why PodsX is the choice for premium wireless audio. Shop now or get in touch with our team."
|
|
||||||
buttons={[
|
|
||||||
{ text: "Shop Now", href: "/" },
|
|
||||||
{ text: "Contact Us", href: "#" },
|
|
||||||
]}
|
|
||||||
buttonAnimation="slide-up"
|
|
||||||
background={{ variant: "plain" }}
|
|
||||||
useInvertedBackground={false}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -170,7 +105,7 @@ export default function AboutPage() {
|
|||||||
{ label: "FAQ", href: "/" },
|
{ label: "FAQ", href: "/" },
|
||||||
{ label: "Setup Guide", href: "#" },
|
{ label: "Setup Guide", href: "#" },
|
||||||
{ label: "Troubleshooting", href: "#" },
|
{ label: "Troubleshooting", href: "#" },
|
||||||
{ label: "Contact Us", href: "#" },
|
{ label: "Contact Us", href: "/contact" },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@@ -190,8 +125,8 @@ export default function AboutPage() {
|
|||||||
],
|
],
|
||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
bottomLeftText="© 2025 PodsX. All rights reserved."
|
bottomLeftText="© 2025 AirPods. All rights reserved."
|
||||||
bottomRightText="Powered by Premium Audio Innovation"
|
bottomRightText="Powered by Premium Audio Technology"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
|
|||||||
@@ -3,11 +3,10 @@
|
|||||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||||||
import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
|
import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
|
||||||
import FeatureCardMedia from "@/components/sections/feature/FeatureCardMedia";
|
|
||||||
import ProductCardThree from "@/components/sections/product/ProductCardThree";
|
import ProductCardThree from "@/components/sections/product/ProductCardThree";
|
||||||
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
||||||
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
||||||
import { Zap, Sparkles, ShoppingBag, CheckCircle, AlertCircle } from "lucide-react";
|
import { Zap, ShoppingBag, Check, X } from "lucide-react";
|
||||||
|
|
||||||
export default function ComparisonPage() {
|
export default function ComparisonPage() {
|
||||||
return (
|
return (
|
||||||
@@ -29,84 +28,150 @@ export default function ComparisonPage() {
|
|||||||
navItems={[
|
navItems={[
|
||||||
{ name: "Products", id: "/" },
|
{ name: "Products", id: "/" },
|
||||||
{ name: "Features", id: "/features" },
|
{ name: "Features", id: "/features" },
|
||||||
|
{ name: "Comparison", id: "/comparison" },
|
||||||
{ name: "Why AirPods", id: "/" },
|
{ name: "Why AirPods", id: "/" },
|
||||||
{ name: "Support", id: "/" },
|
{ name: "Support", id: "/" },
|
||||||
{ name: "Compare", id: "/comparison" },
|
|
||||||
]}
|
]}
|
||||||
button={{ text: "Shop Now", href: "/#products" }}
|
button={{ text: "Shop Now", href: "#products" }}
|
||||||
animateOnLoad={true}
|
animateOnLoad={true}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="hero" data-section="hero">
|
<div id="hero" data-section="hero">
|
||||||
<HeroSplitKpi
|
<HeroSplitKpi
|
||||||
title="AirPods Pro vs AirPods 4 Comparison"
|
title="PodsX Pro vs PodsX 4 - Side by Side Comparison"
|
||||||
description="Find your perfect match. Compare detailed specifications, features, and performance between AirPods Pro and AirPods 4. Make an informed decision based on your needs."
|
description="Compare the premium PodsX Pro with advanced noise cancellation against the budget-friendly PodsX 4. Find which model best fits your needs, lifestyle, and budget."
|
||||||
background={{ variant: "plain" }}
|
background={{ variant: "plain" }}
|
||||||
kpis={[
|
kpis={[
|
||||||
{ value: "2 Models", label: "Full Comparison" },
|
{ value: "6 Hours", label: "Battery (Pro)" },
|
||||||
{ value: "20+ Specs", label: "Detailed Analysis" },
|
{ value: "30 Hours", label: "Total (with Case)" },
|
||||||
{ value: "All Features", label: "Side by Side" },
|
{ value: "IPX4", label: "Water Resistance" },
|
||||||
]}
|
]}
|
||||||
enableKpiAnimation={true}
|
enableKpiAnimation={true}
|
||||||
tag="Choose Wisely"
|
tag="Product Comparison"
|
||||||
tagIcon={Sparkles}
|
tagIcon={Zap}
|
||||||
tagAnimation="slide-up"
|
tagAnimation="slide-up"
|
||||||
buttons={[
|
buttons={[
|
||||||
{ text: "Shop AirPods Pro", href: "/#products" },
|
{ text: "Shop Pro", href: "#products" },
|
||||||
{ text: "Shop AirPods 4", href: "/#products" },
|
{ text: "Shop 4", href: "#products" },
|
||||||
]}
|
]}
|
||||||
buttonAnimation="slide-up"
|
buttonAnimation="slide-up"
|
||||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/high-quality-product-photography-of-airp-1772884351466-337fed24.png?_wi=1"
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/high-quality-product-photography-of-airp-1772884351466-337fed24.png"
|
||||||
imageAlt="AirPods Pro and AirPods 4 side by side"
|
imageAlt="PodsX Pro comparison"
|
||||||
mediaAnimation="blur-reveal"
|
mediaAnimation="blur-reveal"
|
||||||
imagePosition="right"
|
imagePosition="right"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="features" data-section="features">
|
<div id="comparison-table" data-section="comparison-table">
|
||||||
<FeatureCardMedia
|
<div className="py-20 px-6">
|
||||||
title="Detailed Feature Comparison Matrix"
|
<div className="max-w-6xl mx-auto">
|
||||||
description="Everything you need to know to choose between these two premium models."
|
<h2 className="text-4xl font-bold text-center mb-4">Detailed Specifications</h2>
|
||||||
tag="Specifications"
|
<p className="text-center text-foreground/70 mb-12 max-w-2xl mx-auto">Compare every feature side-by-side to make the right choice for your audio needs.</p>
|
||||||
tagIcon={CheckCircle}
|
|
||||||
tagAnimation="slide-up"
|
<div className="overflow-x-auto bg-card rounded-lg border border-border p-8">
|
||||||
features={[
|
<table className="w-full">
|
||||||
{
|
<thead>
|
||||||
id: "audio-quality", title: "Audio Quality & Performance", description: "AirPods Pro delivers superior audio with premium drivers, adaptive audio, and personalized spatial audio with dynamic head tracking. AirPods 4 provides excellent audio quality with AAC codec support and dynamic range optimization, perfect for everyday listening.", tag: "Audio", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/spatial-audio-visualization-showing-3d-s-1772884352783-6a2daab8.png?_wi=1", imageAlt: "Audio quality comparison visualization", buttons: [{ text: "Learn More", href: "#" }],
|
<tr className="border-b border-border">
|
||||||
},
|
<th className="text-left py-4 px-4 font-semibold text-foreground">Feature</th>
|
||||||
{
|
<th className="text-center py-4 px-4 font-semibold text-foreground">PodsX Pro</th>
|
||||||
id: "noise-control", title: "Noise Control Technologies", description: "AirPods Pro feature industry-leading active noise cancellation (up to 40dB reduction) plus transparency mode with conversation awareness. AirPods 4 offer passive noise isolation through secure fit design, making them perfect for moderate noise environments.", tag: "Comparison", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/abstract-visualization-of-active-noise-c-1772884352205-cdd837a4.png?_wi=1", imageAlt: "Noise control feature comparison", buttons: [{ text: "Explore", href: "#" }],
|
<th className="text-center py-4 px-4 font-semibold text-foreground">PodsX 4</th>
|
||||||
},
|
</tr>
|
||||||
{
|
</thead>
|
||||||
id: "battery-endurance", title: "Battery Life & Charging", description: "AirPods Pro: 6 hours per charge (30 hours total with case). AirPods 4: 5 hours per charge (24 hours total with case). Both support fast charging - 5 minutes equals up to an hour of playback. Wireless charging available on both premium models.", tag: "Battery", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/battery-charge-indicator-visualization-sh-1772884352345-a1b2c3d4.png?_wi=1", imageAlt: "Battery life comparison chart", buttons: [{ text: "Details", href: "#" }],
|
<tbody>
|
||||||
},
|
<tr className="border-b border-border hover:bg-background/50 transition">
|
||||||
]}
|
<td className="py-4 px-4 font-medium text-foreground">Price</td>
|
||||||
animationType="slide-up"
|
<td className="text-center py-4 px-4"><span className="font-bold text-primary-cta">$249</span></td>
|
||||||
textboxLayout="default"
|
<td className="text-center py-4 px-4"><span className="font-bold text-primary-cta">$149</span></td>
|
||||||
useInvertedBackground={false}
|
</tr>
|
||||||
/>
|
<tr className="border-b border-border hover:bg-background/50 transition">
|
||||||
|
<td className="py-4 px-4 font-medium text-foreground">Active Noise Cancellation</td>
|
||||||
|
<td className="text-center py-4 px-4"><Check className="inline text-green-500" size={20} /></td>
|
||||||
|
<td className="text-center py-4 px-4"><X className="inline text-red-500" size={20} /></td>
|
||||||
|
</tr>
|
||||||
|
<tr className="border-b border-border hover:bg-background/50 transition">
|
||||||
|
<td className="py-4 px-4 font-medium text-foreground">Transparency Mode</td>
|
||||||
|
<td className="text-center py-4 px-4"><Check className="inline text-green-500" size={20} /></td>
|
||||||
|
<td className="text-center py-4 px-4"><X className="inline text-red-500" size={20} /></td>
|
||||||
|
</tr>
|
||||||
|
<tr className="border-b border-border hover:bg-background/50 transition">
|
||||||
|
<td className="py-4 px-4 font-medium text-foreground">Listening Time (Per Charge)</td>
|
||||||
|
<td className="text-center py-4 px-4">6 hours</td>
|
||||||
|
<td className="text-center py-4 px-4">5 hours</td>
|
||||||
|
</tr>
|
||||||
|
<tr className="border-b border-border hover:bg-background/50 transition">
|
||||||
|
<td className="py-4 px-4 font-medium text-foreground">Total Battery (with Case)</td>
|
||||||
|
<td className="text-center py-4 px-4">30 hours</td>
|
||||||
|
<td className="text-center py-4 px-4">24 hours</td>
|
||||||
|
</tr>
|
||||||
|
<tr className="border-b border-border hover:bg-background/50 transition">
|
||||||
|
<td className="py-4 px-4 font-medium text-foreground">Spatial Audio</td>
|
||||||
|
<td className="text-center py-4 px-4"><Check className="inline text-green-500" size={20} /></td>
|
||||||
|
<td className="text-center py-4 px-4"><Check className="inline text-green-500" size={20} /></td>
|
||||||
|
</tr>
|
||||||
|
<tr className="border-b border-border hover:bg-background/50 transition">
|
||||||
|
<td className="py-4 px-4 font-medium text-foreground">Water Resistance</td>
|
||||||
|
<td className="text-center py-4 px-4">IPX4</td>
|
||||||
|
<td className="text-center py-4 px-4">IPX2</td>
|
||||||
|
</tr>
|
||||||
|
<tr className="border-b border-border hover:bg-background/50 transition">
|
||||||
|
<td className="py-4 px-4 font-medium text-foreground">Personalized Audio</td>
|
||||||
|
<td className="text-center py-4 px-4"><Check className="inline text-green-500" size={20} /></td>
|
||||||
|
<td className="text-center py-4 px-4"><Check className="inline text-green-500" size={20} /></td>
|
||||||
|
</tr>
|
||||||
|
<tr className="border-b border-border hover:bg-background/50 transition">
|
||||||
|
<td className="py-4 px-4 font-medium text-foreground">Adaptive Audio</td>
|
||||||
|
<td className="text-center py-4 px-4"><Check className="inline text-green-500" size={20} /></td>
|
||||||
|
<td className="text-center py-4 px-4"><X className="inline text-red-500" size={20} /></td>
|
||||||
|
</tr>
|
||||||
|
<tr className="border-b border-border hover:bg-background/50 transition">
|
||||||
|
<td className="py-4 px-4 font-medium text-foreground">Conversation Awareness</td>
|
||||||
|
<td className="text-center py-4 px-4"><Check className="inline text-green-500" size={20} /></td>
|
||||||
|
<td className="text-center py-4 px-4"><X className="inline text-red-500" size={20} /></td>
|
||||||
|
</tr>
|
||||||
|
<tr className="border-b border-border hover:bg-background/50 transition">
|
||||||
|
<td className="py-4 px-4 font-medium text-foreground">Automatic Device Switching</td>
|
||||||
|
<td className="text-center py-4 px-4"><Check className="inline text-green-500" size={20} /></td>
|
||||||
|
<td className="text-center py-4 px-4"><Check className="inline text-green-500" size={20} /></td>
|
||||||
|
</tr>
|
||||||
|
<tr className="border-b border-border hover:bg-background/50 transition">
|
||||||
|
<td className="py-4 px-4 font-medium text-foreground">Find My Support</td>
|
||||||
|
<td className="text-center py-4 px-4"><Check className="inline text-green-500" size={20} /></td>
|
||||||
|
<td className="text-center py-4 px-4"><Check className="inline text-green-500" size={20} /></td>
|
||||||
|
</tr>
|
||||||
|
<tr className="border-b border-border hover:bg-background/50 transition">
|
||||||
|
<td className="py-4 px-4 font-medium text-foreground">Case Charging</td>
|
||||||
|
<td className="text-center py-4 px-4">Wireless</td>
|
||||||
|
<td className="text-center py-4 px-4">USB-C</td>
|
||||||
|
</tr>
|
||||||
|
<tr className="hover:bg-background/50 transition">
|
||||||
|
<td className="py-4 px-4 font-medium text-foreground">Best For</td>
|
||||||
|
<td className="text-center py-4 px-4 text-sm">Professional Audio, All-Day Use</td>
|
||||||
|
<td className="text-center py-4 px-4 text-sm">Casual Listening, Budget-Conscious</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="products" data-section="products">
|
<div id="products" data-section="products">
|
||||||
<ProductCardThree
|
<ProductCardThree
|
||||||
title="Shop the Comparison"
|
title="Choose Your Perfect AirPods"
|
||||||
description="Compare side-by-side and choose the AirPods that fit your needs perfectly."
|
description="Both models offer exceptional audio quality. Select the one that matches your lifestyle and budget."
|
||||||
tag="Premium Models"
|
tag="Shop Collection"
|
||||||
tagIcon={ShoppingBag}
|
tagIcon={ShoppingBag}
|
||||||
tagAnimation="slide-up"
|
tagAnimation="slide-up"
|
||||||
products={[
|
products={[
|
||||||
{
|
{
|
||||||
id: "airpods-pro", name: "AirPods Pro", price: "$249", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/high-quality-product-photography-of-airp-1772884351466-337fed24.png?_wi=2", imageAlt: "AirPods Pro - Premium noise cancellation model", initialQuantity: 1,
|
id: "airpods-pro", name: "PodsX Pro", price: "$249", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/high-quality-product-photography-of-airp-1772884351466-337fed24.png", imageAlt: "PodsX Pro with active noise cancellation", initialQuantity: 1,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "airpods-4", name: "AirPods 4", price: "$129", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/airpods-2nd-generation-with-charging-cas-1772884351239-d2c575a8.png?_wi=1", imageAlt: "AirPods 4 - Standard model with excellent value", initialQuantity: 1,
|
id: "airpods-4", name: "PodsX 4", price: "$149", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/airpods-2nd-generation-with-charging-cas-1772884351239-d2c575a8.png", imageAlt: "PodsX 4 standard model", initialQuantity: 1,
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "airpods-max", name: "AirPods Max", price: "$549", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/airpods-max-over-ear-headphones-displaye-1772884352294-e666eff4.png?_wi=1", imageAlt: "AirPods Max - Premium over-ear headphones", initialQuantity: 1,
|
|
||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
gridVariant="three-columns-all-equal-width"
|
gridVariant="two-columns-alternating-heights"
|
||||||
animationType="slide-up"
|
animationType="slide-up"
|
||||||
textboxLayout="default"
|
textboxLayout="default"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
@@ -115,13 +180,13 @@ export default function ComparisonPage() {
|
|||||||
|
|
||||||
<div id="contact-cta" data-section="contact-cta">
|
<div id="contact-cta" data-section="contact-cta">
|
||||||
<ContactCTA
|
<ContactCTA
|
||||||
tag="Still Deciding?"
|
tag="Need Help Deciding?"
|
||||||
tagIcon={AlertCircle}
|
tagIcon={Zap}
|
||||||
tagAnimation="slide-up"
|
tagAnimation="slide-up"
|
||||||
title="Get Expert Guidance"
|
title="Get Expert Recommendation"
|
||||||
description="Our specialists can help you choose the perfect AirPods model for your lifestyle. Compare features, read reviews, and make your purchase with confidence."
|
description="Not sure which model is right for you? Our team can help you find the perfect AirPods based on your needs and preferences."
|
||||||
buttons={[
|
buttons={[
|
||||||
{ text: "Shop Now", href: "/#products" },
|
{ text: "Shop Now", href: "#products" },
|
||||||
{ text: "View Features", href: "/features" },
|
{ text: "View Features", href: "/features" },
|
||||||
]}
|
]}
|
||||||
buttonAnimation="slide-up"
|
buttonAnimation="slide-up"
|
||||||
@@ -135,26 +200,26 @@ export default function ComparisonPage() {
|
|||||||
columns={[
|
columns={[
|
||||||
{
|
{
|
||||||
title: "Products", items: [
|
title: "Products", items: [
|
||||||
{ label: "AirPods Pro", href: "/#products" },
|
{ label: "PodsX Pro", href: "#products" },
|
||||||
{ label: "AirPods Max", href: "/#products" },
|
{ label: "PodsX 4", href: "#products" },
|
||||||
{ label: "AirPods 4", href: "/#products" },
|
|
||||||
{ label: "Compare Models", href: "/comparison" },
|
{ label: "Compare Models", href: "/comparison" },
|
||||||
|
{ label: "View All", href: "/" },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Support", items: [
|
title: "Support", items: [
|
||||||
{ label: "FAQ", href: "/#faq" },
|
{ label: "Features", href: "/features" },
|
||||||
{ label: "Setup Guide", href: "#" },
|
{ label: "Setup Guide", href: "/" },
|
||||||
{ label: "Troubleshooting", href: "#" },
|
{ label: "FAQ", href: "/" },
|
||||||
{ label: "Contact Us", href: "/#contact-cta" },
|
{ label: "Contact Us", href: "/" },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Company", items: [
|
title: "Company", items: [
|
||||||
{ label: "About Us", href: "#" },
|
{ label: "About Us", href: "/" },
|
||||||
{ label: "Blog", href: "#" },
|
{ label: "Blog", href: "/" },
|
||||||
{ label: "Careers", href: "#" },
|
{ label: "Careers", href: "/" },
|
||||||
{ label: "News", href: "#" },
|
{ label: "News", href: "/" },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@@ -166,8 +231,8 @@ export default function ComparisonPage() {
|
|||||||
],
|
],
|
||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
bottomLeftText="© 2025 AirPods. All rights reserved."
|
bottomLeftText="© 2025 PodsX. All rights reserved."
|
||||||
bottomRightText="Powered by Premium Audio Technology"
|
bottomRightText="Premium Audio Technology"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
|
|||||||
@@ -2,37 +2,12 @@
|
|||||||
|
|
||||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||||||
|
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
||||||
import ContactFaq from "@/components/sections/contact/ContactFaq";
|
import ContactFaq from "@/components/sections/contact/ContactFaq";
|
||||||
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
||||||
import { Phone, Mail } from "lucide-react";
|
import { Phone, Mail, MapPin, MessageCircle } from "lucide-react";
|
||||||
import { useState } from "react";
|
|
||||||
|
|
||||||
export default function ContactPage() {
|
export default function ContactPage() {
|
||||||
const [formData, setFormData] = useState({
|
|
||||||
name: "", email: "", subject: "", message: ""});
|
|
||||||
const [submitted, setSubmitted] = useState(false);
|
|
||||||
|
|
||||||
const handleInputChange = (
|
|
||||||
e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>
|
|
||||||
) => {
|
|
||||||
const { name, value } = e.target;
|
|
||||||
setFormData((prev) => ({
|
|
||||||
...prev,
|
|
||||||
[name]: value,
|
|
||||||
}));
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
|
|
||||||
e.preventDefault();
|
|
||||||
// Here you would typically send the form data to a backend
|
|
||||||
console.log("Form submitted:", formData);
|
|
||||||
setSubmitted(true);
|
|
||||||
setTimeout(() => {
|
|
||||||
setFormData({ name: "", email: "", subject: "", message: "" });
|
|
||||||
setSubmitted(false);
|
|
||||||
}, 3000);
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ThemeProvider
|
<ThemeProvider
|
||||||
defaultButtonVariant="icon-arrow"
|
defaultButtonVariant="icon-arrow"
|
||||||
@@ -40,7 +15,7 @@ export default function ContactPage() {
|
|||||||
borderRadius="rounded"
|
borderRadius="rounded"
|
||||||
contentWidth="compact"
|
contentWidth="compact"
|
||||||
sizing="mediumLargeSizeMediumTitles"
|
sizing="mediumLargeSizeMediumTitles"
|
||||||
background="noise"
|
background="circleGradient"
|
||||||
cardStyle="inset"
|
cardStyle="inset"
|
||||||
primaryButtonStyle="double-inset"
|
primaryButtonStyle="double-inset"
|
||||||
secondaryButtonStyle="solid"
|
secondaryButtonStyle="solid"
|
||||||
@@ -50,154 +25,67 @@ export default function ContactPage() {
|
|||||||
<NavbarLayoutFloatingInline
|
<NavbarLayoutFloatingInline
|
||||||
brandName="AirPods"
|
brandName="AirPods"
|
||||||
navItems={[
|
navItems={[
|
||||||
{ name: "Products", id: "products" },
|
{ name: "Products", id: "/" },
|
||||||
{ name: "Features", id: "features" },
|
{ name: "Features", id: "/" },
|
||||||
{ name: "Why AirPods", id: "metrics" },
|
{ name: "Why AirPods", id: "/" },
|
||||||
{ name: "Support", id: "faq" },
|
{ name: "Support", id: "/" },
|
||||||
{ name: "Pricing", id: "pricing" },
|
{ name: "Reviews", id: "/reviews" },
|
||||||
{ name: "Contact", id: "contact" },
|
{ name: "About", id: "/about" },
|
||||||
|
{ name: "Pricing", id: "/pricing" },
|
||||||
|
{ name: "Contact", id: "/contact" },
|
||||||
]}
|
]}
|
||||||
button={{ text: "Shop Now", href: "/" }}
|
button={{ text: "Shop Now", href: "/" }}
|
||||||
animateOnLoad={true}
|
animateOnLoad={true}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="contact" data-section="contact" className="py-20">
|
<div id="contact-cta" data-section="contact-cta">
|
||||||
<div className="w-content-width mx-auto">
|
<ContactCTA
|
||||||
<div className="space-y-8">
|
tag="Get in Touch"
|
||||||
{/* Contact Information Section */}
|
tagIcon={MessageCircle}
|
||||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-8 mb-16">
|
tagAnimation="slide-up"
|
||||||
<div className="rounded-lg border border-accent/20 p-8">
|
title="Contact Our Support Team"
|
||||||
<div className="flex items-center gap-4 mb-4">
|
description="Have questions about AirPods? We're here to help with product inquiries, technical support, and customer service."
|
||||||
<div className="w-12 h-12 rounded-lg bg-primary-cta/10 flex items-center justify-center">
|
buttons={[
|
||||||
<Phone className="w-6 h-6 text-primary-cta" />
|
{ text: "Email Us", href: "mailto:support@airpods.com" },
|
||||||
</div>
|
{ text: "Live Chat", href: "/" },
|
||||||
<h3 className="text-lg font-semibold">Call Us</h3>
|
]}
|
||||||
</div>
|
buttonAnimation="slide-up"
|
||||||
<p className="text-foreground/80">+1 (800) 275-2273</p>
|
background={{ variant: "plain" }}
|
||||||
<p className="text-sm text-foreground/60 mt-2">Available Monday to Friday, 9AM to 6PM EST</p>
|
useInvertedBackground={false}
|
||||||
</div>
|
/>
|
||||||
|
|
||||||
<div className="rounded-lg border border-accent/20 p-8">
|
|
||||||
<div className="flex items-center gap-4 mb-4">
|
|
||||||
<div className="w-12 h-12 rounded-lg bg-primary-cta/10 flex items-center justify-center">
|
|
||||||
<Mail className="w-6 h-6 text-primary-cta" />
|
|
||||||
</div>
|
|
||||||
<h3 className="text-lg font-semibold">Email Us</h3>
|
|
||||||
</div>
|
|
||||||
<p className="text-foreground/80">support@airpods.com</p>
|
|
||||||
<p className="text-sm text-foreground/60 mt-2">We'll get back to you within 24 hours</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="rounded-lg border border-accent/20 p-8">
|
|
||||||
<div className="flex items-center gap-4 mb-4">
|
|
||||||
<div className="w-12 h-12 rounded-lg bg-primary-cta/10 flex items-center justify-center">
|
|
||||||
<Phone className="w-6 h-6 text-primary-cta" />
|
|
||||||
</div>
|
|
||||||
<h3 className="text-lg font-semibold">Live Chat</h3>
|
|
||||||
</div>
|
|
||||||
<p className="text-foreground/80">Chat with our support team</p>
|
|
||||||
<p className="text-sm text-foreground/60 mt-2">Available 24/7 for immediate assistance</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* Contact Form Section */}
|
|
||||||
<div className="rounded-lg border border-accent/20 p-8 md:p-12">
|
|
||||||
<h2 className="text-3xl font-bold mb-2">Send us a Message</h2>
|
|
||||||
<p className="text-foreground/70 mb-8">Have a question or feedback? Fill out the form below and we'll get back to you as soon as possible.</p>
|
|
||||||
|
|
||||||
<form onSubmit={handleSubmit} className="space-y-6">
|
|
||||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
|
||||||
<div>
|
|
||||||
<label htmlFor="name" className="block text-sm font-medium mb-2">Name</label>
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
id="name"
|
|
||||||
name="name"
|
|
||||||
value={formData.name}
|
|
||||||
onChange={handleInputChange}
|
|
||||||
required
|
|
||||||
placeholder="Your name"
|
|
||||||
className="w-full px-4 py-2 rounded-lg bg-secondary-cta/50 border border-accent/20 focus:outline-none focus:border-primary-cta"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<label htmlFor="email" className="block text-sm font-medium mb-2">Email</label>
|
|
||||||
<input
|
|
||||||
type="email"
|
|
||||||
id="email"
|
|
||||||
name="email"
|
|
||||||
value={formData.email}
|
|
||||||
onChange={handleInputChange}
|
|
||||||
required
|
|
||||||
placeholder="your@email.com"
|
|
||||||
className="w-full px-4 py-2 rounded-lg bg-secondary-cta/50 border border-accent/20 focus:outline-none focus:border-primary-cta"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<label htmlFor="subject" className="block text-sm font-medium mb-2">Subject</label>
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
id="subject"
|
|
||||||
name="subject"
|
|
||||||
value={formData.subject}
|
|
||||||
onChange={handleInputChange}
|
|
||||||
required
|
|
||||||
placeholder="How can we help?"
|
|
||||||
className="w-full px-4 py-2 rounded-lg bg-secondary-cta/50 border border-accent/20 focus:outline-none focus:border-primary-cta"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<label htmlFor="message" className="block text-sm font-medium mb-2">Message</label>
|
|
||||||
<textarea
|
|
||||||
id="message"
|
|
||||||
name="message"
|
|
||||||
value={formData.message}
|
|
||||||
onChange={handleInputChange}
|
|
||||||
required
|
|
||||||
placeholder="Tell us more..."
|
|
||||||
rows={6}
|
|
||||||
className="w-full px-4 py-2 rounded-lg bg-secondary-cta/50 border border-accent/20 focus:outline-none focus:border-primary-cta resize-none"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<button
|
|
||||||
type="submit"
|
|
||||||
className="w-full md:w-auto px-6 py-2 rounded-lg bg-primary-cta text-white font-medium hover:bg-primary-cta/90 transition"
|
|
||||||
>
|
|
||||||
{submitted ? "Message Sent!" : "Send Message"}
|
|
||||||
</button>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="faq" data-section="faq">
|
<div id="contact-faq" data-section="contact-faq">
|
||||||
<ContactFaq
|
<ContactFaq
|
||||||
faqs={[
|
faqs={[
|
||||||
{
|
{
|
||||||
id: "1", title: "What's the best way to contact support?", content: "You can reach our support team via phone at +1 (800) 275-2273, email at support@airpods.com, or through our 24/7 live chat. Choose whichever method is most convenient for you."},
|
id: "1", title: "What are your business hours?", content: "Our customer support team is available Monday to Friday, 9 AM to 6 PM EST. We also offer 24/7 online chat support through our website."
|
||||||
|
},
|
||||||
{
|
{
|
||||||
id: "2", title: "How long does it take to get a response?", content: "Phone and live chat support is available 24/7. For email inquiries, we typically respond within 24 hours during business days. We prioritize urgent matters and aim to resolve issues as quickly as possible."},
|
id: "2", title: "How quickly will I receive a response?", content: "We aim to respond to all inquiries within 24 hours. For urgent issues, please use our live chat feature for immediate assistance."
|
||||||
|
},
|
||||||
{
|
{
|
||||||
id: "3", title: "Do you offer technical support for troubleshooting?", content: "Yes, our support team is trained to help with any technical issues you may encounter with your AirPods. We can help with connectivity, audio quality, battery life, and general troubleshooting."},
|
id: "3", title: "Do you offer phone support?", content: "Yes, phone support is available for customers with active accounts. Call our support line at 1-800-AIRPODS during business hours."
|
||||||
|
},
|
||||||
{
|
{
|
||||||
id: "4", title: "What's your return and warranty policy?", content: "We offer a 30-day return policy on all products. Additionally, all AirPods come with a one-year limited warranty covering manufacturing defects. Extended coverage options are also available."},
|
id: "4", title: "Can I return my AirPods?", content: "We offer a 30-day money-back guarantee on all AirPods purchases. Please visit our returns portal or contact support for assistance."
|
||||||
|
},
|
||||||
{
|
{
|
||||||
id: "5", title: "Can I schedule a call with a specialist?", content: "Absolutely! You can schedule a call with one of our audio specialists through our website or by calling our main support line. We can provide personalized recommendations based on your needs."},
|
id: "5", title: "What about warranty coverage?", content: "All AirPods come with a 1-year limited warranty covering manufacturing defects. Extended warranty options are also available."
|
||||||
|
},
|
||||||
{
|
{
|
||||||
id: "6", title: "Do you ship internationally?", content: "Yes, we ship to most countries worldwide. Shipping times and costs vary by location. Visit our shipping policy page for more details, or contact support for specific questions about your region."},
|
id: "6", title: "How do I track my order?", content: "You can track your order using the tracking number sent to your email after purchase. Visit our orders page or contact support for details."
|
||||||
|
},
|
||||||
]}
|
]}
|
||||||
ctaTitle="Still have questions?"
|
ctaTitle="Schedule a Call"
|
||||||
ctaDescription="Let's get started with a quick consultation to find the perfect solution for your audio needs."
|
ctaDescription="Get personalized assistance from our product specialists"
|
||||||
ctaButton={{ text: "Schedule a Call", href: "#" }}
|
ctaButton={{ text: "Book a Call", href: "#" }}
|
||||||
ctaIcon={Phone}
|
ctaIcon={Phone}
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
animationType="slide-up"
|
animationType="slide-up"
|
||||||
|
accordionAnimationType="smooth"
|
||||||
|
showCard={true}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -222,8 +110,8 @@ export default function ContactPage() {
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Company", items: [
|
title: "Company", items: [
|
||||||
{ label: "About Us", href: "#" },
|
{ label: "About Us", href: "/about" },
|
||||||
{ label: "Blog", href: "#" },
|
{ label: "Reviews", href: "/reviews" },
|
||||||
{ label: "Careers", href: "#" },
|
{ label: "Careers", href: "#" },
|
||||||
{ label: "News", href: "#" },
|
{ label: "News", href: "#" },
|
||||||
],
|
],
|
||||||
|
|||||||
@@ -7,7 +7,7 @@ import FeatureCardMedia from "@/components/sections/feature/FeatureCardMedia";
|
|||||||
import AboutMetric from "@/components/sections/about/AboutMetric";
|
import AboutMetric from "@/components/sections/about/AboutMetric";
|
||||||
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
||||||
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
||||||
import { Zap, Sparkles, Battery, Headphones, Volume2, Radio, Wifi } from "lucide-react";
|
import { Zap, Sparkles, Headphones, Battery, Waves, Music, Zap as ZapIcon } from "lucide-react";
|
||||||
|
|
||||||
export default function FeaturesPage() {
|
export default function FeaturesPage() {
|
||||||
return (
|
return (
|
||||||
@@ -29,57 +29,105 @@ export default function FeaturesPage() {
|
|||||||
navItems={[
|
navItems={[
|
||||||
{ name: "Products", id: "/" },
|
{ name: "Products", id: "/" },
|
||||||
{ name: "Features", id: "/features" },
|
{ name: "Features", id: "/features" },
|
||||||
|
{ name: "Comparison", id: "/comparison" },
|
||||||
{ name: "Why AirPods", id: "/" },
|
{ name: "Why AirPods", id: "/" },
|
||||||
{ name: "Support", id: "/" },
|
{ name: "Support", id: "/" },
|
||||||
{ name: "Compare", id: "/comparison" },
|
|
||||||
]}
|
]}
|
||||||
button={{ text: "Shop Now", href: "/#products" }}
|
button={{ text: "Shop Now", href: "#products" }}
|
||||||
animateOnLoad={true}
|
animateOnLoad={true}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="hero" data-section="hero">
|
<div id="hero" data-section="hero">
|
||||||
<HeroSplitKpi
|
<HeroSplitKpi
|
||||||
title="Discover AirPods Key Features"
|
title="Advanced Features Built for You"
|
||||||
description="Explore the innovative technologies that make AirPods the world's most advanced wireless audio experience. From noise cancellation to seamless connectivity."
|
description="Discover the cutting-edge technology that powers AirPods Pro and AirPods Max. From intelligent noise control to immersive spatial audio, experience audio innovation at its finest."
|
||||||
background={{ variant: "plain" }}
|
background={{ variant: "plain" }}
|
||||||
kpis={[
|
kpis={[
|
||||||
{ value: "Active", label: "Noise Cancellation" },
|
{ value: "30+ Hours", label: "Total Battery" },
|
||||||
{ value: "Spatial", label: "3D Audio" },
|
{ value: "Adaptive", label: "Noise Control" },
|
||||||
{ value: "Instant", label: "Device Switching" },
|
{ value: "360°", label: "Spatial Audio" },
|
||||||
]}
|
]}
|
||||||
enableKpiAnimation={true}
|
enableKpiAnimation={true}
|
||||||
tag="Innovation at Work"
|
tag="Feature Deep Dive"
|
||||||
tagIcon={Sparkles}
|
tagIcon={Sparkles}
|
||||||
tagAnimation="slide-up"
|
tagAnimation="slide-up"
|
||||||
buttons={[
|
buttons={[
|
||||||
{ text: "Explore All Products", href: "/#products" },
|
{ text: "Shop Now", href: "/" },
|
||||||
{ text: "Compare Models", href: "/comparison" },
|
{ text: "Back Home", href: "/" },
|
||||||
]}
|
]}
|
||||||
buttonAnimation="slide-up"
|
buttonAnimation="slide-up"
|
||||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/a-sleek-premium-product-shot-of-airpods--1772884352155-5b47d23f.png?_wi=1"
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/a-sleek-premium-product-shot-of-airpods--1772884352155-5b47d23f.png"
|
||||||
imageAlt="AirPods Pro premium features showcase"
|
imageAlt="AirPods Pro with premium charging case"
|
||||||
mediaAnimation="blur-reveal"
|
mediaAnimation="blur-reveal"
|
||||||
imagePosition="right"
|
imagePosition="right"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="features" data-section="features">
|
<div id="noise-cancellation" data-section="features-noise">
|
||||||
<FeatureCardMedia
|
<FeatureCardMedia
|
||||||
title="Signature AirPods Technologies"
|
title="Noise Cancellation Excellence"
|
||||||
description="Experience the cutting-edge features that define premium wireless audio."
|
description="Experience advanced active noise cancellation that learns and adapts to your environment."
|
||||||
tag="Core Technologies"
|
tag="Core Technology"
|
||||||
tagIcon={Zap}
|
tagIcon={Zap}
|
||||||
tagAnimation="slide-up"
|
tagAnimation="slide-up"
|
||||||
features={[
|
features={[
|
||||||
{
|
{
|
||||||
id: "noise-cancellation", title: "Active Noise Cancellation (ANC)", description: "Industry-leading active noise cancellation uses outward and inward microphones to detect and cancel unwanted sound. Adapts to your environment in real time, blocking background noise while letting important sounds through.", tag: "Pro Feature", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/abstract-visualization-of-active-noise-c-1772884352205-cdd837a4.png?_wi=2", imageAlt: "Active noise cancellation visualization", buttons: [{ text: "Learn More", href: "#" }],
|
id: "anc-adaptive", title: "Adaptive Audio Intelligence", description: "Our advanced algorithms analyze ambient sound patterns in real-time. AirPods Pro automatically adjusts noise cancellation strength based on your environment, whether you're in a bustling airport, quiet office, or moving between locations.", tag: "Pro Feature", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/abstract-visualization-of-active-noise-c-1772884352205-cdd837a4.png", imageAlt: "Adaptive noise cancellation visualization", buttons: [{ text: "Learn More", href: "#" }],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "battery-life", title: "Extended Battery Life", description: "Get up to 6 hours of listening time on a single charge with AirPods Pro, extending to 30 hours with the wireless charging case. Smart power management ensures you stay connected all day. Fast charging gives you 5 minutes of listening in just 5 minutes of charging.", tag: "All Day Power", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/battery-charge-indicator-visualization-sh-1772884352345-a1b2c3d4.png?_wi=2", imageAlt: "Battery life indicator", buttons: [{ text: "See Details", href: "#" }],
|
id: "transparency-mode", title: "Transparency Mode", description: "Stay aware of your surroundings when you need to. Transparency mode lets ambient sounds through so you can hear announcements, conversations, and environmental audio while still enjoying your music or calls at optimal levels.", tag: "Smart Feature", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/spatial-audio-visualization-showing-3d-s-1772884352783-6a2daab8.png", imageAlt: "Transparency mode feature", buttons: [{ text: "Discover", href: "#" }],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "immersive-sound", title: "Immersive Sound Experience", description: "Premium audio drivers deliver crisp, clear highs and deep, controlled bass. Personalized spatial audio with dynamic head tracking creates a theater-like surround sound experience. Adaptive Audio intelligently blends your music with helpful ambient sounds.", tag: "Premium Audio", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/spatial-audio-visualization-showing-3d-s-1772884352783-6a2daab8.png?_wi=2", imageAlt: "Immersive spatial audio visualization", buttons: [{ text: "Experience It", href: "#" }],
|
id: "conversation-awareness", title: "Conversation Awareness", description: "Automatically detect when you're speaking to someone and lower music volume while activating transparency mode. Continue your conversation naturally without removing your AirPods. Perfect for quick interactions while staying immersed in your content.", tag: "Intelligent", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/apple-ecosystem-integration-showing-ipho-1772884352656-6d2f7cb3.png", imageAlt: "Conversation awareness illustration", buttons: [{ text: "Experience", href: "#" }],
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
animationType="slide-up"
|
||||||
|
textboxLayout="default"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="battery-life" data-section="features-battery">
|
||||||
|
<FeatureCardMedia
|
||||||
|
title="Extended Battery Performance"
|
||||||
|
description="Power that keeps up with your lifestyle - all day listening with intelligent battery management."
|
||||||
|
tag="Power & Performance"
|
||||||
|
tagIcon={Battery}
|
||||||
|
tagAnimation="slide-up"
|
||||||
|
features={[
|
||||||
|
{
|
||||||
|
id: "battery-duration", title: "All-Day Battery Life", description: "AirPods Pro deliver up to 6 hours of listening time per charge, with 30 hours total using the charging case. AirPods Max provide up to 20 hours per charge. Intelligent power management optimizes battery based on your usage patterns and audio settings.", tag: "Extended", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/abstract-visualization-of-active-noise-c-1772884352205-cdd837a4.png", imageAlt: "Battery performance chart", buttons: [{ text: "View Specs", href: "#" }],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "fast-charging", title: "Fast Charging Technology", description: "Get back in the action quickly with our optimized charging system. Just 15 minutes of charging provides up to 1 hour of listening time. The wireless charging case uses advanced power management to maximize battery health over the device's lifetime.", tag: "Quick Charge", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/spatial-audio-visualization-showing-3d-s-1772884352783-6a2daab8.png", imageAlt: "Fast charging capability", buttons: [{ text: "Compare", href: "#" }],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "battery-health", title: "Battery Health Monitoring", description: "Track your AirPods battery status in real-time through the iOS battery widget. Receive automatic notifications when battery is low. Our smart battery conditioning helps maintain longevity and performance, keeping your AirPods performing optimally for years.", tag: "Smart Monitoring", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/apple-ecosystem-integration-showing-ipho-1772884352656-6d2f7cb3.png", imageAlt: "Battery health interface", buttons: [{ text: "Learn More", href: "#" }],
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
animationType="slide-up"
|
||||||
|
textboxLayout="default"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="immersive-sound" data-section="features-sound">
|
||||||
|
<FeatureCardMedia
|
||||||
|
title="Immersive Sound Experience"
|
||||||
|
description="Premium audio quality with spatial rendering and personalized audio tuning."
|
||||||
|
tag="Audio Technology"
|
||||||
|
tagIcon={Music}
|
||||||
|
tagAnimation="slide-up"
|
||||||
|
features={[
|
||||||
|
{
|
||||||
|
id: "spatial-audio-feature", title: "Spatial Audio with Dynamic Head Tracking", description: "Experience cinema-like spatial audio that places sound around you in three-dimensional space. Dynamic head tracking follows your movement, making it feel like sound sources stay positioned in the room. Perfect for movies, music, and gaming with compatible content.", tag: "Immersive", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/abstract-visualization-of-active-noise-c-1772884352205-cdd837a4.png", imageAlt: "Spatial audio 3D visualization", buttons: [{ text: "Experience", href: "#" }],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "audio-personalization", title: "Personalized Audio & Volume", description: "AirPods automatically adjust audio personalization based on your hearing capabilities and preferences. Custom eq settings enhance bass, mids, and treble to match your unique audio preferences. Adaptive audio adjusts volume intelligently based on ambient noise levels.", tag: "Personal", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/spatial-audio-visualization-showing-3d-s-1772884352783-6a2daab8.png", imageAlt: "Audio personalization settings", buttons: [{ text: "Customize", href: "#" }],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "quality-codec", title: "Premium Audio Codec & Drivers", description: "Our advanced H1 and H2 chips process audio with minimal latency. Custom-engineered acoustic design combined with premium speaker drivers delivers rich, detailed sound across all frequencies. Whether streaming music or taking calls, experience superior audio clarity.", tag: "Technical", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/apple-ecosystem-integration-showing-ipho-1772884352656-6d2f7cb3.png", imageAlt: "Audio codec technology", buttons: [{ text: "Explore", href: "#" }],
|
||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
animationType="slide-up"
|
animationType="slide-up"
|
||||||
@@ -90,12 +138,12 @@ export default function FeaturesPage() {
|
|||||||
|
|
||||||
<div id="metrics" data-section="metrics">
|
<div id="metrics" data-section="metrics">
|
||||||
<AboutMetric
|
<AboutMetric
|
||||||
title="Performance Metrics That Matter"
|
title="Feature Specifications That Matter"
|
||||||
metrics={[
|
metrics={[
|
||||||
{ icon: Battery, label: "Maximum Battery", value: "30 Hours" },
|
{ icon: Battery, label: "Maximum Battery Life", value: "30+ Hours" },
|
||||||
{ icon: Radio, label: "Bluetooth Range", value: "10+ Meters" },
|
{ icon: Waves, label: "Noise Cancellation Levels", value: "Multi-Stage" },
|
||||||
{ icon: Volume2, label: "Noise Reduction", value: "Up to 40dB" },
|
{ icon: Headphones, label: "Audio Modes", value: "4+ Modes" },
|
||||||
{ icon: Wifi, label: "Seamless Pairing", value: "All Apple Devices" },
|
{ icon: ZapIcon, label: "Setup Time", value: "Instant" },
|
||||||
]}
|
]}
|
||||||
metricsAnimation="slide-up"
|
metricsAnimation="slide-up"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
@@ -104,14 +152,14 @@ export default function FeaturesPage() {
|
|||||||
|
|
||||||
<div id="contact-cta" data-section="contact-cta">
|
<div id="contact-cta" data-section="contact-cta">
|
||||||
<ContactCTA
|
<ContactCTA
|
||||||
tag="Experience the Difference"
|
tag="Ready to Experience?"
|
||||||
tagIcon={Headphones}
|
tagIcon={Headphones}
|
||||||
tagAnimation="slide-up"
|
tagAnimation="slide-up"
|
||||||
title="Ready to Upgrade Your Audio?"
|
title="Discover Premium Audio Innovation"
|
||||||
description="Discover which AirPods model is perfect for your lifestyle. Compare features, read expert reviews, and find your ideal match."
|
description="All these advanced features come together in AirPods Pro and AirPods Max. Find the perfect model for your lifestyle and experience the difference."
|
||||||
buttons={[
|
buttons={[
|
||||||
{ text: "Shop Now", href: "/#products" },
|
{ text: "Shop AirPods Pro", href: "/" },
|
||||||
{ text: "Compare Models", href: "/comparison" },
|
{ text: "View Comparison", href: "/comparison" },
|
||||||
]}
|
]}
|
||||||
buttonAnimation="slide-up"
|
buttonAnimation="slide-up"
|
||||||
background={{ variant: "plain" }}
|
background={{ variant: "plain" }}
|
||||||
@@ -124,26 +172,26 @@ export default function FeaturesPage() {
|
|||||||
columns={[
|
columns={[
|
||||||
{
|
{
|
||||||
title: "Products", items: [
|
title: "Products", items: [
|
||||||
{ label: "AirPods Pro", href: "/#products" },
|
{ label: "AirPods Pro", href: "/" },
|
||||||
{ label: "AirPods Max", href: "/#products" },
|
{ label: "AirPods Max", href: "/" },
|
||||||
{ label: "AirPods (2nd Gen)", href: "/#products" },
|
{ label: "AirPods (2nd Gen)", href: "/" },
|
||||||
{ label: "Compare Models", href: "/comparison" },
|
{ label: "Compare Models", href: "/comparison" },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Support", items: [
|
title: "Features", items: [
|
||||||
{ label: "FAQ", href: "/#faq" },
|
{ label: "Noise Cancellation", href: "#noise-cancellation" },
|
||||||
{ label: "Setup Guide", href: "#" },
|
{ label: "Battery Life", href: "#battery-life" },
|
||||||
{ label: "Troubleshooting", href: "#" },
|
{ label: "Sound Quality", href: "#immersive-sound" },
|
||||||
{ label: "Contact Us", href: "/#contact-cta" },
|
{ label: "Ecosystem", href: "/" },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Company", items: [
|
title: "Support", items: [
|
||||||
{ label: "About Us", href: "#" },
|
{ label: "Setup Guide", href: "/" },
|
||||||
{ label: "Blog", href: "#" },
|
{ label: "FAQ", href: "/" },
|
||||||
{ label: "Careers", href: "#" },
|
{ label: "Troubleshooting", href: "/" },
|
||||||
{ label: "News", href: "#" },
|
{ label: "Contact Us", href: "/" },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -1,49 +1,25 @@
|
|||||||
import type { Metadata } from "next";
|
import type { Metadata } from "next";
|
||||||
import { Mulish } from "next/font/google";
|
|
||||||
import { Inter } from "next/font/google";
|
import { Inter } from "next/font/google";
|
||||||
import "./globals.css";
|
import "./globals.css";
|
||||||
import { ServiceWrapper } from "@/components/ServiceWrapper";
|
|
||||||
import Tag from "@/tag/Tag";
|
|
||||||
|
|
||||||
const mulish = Mulish({
|
|
||||||
variable: "--font-mulish", subsets: ["latin"],
|
|
||||||
});
|
|
||||||
|
|
||||||
const inter = Inter({
|
const inter = Inter({
|
||||||
variable: "--font-inter", subsets: ["latin"],
|
variable: "--font-inter", subsets: ["latin"],
|
||||||
|
weight: ["100", "200", "300", "400", "500", "600", "700", "800", "900"],
|
||||||
});
|
});
|
||||||
|
|
||||||
export const metadata: Metadata = {
|
export const metadata: Metadata = {
|
||||||
title: "AirPods - Premium Wireless Audio Experience", description: "Discover AirPods Pro, Max, and more. Premium wireless audio with active noise cancellation, spatial audio, and seamless Apple ecosystem integration.", keywords: "AirPods, wireless earbuds, premium audio, active noise cancellation, spatial audio, Apple audio", robots: {
|
title: "PodsX - Premium Wireless Audio", description: "Experience the future of wireless audio with PodsX. Premium sound, seamless connectivity, and industry-leading features."};
|
||||||
index: true,
|
|
||||||
follow: true,
|
|
||||||
},
|
|
||||||
openGraph: {
|
|
||||||
title: "AirPods - Premium Wireless Audio Experience", description: "Experience the next generation of wireless audio with AirPods. Premium sound, instant setup, and seamless connectivity.", siteName: "AirPods", type: "website", images: [
|
|
||||||
{
|
|
||||||
url: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/a-sleek-premium-product-shot-of-airpods--1772884352155-5b47d23f.png", alt: "AirPods Pro Premium Audio"},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
twitter: {
|
|
||||||
card: "summary_large_image", title: "AirPods - Premium Wireless Audio", description: "Discover AirPods Pro, Max, and more. Premium audio experience starts here.", images: [
|
|
||||||
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/a-sleek-premium-product-shot-of-airpods--1772884352155-5b47d23f.png"],
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
||||||
export default function RootLayout({
|
export default function RootLayout({
|
||||||
children,
|
children,
|
||||||
}: Readonly<{
|
}: {
|
||||||
children: React.ReactNode;
|
children: React.ReactNode;
|
||||||
}>) {
|
}) {
|
||||||
return (
|
return (
|
||||||
<html lang="en" suppressHydrationWarning>
|
<html lang="en">
|
||||||
<ServiceWrapper>
|
<body className={`${inter.variable} antialiased`}>
|
||||||
<body
|
{children}
|
||||||
className={`${mulish.variable} ${inter.variable} antialiased`}
|
|
||||||
>
|
|
||||||
<Tag />
|
|
||||||
{children}
|
|
||||||
|
|
||||||
<script
|
<script
|
||||||
dangerouslySetInnerHTML={{
|
dangerouslySetInnerHTML={{
|
||||||
__html: `
|
__html: `
|
||||||
@@ -1411,7 +1387,6 @@ export default function RootLayout({
|
|||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</body>
|
</body>
|
||||||
</ServiceWrapper>
|
|
||||||
</html>
|
</html>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -16,15 +16,15 @@ import { Zap, Sparkles, ShoppingBag, Battery, Globe, Volume2, Award, Headphones,
|
|||||||
export default function LandingPage() {
|
export default function LandingPage() {
|
||||||
return (
|
return (
|
||||||
<ThemeProvider
|
<ThemeProvider
|
||||||
defaultButtonVariant="hover-bubble"
|
defaultButtonVariant="icon-arrow"
|
||||||
defaultTextAnimation="entrance-slide"
|
defaultTextAnimation="entrance-slide"
|
||||||
borderRadius="rounded"
|
borderRadius="rounded"
|
||||||
contentWidth="medium"
|
contentWidth="compact"
|
||||||
sizing="mediumSizeLargeTitles"
|
sizing="mediumLargeSizeMediumTitles"
|
||||||
background="none"
|
background="circleGradient"
|
||||||
cardStyle="glass-elevated"
|
cardStyle="inset"
|
||||||
primaryButtonStyle="gradient"
|
primaryButtonStyle="double-inset"
|
||||||
secondaryButtonStyle="glass"
|
secondaryButtonStyle="solid"
|
||||||
headingFontWeight="bold"
|
headingFontWeight="bold"
|
||||||
>
|
>
|
||||||
<div id="nav" data-section="nav">
|
<div id="nav" data-section="nav">
|
||||||
@@ -35,6 +35,10 @@ export default function LandingPage() {
|
|||||||
{ name: "Features", id: "features" },
|
{ name: "Features", id: "features" },
|
||||||
{ name: "Why AirPods", id: "metrics" },
|
{ name: "Why AirPods", id: "metrics" },
|
||||||
{ name: "Support", id: "faq" },
|
{ name: "Support", id: "faq" },
|
||||||
|
{ name: "Reviews", id: "/reviews" },
|
||||||
|
{ name: "About", id: "/about" },
|
||||||
|
{ name: "Pricing", id: "/pricing" },
|
||||||
|
{ name: "Contact", id: "/contact" },
|
||||||
]}
|
]}
|
||||||
button={{ text: "Shop Now", href: "#products" }}
|
button={{ text: "Shop Now", href: "#products" }}
|
||||||
animateOnLoad={true}
|
animateOnLoad={true}
|
||||||
@@ -138,9 +142,11 @@ export default function LandingPage() {
|
|||||||
tagIcon={Award}
|
tagIcon={Award}
|
||||||
tagAnimation="slide-up"
|
tagAnimation="slide-up"
|
||||||
names={[
|
names={[
|
||||||
"Apple Music", "Spotify", "Apple", "Beats", "Shure", "Sennheiser", "Bose"]}
|
"Apple Music", "Spotify", "Apple", "Beats", "Shure", "Sennheiser", "Bose"
|
||||||
|
]}
|
||||||
logos={[
|
logos={[
|
||||||
"http://img.b2bpic.net/free-photo/top-view-apples-around-frame-white-background-with-copy-space_141793-11956.jpg", "http://img.b2bpic.net/free-vector/flat-design-minimal-music-festival-youtube-channel-art_23-2149155264.jpg", "http://img.b2bpic.net/free-vector/set-retro-music-stickers_23-2147592207.jpg", "http://img.b2bpic.net/free-vector/music-festival-logo-collection-with-flat-design_23-2147825729.jpg", "http://img.b2bpic.net/free-vector/gradient-colored-dj-logo-set_23-2148874408.jpg", "http://img.b2bpic.net/free-vector/flat-design-dj-logo-collection_23-2148872847.jpg", "http://img.b2bpic.net/free-vector/neumorph-business-card_52683-59098.jpg"]}
|
"http://img.b2bpic.net/free-photo/top-view-apples-around-frame-white-background-with-copy-space_141793-11956.jpg", "http://img.b2bpic.net/free-vector/flat-design-minimal-music-festival-youtube-channel-art_23-2149155264.jpg", "http://img.b2bpic.net/free-vector/set-retro-music-stickers_23-2147592207.jpg", "http://img.b2bpic.net/free-vector/music-festival-logo-collection-with-flat-design_23-2147825729.jpg", "http://img.b2bpic.net/free-vector/gradient-colored-dj-logo-set_23-2148874408.jpg", "http://img.b2bpic.net/free-vector/flat-design-dj-logo-collection_23-2148872847.jpg", "http://img.b2bpic.net/free-vector/neumorph-business-card_52683-59098.jpg"
|
||||||
|
]}
|
||||||
textboxLayout="default"
|
textboxLayout="default"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
speed={40}
|
speed={40}
|
||||||
@@ -155,17 +161,23 @@ export default function LandingPage() {
|
|||||||
author="Sarah Chen, Audio Engineer"
|
author="Sarah Chen, Audio Engineer"
|
||||||
avatars={[
|
avatars={[
|
||||||
{
|
{
|
||||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/professional-headshot-of-a-satisfied-use-1772884351817-6dec7f08.png", alt: "Sarah Chen"},
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/professional-headshot-of-a-satisfied-use-1772884351817-6dec7f08.png", alt: "Sarah Chen"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/happy-lifestyle-photo-of-person-wearing--1772884353901-6ee88695.png", alt: "Customer 2"},
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/happy-lifestyle-photo-of-person-wearing--1772884353901-6ee88695.png", alt: "Customer 2"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/professional-businessperson-using-airpod-1772884353609-0ef52970.png", alt: "Customer 3"},
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/professional-businessperson-using-airpod-1772884353609-0ef52970.png", alt: "Customer 3"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/creative-professional-or-content-creator-1772884352345-f1e1d55c.png", alt: "Customer 4"},
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/creative-professional-or-content-creator-1772884352345-f1e1d55c.png", alt: "Customer 4"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/active-lifestyle-user-athlete-or-fitness-1772884351718-1b549457.png", alt: "Customer 5"},
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/active-lifestyle-user-athlete-or-fitness-1772884351718-1b549457.png", alt: "Customer 5"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/diverse-user-in-relaxed-comfortable-sett-1772884352272-d4dc5302.png", alt: "Customer 6"},
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/diverse-user-in-relaxed-comfortable-sett-1772884352272-d4dc5302.png", alt: "Customer 6"
|
||||||
|
},
|
||||||
]}
|
]}
|
||||||
ratingAnimation="slide-up"
|
ratingAnimation="slide-up"
|
||||||
avatarsAnimation="slide-up"
|
avatarsAnimation="slide-up"
|
||||||
@@ -182,17 +194,23 @@ export default function LandingPage() {
|
|||||||
tagAnimation="slide-up"
|
tagAnimation="slide-up"
|
||||||
faqs={[
|
faqs={[
|
||||||
{
|
{
|
||||||
id: "1", title: "How do I set up my AirPods?", content: "Simply bring your AirPods near your iPhone, iPad, Mac, or Apple Watch. A setup screen will appear automatically. Tap 'Connect' and follow the on-screen instructions. Your AirPods will automatically connect to all your Apple devices through your iCloud account."},
|
id: "1", title: "How do I set up my AirPods?", content: "Simply bring your AirPods near your iPhone, iPad, Mac, or Apple Watch. A setup screen will appear automatically. Tap 'Connect' and follow the on-screen instructions. Your AirPods will automatically connect to all your Apple devices through your iCloud account."
|
||||||
|
},
|
||||||
{
|
{
|
||||||
id: "2", title: "What's the battery life?", content: "AirPods Pro offer up to 6 hours of listening time or 30 hours with the charging case. AirPods (2nd generation) provide up to 5 hours of listening time or 24 hours with the case. Battery life varies based on listening volume and active features used."},
|
id: "2", title: "What's the battery life?", content: "AirPods Pro offer up to 6 hours of listening time or 30 hours with the charging case. AirPods (2nd generation) provide up to 5 hours of listening time or 24 hours with the case. Battery life varies based on listening volume and active features used."
|
||||||
|
},
|
||||||
{
|
{
|
||||||
id: "3", title: "Are AirPods water resistant?", content: "AirPods Pro are water and sweat resistant (IPX4). They can withstand splashes, rain, and sweat during workouts. However, they're not designed for swimming or submersion in water. AirPods (2nd generation) are not water resistant."},
|
id: "3", title: "Are AirPods water resistant?", content: "AirPods Pro are water and sweat resistant (IPX4). They can withstand splashes, rain, and sweat during workouts. However, they're not designed for swimming or submersion in water. AirPods (2nd generation) are not water resistant."
|
||||||
|
},
|
||||||
{
|
{
|
||||||
id: "4", title: "Can I use AirPods with Android?", content: "Yes, AirPods can connect to Android devices via Bluetooth. However, you won't have access to some features like easy setup, automatic switching between devices, or Siri integration. For the best experience, we recommend using AirPods with Apple devices."},
|
id: "4", title: "Can I use AirPods with Android?", content: "Yes, AirPods can connect to Android devices via Bluetooth. However, you won't have access to some features like easy setup, automatic switching between devices, or Siri integration. For the best experience, we recommend using AirPods with Apple devices."
|
||||||
|
},
|
||||||
{
|
{
|
||||||
id: "5", title: "Do AirPods work with Windows?", content: "Yes, AirPods can pair with Windows PCs and laptops via Bluetooth. Simply put your AirPods in pairing mode and connect them through your Windows Bluetooth settings. Some exclusive Apple features won't be available on Windows."},
|
id: "5", title: "Do AirPods work with Windows?", content: "Yes, AirPods can pair with Windows PCs and laptops via Bluetooth. Simply put your AirPods in pairing mode and connect them through your Windows Bluetooth settings. Some exclusive Apple features won't be available on Windows."
|
||||||
|
},
|
||||||
{
|
{
|
||||||
id: "6", title: "What if I lose one AirPod?", content: "You can purchase replacement AirPods individually from Apple's website or authorized retailers. Visit apple.com and select your AirPods model to order a replacement earbud or charging case."},
|
id: "6", title: "What if I lose one AirPod?", content: "You can purchase replacement AirPods individually from Apple's website or authorized retailers. Visit apple.com and select your AirPods model to order a replacement earbud or charging case."
|
||||||
|
},
|
||||||
]}
|
]}
|
||||||
textboxLayout="default"
|
textboxLayout="default"
|
||||||
faqsAnimation="slide-up"
|
faqsAnimation="slide-up"
|
||||||
@@ -234,13 +252,13 @@ export default function LandingPage() {
|
|||||||
{ label: "FAQ", href: "#faq" },
|
{ label: "FAQ", href: "#faq" },
|
||||||
{ label: "Setup Guide", href: "#" },
|
{ label: "Setup Guide", href: "#" },
|
||||||
{ label: "Troubleshooting", href: "#" },
|
{ label: "Troubleshooting", href: "#" },
|
||||||
{ label: "Contact Us", href: "#contact-cta" },
|
{ label: "Contact Us", href: "/contact" },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Company", items: [
|
title: "Company", items: [
|
||||||
{ label: "About Us", href: "#" },
|
{ label: "About Us", href: "/about" },
|
||||||
{ label: "Blog", href: "#" },
|
{ label: "Reviews", href: "/reviews" },
|
||||||
{ label: "Careers", href: "#" },
|
{ label: "Careers", href: "#" },
|
||||||
{ label: "News", href: "#" },
|
{ label: "News", href: "#" },
|
||||||
],
|
],
|
||||||
|
|||||||
209
src/app/podsx-4/page.tsx
Normal file
209
src/app/podsx-4/page.tsx
Normal file
@@ -0,0 +1,209 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
|
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||||||
|
import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
|
||||||
|
import FeatureCardMedia from "@/components/sections/feature/FeatureCardMedia";
|
||||||
|
import ProductCardThree from "@/components/sections/product/ProductCardThree";
|
||||||
|
import FaqDouble from "@/components/sections/faq/FaqDouble";
|
||||||
|
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
||||||
|
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
||||||
|
import { Zap, Sparkles, ShoppingBag, Headphones, HelpCircle } from "lucide-react";
|
||||||
|
|
||||||
|
export default function PodsX4Page() {
|
||||||
|
return (
|
||||||
|
<ThemeProvider
|
||||||
|
defaultButtonVariant="icon-arrow"
|
||||||
|
defaultTextAnimation="entrance-slide"
|
||||||
|
borderRadius="rounded"
|
||||||
|
contentWidth="compact"
|
||||||
|
sizing="mediumLargeSizeMediumTitles"
|
||||||
|
background="circleGradient"
|
||||||
|
cardStyle="inset"
|
||||||
|
primaryButtonStyle="double-inset"
|
||||||
|
secondaryButtonStyle="solid"
|
||||||
|
headingFontWeight="bold"
|
||||||
|
>
|
||||||
|
<div id="nav" data-section="nav">
|
||||||
|
<NavbarLayoutFloatingInline
|
||||||
|
brandName="AirPods"
|
||||||
|
navItems={[
|
||||||
|
{ name: "Home", id: "/" },
|
||||||
|
{ name: "Products", id: "#products" },
|
||||||
|
{ name: "Features", id: "#features" },
|
||||||
|
{ name: "PodsX Pro", id: "/podsx-pro" },
|
||||||
|
]}
|
||||||
|
button={{ text: "Buy Now", href: "#cta" }}
|
||||||
|
animateOnLoad={true}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="hero" data-section="hero">
|
||||||
|
<HeroSplitKpi
|
||||||
|
title="PodsX 4 - Advanced Audio Excellence"
|
||||||
|
description="The next generation of wireless audio technology. Featuring intelligent noise management, crystal-clear audio, and all-day battery life. Designed for modern users who demand performance and value."
|
||||||
|
background={{ variant: "plain" }}
|
||||||
|
kpis={[
|
||||||
|
{ value: "8 Hours", label: "Battery Per Charge" },
|
||||||
|
{ value: "Smart", label: "Noise Control" },
|
||||||
|
{ value: "Crystal Clear", label: "Audio" },
|
||||||
|
]}
|
||||||
|
enableKpiAnimation={true}
|
||||||
|
tag="Next-Generation Audio Technology"
|
||||||
|
tagIcon={Zap}
|
||||||
|
tagAnimation="slide-up"
|
||||||
|
buttons={[
|
||||||
|
{ text: "Buy PodsX 4", href: "#products" },
|
||||||
|
{ text: "Specifications", href: "#features" },
|
||||||
|
]}
|
||||||
|
buttonAnimation="slide-up"
|
||||||
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/airpods-2nd-generation-with-charging-cas-1772884351239-d2c575a8.png"
|
||||||
|
imageAlt="PodsX 4 Advanced Wireless Earbuds"
|
||||||
|
mediaAnimation="blur-reveal"
|
||||||
|
imagePosition="right"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="features" data-section="features">
|
||||||
|
<FeatureCardMedia
|
||||||
|
title="Smart Technology Meets Audio Quality"
|
||||||
|
description="Discover the intelligent features that make PodsX 4 the perfect choice for everyday audio."
|
||||||
|
tag="Smart Features"
|
||||||
|
tagIcon={Sparkles}
|
||||||
|
tagAnimation="slide-up"
|
||||||
|
features={[
|
||||||
|
{
|
||||||
|
id: "smart-anc", title: "Intelligent Noise Management", description: "Smart active noise cancellation that intelligently manages ambient sound. Choose between passive transparency and active cancellation, or let the earbuds decide based on your activity.", tag: "PodsX 4", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/abstract-visualization-of-active-noise-c-1772884352205-cdd837a4.png", imageAlt: "Intelligent noise management", buttons: [{ text: "Learn More", href: "#" }],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "premium-sound", title: "Premium Audio Drivers", description: "Custom-engineered audio drivers deliver rich, balanced sound across all frequencies. Experience deep bass, clear mids, and pristine highs in every note.", tag: "Premium", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/spatial-audio-visualization-showing-3d-s-1772884352783-6a2daab8.png", imageAlt: "Premium audio drivers", buttons: [{ text: "Explore", href: "#" }],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "all-day", title: "All-Day Audio Experience", description: "8 hours of listening per charge with the case providing 40+ hours total. Built for the full day—work, commute, workout, and beyond.", tag: "Long-lasting", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/apple-ecosystem-integration-showing-ipho-1772884352656-6d2f7cb3.png", imageAlt: "All-day battery life", buttons: [{ text: "Details", href: "#" }],
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
animationType="slide-up"
|
||||||
|
textboxLayout="default"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="products" data-section="products">
|
||||||
|
<ProductCardThree
|
||||||
|
title="PodsX 4 Models & Variants"
|
||||||
|
description="Choose the perfect PodsX 4 model for your lifestyle and needs."
|
||||||
|
tag="Complete Lineup"
|
||||||
|
tagIcon={ShoppingBag}
|
||||||
|
tagAnimation="slide-up"
|
||||||
|
products={[
|
||||||
|
{
|
||||||
|
id: "podsx-4-standard", name: "PodsX 4 Standard", price: "$199", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/airpods-2nd-generation-with-charging-cas-1772884351239-d2c575a8.png", imageAlt: "PodsX 4 Standard Model", initialQuantity: 1,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "podsx-4-plus", name: "PodsX 4 Plus", price: "$299", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/high-quality-product-photography-of-airp-1772884351466-337fed24.png", imageAlt: "PodsX 4 Plus Model", initialQuantity: 1,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "podsx-4-elite", name: "PodsX 4 Elite", price: "$399", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/airpods-max-over-ear-headphones-displaye-1772884352294-e666eff4.png", imageAlt: "PodsX 4 Elite Model", initialQuantity: 1,
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
gridVariant="three-columns-all-equal-width"
|
||||||
|
animationType="slide-up"
|
||||||
|
textboxLayout="default"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="faq" data-section="faq">
|
||||||
|
<FaqDouble
|
||||||
|
title="PodsX 4 - Frequently Asked Questions"
|
||||||
|
description="Get answers to common questions about PodsX 4 features, compatibility, and specifications."
|
||||||
|
tag="Support"
|
||||||
|
tagIcon={HelpCircle}
|
||||||
|
tagAnimation="slide-up"
|
||||||
|
faqs={[
|
||||||
|
{
|
||||||
|
id: "1", title: "What are the key features of PodsX 4?", content: "PodsX 4 features intelligent noise management, premium audio drivers, 8-hour battery life per charge, 40+ hours total with case, IPX4 water resistance, and seamless multi-device connectivity. Perfect for everyday use and professional environments."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "2", title: "How long does the battery last on PodsX 4?", content: "PodsX 4 provides up to 8 hours of listening time on a single charge. With the premium charging case, you get 40+ hours of total listening time. Quick charging gives you 2 hours of listening time from just 10 minutes of charging."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "3", title: "Does PodsX 4 have active noise cancellation?", content: "Yes, PodsX 4 features intelligent noise management with adaptive ANC. You can manually switch between active cancellation, transparency mode, and off mode, or enable adaptive mode to automatically switch based on your activity and environment."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "4", title: "What's the difference between PodsX 4 models?", content: "PodsX 4 Standard: Core features with standard ANC. PodsX 4 Plus: Enhanced audio drivers and extended battery. PodsX 4 Elite: Premium materials, advanced ANC, and priority support. All models offer the same core connectivity and water resistance."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "5", title: "Are PodsX 4 water-resistant?", content: "PodsX 4 have an IPX4 rating, making them water and sweat resistant. They can handle splashes, rain, heavy sweat during workouts. However, they're not suitable for swimming or submersion in water."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "6", title: "Which devices are compatible with PodsX 4?", content: "PodsX 4 work with any Bluetooth-enabled device, including iPhones, iPads, Macs, Android phones, Windows PCs, and more. Full feature support is available on Apple devices for optimal performance."
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
textboxLayout="default"
|
||||||
|
faqsAnimation="slide-up"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
animationType="smooth"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="cta" data-section="contact-cta">
|
||||||
|
<ContactCTA
|
||||||
|
tag="Smart Audio Technology"
|
||||||
|
tagIcon={Headphones}
|
||||||
|
tagAnimation="slide-up"
|
||||||
|
title="Experience PodsX 4 Today"
|
||||||
|
description="Get intelligent noise management, premium audio quality, and all-day battery life. PodsX 4 is the perfect balance of performance and value for modern users."
|
||||||
|
buttons={[
|
||||||
|
{ text: "Buy PodsX 4 Now", href: "#products" },
|
||||||
|
{ text: "View All Models", href: "#products" },
|
||||||
|
]}
|
||||||
|
buttonAnimation="slide-up"
|
||||||
|
background={{ variant: "plain" }}
|
||||||
|
useInvertedBackground={false}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="footer" data-section="footer">
|
||||||
|
<FooterSimple
|
||||||
|
columns={[
|
||||||
|
{
|
||||||
|
title: "Products", items: [
|
||||||
|
{ label: "PodsX 4", href: "/podsx-4" },
|
||||||
|
{ label: "PodsX Pro", href: "/podsx-pro" },
|
||||||
|
{ label: "Standard AirPods", href: "/" },
|
||||||
|
{ label: "Compare All", href: "/" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Support", items: [
|
||||||
|
{ label: "Documentation", href: "#" },
|
||||||
|
{ label: "Setup Guide", href: "#" },
|
||||||
|
{ label: "Contact Support", href: "#" },
|
||||||
|
{ label: "Warranty", href: "#" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Company", items: [
|
||||||
|
{ label: "About", href: "/" },
|
||||||
|
{ label: "Blog", href: "#" },
|
||||||
|
{ label: "Press", href: "#" },
|
||||||
|
{ label: "Careers", href: "#" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Legal", items: [
|
||||||
|
{ label: "Privacy", href: "#" },
|
||||||
|
{ label: "Terms", href: "#" },
|
||||||
|
{ label: "Cookies", href: "#" },
|
||||||
|
{ label: "Warranty", href: "#" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
bottomLeftText="© 2025 PodsX 4. All rights reserved."
|
||||||
|
bottomRightText="Powered by Smart Audio Innovation"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</ThemeProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
209
src/app/podsx-pro/page.tsx
Normal file
209
src/app/podsx-pro/page.tsx
Normal file
@@ -0,0 +1,209 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
|
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||||||
|
import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
|
||||||
|
import FeatureCardMedia from "@/components/sections/feature/FeatureCardMedia";
|
||||||
|
import ProductCardThree from "@/components/sections/product/ProductCardThree";
|
||||||
|
import FaqDouble from "@/components/sections/faq/FaqDouble";
|
||||||
|
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
||||||
|
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
||||||
|
import { Zap, Sparkles, ShoppingBag, Headphones, HelpCircle, Zap as Bolt } from "lucide-react";
|
||||||
|
|
||||||
|
export default function PodsXProPage() {
|
||||||
|
return (
|
||||||
|
<ThemeProvider
|
||||||
|
defaultButtonVariant="icon-arrow"
|
||||||
|
defaultTextAnimation="entrance-slide"
|
||||||
|
borderRadius="rounded"
|
||||||
|
contentWidth="compact"
|
||||||
|
sizing="mediumLargeSizeMediumTitles"
|
||||||
|
background="circleGradient"
|
||||||
|
cardStyle="inset"
|
||||||
|
primaryButtonStyle="double-inset"
|
||||||
|
secondaryButtonStyle="solid"
|
||||||
|
headingFontWeight="bold"
|
||||||
|
>
|
||||||
|
<div id="nav" data-section="nav">
|
||||||
|
<NavbarLayoutFloatingInline
|
||||||
|
brandName="AirPods"
|
||||||
|
navItems={[
|
||||||
|
{ name: "Home", id: "/" },
|
||||||
|
{ name: "Products", id: "#products" },
|
||||||
|
{ name: "Features", id: "#features" },
|
||||||
|
{ name: "PodsX 4", id: "/podsx-4" },
|
||||||
|
]}
|
||||||
|
button={{ text: "Buy Now", href: "#cta" }}
|
||||||
|
animateOnLoad={true}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="hero" data-section="hero">
|
||||||
|
<HeroSplitKpi
|
||||||
|
title="PodsX Pro - Ultimate Performance"
|
||||||
|
description="Experience the pinnacle of audio technology with advanced active noise cancellation, extended battery life, and premium build quality. Engineered for professionals and audio enthusiasts."
|
||||||
|
background={{ variant: "plain" }}
|
||||||
|
kpis={[
|
||||||
|
{ value: "12+ Hours", label: "Battery Per Charge" },
|
||||||
|
{ value: "Advanced", label: "ANC Technology" },
|
||||||
|
{ value: "Premium", label: "Materials" },
|
||||||
|
]}
|
||||||
|
enableKpiAnimation={true}
|
||||||
|
tag="Professional Grade Audio"
|
||||||
|
tagIcon={Zap}
|
||||||
|
tagAnimation="slide-up"
|
||||||
|
buttons={[
|
||||||
|
{ text: "Buy PodsX Pro", href: "#products" },
|
||||||
|
{ text: "View Specs", href: "#features" },
|
||||||
|
]}
|
||||||
|
buttonAnimation="slide-up"
|
||||||
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/high-quality-product-photography-of-airp-1772884351466-337fed24.png"
|
||||||
|
imageAlt="PodsX Pro Premium Wireless Earbuds"
|
||||||
|
mediaAnimation="blur-reveal"
|
||||||
|
imagePosition="right"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="features" data-section="features">
|
||||||
|
<FeatureCardMedia
|
||||||
|
title="Premium Features Built For Professionals"
|
||||||
|
description="Discover what makes PodsX Pro the choice for serious audio professionals and demanding users."
|
||||||
|
tag="Technical Excellence"
|
||||||
|
tagIcon={Sparkles}
|
||||||
|
tagAnimation="slide-up"
|
||||||
|
features={[
|
||||||
|
{
|
||||||
|
id: "anc-pro", title: "Advanced Adaptive ANC", description: "Industry-leading active noise cancellation that learns your environment and adapts in real-time. Perfect isolation for focused work and travel.", tag: "PodsX Pro", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/abstract-visualization-of-active-noise-c-1772884352205-cdd837a4.png", imageAlt: "Advanced noise cancellation", buttons: [{ text: "Learn More", href: "#" }],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "hi-res", title: "Hi-Res Audio Support", description: "Studio-quality audio with support for lossless and hi-res formats. Experience music exactly as the artist intended with pristine clarity.", tag: "Premium", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/spatial-audio-visualization-showing-3d-s-1772884352783-6a2daab8.png", imageAlt: "Hi-res audio visualization", buttons: [{ text: "Explore", href: "#" }],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "battery-pro", title: "Extended Battery Life", description: "Up to 12 hours of continuous listening per charge with the charging case providing up to 60 hours total. All-day power for your lifestyle.", tag: "Long-lasting", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/apple-ecosystem-integration-showing-ipho-1772884352656-6d2f7cb3.png", imageAlt: "Battery performance", buttons: [{ text: "Details", href: "#" }],
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
animationType="slide-up"
|
||||||
|
textboxLayout="default"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="products" data-section="products">
|
||||||
|
<ProductCardThree
|
||||||
|
title="PodsX Pro Specifications"
|
||||||
|
description="Complete product lineup with detailed specifications and pricing."
|
||||||
|
tag="Premium Selection"
|
||||||
|
tagIcon={ShoppingBag}
|
||||||
|
tagAnimation="slide-up"
|
||||||
|
products={[
|
||||||
|
{
|
||||||
|
id: "podsx-pro-standard", name: "PodsX Pro Standard", price: "$399", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/high-quality-product-photography-of-airp-1772884351466-337fed24.png", imageAlt: "PodsX Pro Standard Model", initialQuantity: 1,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "podsx-pro-max", name: "PodsX Pro Max", price: "$549", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/airpods-max-over-ear-headphones-displaye-1772884352294-e666eff4.png", imageAlt: "PodsX Pro Max Model", initialQuantity: 1,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "podsx-pro-limited", name: "PodsX Pro Limited Edition", price: "$649", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/airpods-2nd-generation-with-charging-cas-1772884351239-d2c575a8.png", imageAlt: "PodsX Pro Limited Edition", initialQuantity: 1,
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
gridVariant="three-columns-all-equal-width"
|
||||||
|
animationType="slide-up"
|
||||||
|
textboxLayout="default"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="faq" data-section="faq">
|
||||||
|
<FaqDouble
|
||||||
|
title="PodsX Pro - Frequently Asked Questions"
|
||||||
|
description="Everything you need to know about PodsX Pro specifications, compatibility, and usage."
|
||||||
|
tag="Support"
|
||||||
|
tagIcon={HelpCircle}
|
||||||
|
tagAnimation="slide-up"
|
||||||
|
faqs={[
|
||||||
|
{
|
||||||
|
id: "1", title: "What makes PodsX Pro different from standard models?", content: "PodsX Pro features advanced adaptive ANC, hi-res audio support, extended 12-hour battery life, premium materials, and professional-grade audio processing. These are designed specifically for professionals and audio enthusiasts who demand the best."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "2", title: "What is the battery life specification?", content: "PodsX Pro provides up to 12 hours of continuous listening per charge. With the premium charging case, you get up to 60 hours of total listening time. Fast charging provides 2 hours of listening time from just 15 minutes of charging."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "3", title: "Does PodsX Pro support Hi-Res audio?", content: "Yes, PodsX Pro includes full Hi-Res audio support (up to 24-bit/192kHz). You can stream lossless and hi-res content from compatible streaming services and get studio-quality audio."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "4", title: "How effective is the ANC on PodsX Pro?", content: "The advanced adaptive ANC on PodsX Pro reduces ambient noise by up to 35dB, making it some of the most effective active noise cancellation available. It continuously adapts to your environment for optimal performance."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "5", title: "Are PodsX Pro water-resistant?", content: "PodsX Pro have an IPX5 rating, making them water and sweat resistant. They can handle splashes, rain, sweat, and light submersion. Perfect for workouts, travel, and daily use."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "6", title: "What devices are compatible with PodsX Pro?", content: "PodsX Pro work with any device that supports Bluetooth, including iPhone, iPad, Mac, Android devices, Windows PCs, and more. Premium features are optimized for Apple ecosystem devices."
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
textboxLayout="default"
|
||||||
|
faqsAnimation="slide-up"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
animationType="smooth"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="cta" data-section="contact-cta">
|
||||||
|
<ContactCTA
|
||||||
|
tag="Premium Audio Experience"
|
||||||
|
tagIcon={Headphones}
|
||||||
|
tagAnimation="slide-up"
|
||||||
|
title="Upgrade to PodsX Pro Today"
|
||||||
|
description="Experience professional-grade audio quality with advanced ANC, hi-res support, and extended battery life. Perfect for professionals, audiophiles, and demanding users."
|
||||||
|
buttons={[
|
||||||
|
{ text: "Buy PodsX Pro Now", href: "#products" },
|
||||||
|
{ text: "Compare Models", href: "#products" },
|
||||||
|
]}
|
||||||
|
buttonAnimation="slide-up"
|
||||||
|
background={{ variant: "plain" }}
|
||||||
|
useInvertedBackground={false}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="footer" data-section="footer">
|
||||||
|
<FooterSimple
|
||||||
|
columns={[
|
||||||
|
{
|
||||||
|
title: "Products", items: [
|
||||||
|
{ label: "PodsX Pro", href: "/podsx-pro" },
|
||||||
|
{ label: "PodsX 4", href: "/podsx-4" },
|
||||||
|
{ label: "Standard AirPods", href: "/" },
|
||||||
|
{ label: "Compare All", href: "/" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Support", items: [
|
||||||
|
{ label: "Documentation", href: "#" },
|
||||||
|
{ label: "Tutorials", href: "#" },
|
||||||
|
{ label: "Contact Support", href: "#" },
|
||||||
|
{ label: "Warranty Info", href: "#" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Company", items: [
|
||||||
|
{ label: "About", href: "/" },
|
||||||
|
{ label: "Blog", href: "#" },
|
||||||
|
{ label: "Press", href: "#" },
|
||||||
|
{ label: "Careers", href: "#" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Legal", items: [
|
||||||
|
{ label: "Privacy", href: "#" },
|
||||||
|
{ label: "Terms", href: "#" },
|
||||||
|
{ label: "Cookies", href: "#" },
|
||||||
|
{ label: "Warranty", href: "#" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
bottomLeftText="© 2025 PodsX Pro. All rights reserved."
|
||||||
|
bottomRightText="Powered by Premium Audio Innovation"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</ThemeProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -2,9 +2,9 @@
|
|||||||
|
|
||||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||||||
import PricingCardFive from "@/components/sections/pricing/PricingCardFive";
|
import PricingCardTwo from "@/components/sections/pricing/PricingCardTwo";
|
||||||
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
||||||
import { CreditCard, Check } from "lucide-react";
|
import { Sparkles, Check } from "lucide-react";
|
||||||
|
|
||||||
export default function PricingPage() {
|
export default function PricingPage() {
|
||||||
return (
|
return (
|
||||||
@@ -14,7 +14,7 @@ export default function PricingPage() {
|
|||||||
borderRadius="rounded"
|
borderRadius="rounded"
|
||||||
contentWidth="compact"
|
contentWidth="compact"
|
||||||
sizing="mediumLargeSizeMediumTitles"
|
sizing="mediumLargeSizeMediumTitles"
|
||||||
background="noise"
|
background="circleGradient"
|
||||||
cardStyle="inset"
|
cardStyle="inset"
|
||||||
primaryButtonStyle="double-inset"
|
primaryButtonStyle="double-inset"
|
||||||
secondaryButtonStyle="solid"
|
secondaryButtonStyle="solid"
|
||||||
@@ -24,12 +24,14 @@ export default function PricingPage() {
|
|||||||
<NavbarLayoutFloatingInline
|
<NavbarLayoutFloatingInline
|
||||||
brandName="AirPods"
|
brandName="AirPods"
|
||||||
navItems={[
|
navItems={[
|
||||||
{ name: "Products", id: "products" },
|
{ name: "Products", id: "/" },
|
||||||
{ name: "Features", id: "features" },
|
{ name: "Features", id: "/" },
|
||||||
{ name: "Why AirPods", id: "metrics" },
|
{ name: "Why AirPods", id: "/" },
|
||||||
{ name: "Support", id: "faq" },
|
{ name: "Support", id: "/" },
|
||||||
{ name: "Pricing", id: "pricing" },
|
{ name: "Reviews", id: "/reviews" },
|
||||||
{ name: "Contact", id: "contact" },
|
{ name: "About", id: "/about" },
|
||||||
|
{ name: "Pricing", id: "/pricing" },
|
||||||
|
{ name: "Contact", id: "/contact" },
|
||||||
]}
|
]}
|
||||||
button={{ text: "Shop Now", href: "/" }}
|
button={{ text: "Shop Now", href: "/" }}
|
||||||
animateOnLoad={true}
|
animateOnLoad={true}
|
||||||
@@ -37,28 +39,39 @@ export default function PricingPage() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="pricing" data-section="pricing">
|
<div id="pricing" data-section="pricing">
|
||||||
<PricingCardFive
|
<PricingCardTwo
|
||||||
title="Simple, Transparent Pricing"
|
title="Choose Your Perfect Plan"
|
||||||
description="Choose the perfect plan for your audio needs. All plans include premium support and lifetime updates."
|
description="Select the premium audio solution that matches your lifestyle and listening preferences."
|
||||||
tag="Pricing"
|
tag="Pricing"
|
||||||
tagIcon={CreditCard}
|
tagIcon={Sparkles}
|
||||||
tagAnimation="slide-up"
|
tagAnimation="slide-up"
|
||||||
plans={[
|
plans={[
|
||||||
{
|
{
|
||||||
id: "airpods-standard", tag: "AirPods Standard", price: "$129", period: "/one-time", description: "Perfect for everyday listening with classic AirPods comfort and convenience.", button: { text: "Shop Now", href: "/" },
|
id: "standard", badge: "AirPods (2nd Gen)", badgeIcon: Sparkles,
|
||||||
featuresTitle: "What's Included:", features: [
|
price: "$129", subtitle: "Great for everyday listening", buttons: [
|
||||||
"5 hours of battery life", "24 hours with charging case", "Automatic ear detection", "Double tap to control", "Seamless device switching"],
|
{ text: "Buy Now", href: "/" },
|
||||||
|
{ text: "Learn More", href: "/" },
|
||||||
|
],
|
||||||
|
features: [
|
||||||
|
"Up to 5 hours of listening time", "24 hours with charging case", "Easy setup with Apple devices", "Siri voice assistant", "Automatic ear detection"]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "airpods-pro", tag: "AirPods Pro", tagIcon: Check,
|
id: "pro", badge: "AirPods Pro", badgeIcon: Sparkles,
|
||||||
price: "$249", period: "/one-time", description: "Advanced audio features with active noise cancellation for immersive listening.", button: { text: "Shop Now", href: "/" },
|
price: "$249", subtitle: "Our most popular choice", buttons: [
|
||||||
featuresTitle: "What's Included:", features: [
|
{ text: "Buy Now", href: "/" },
|
||||||
"Active Noise Cancellation", "Transparency mode", "Spatial Audio with dynamic head tracking", "6 hours of battery life", "30 hours with charging case", "Water and sweat resistant (IPX4)", "Adaptive Audio", "Personalized Volume"],
|
{ text: "Learn More", href: "/" },
|
||||||
|
],
|
||||||
|
features: [
|
||||||
|
"Active Noise Cancellation", "Up to 6 hours of listening time", "30 hours with charging case", "Spatial Audio with dynamic head tracking", "Adaptive Audio", "Conversation Awareness", "Water and sweat resistant"]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "airpods-max", tag: "AirPods Max", price: "$549", period: "/one-time", description: "Premium over-ear headphones with breakthrough audio and all-day comfort.", button: { text: "Shop Now", href: "/" },
|
id: "max", badge: "AirPods Max", badgeIcon: Sparkles,
|
||||||
featuresTitle: "What's Included:", features: [
|
price: "$549", subtitle: "Premium over-ear experience", buttons: [
|
||||||
"Over-ear design with premium materials", "Active Noise Cancellation", "Spatial Audio with dynamic head tracking", "20 hours of battery life", "All-day comfort with custom fit", "Computational audio", "Automatic switching across devices", "Premium audio quality", "Built-in digital crown"],
|
{ text: "Buy Now", href: "/" },
|
||||||
|
{ text: "Learn More", href: "/" },
|
||||||
|
],
|
||||||
|
features: [
|
||||||
|
"Breakthrough over-ear design", "Up to 20 hours of listening time", "Computational audio", "Spatial Audio with dynamic head tracking", "Active Noise Cancellation", "Transparency mode", "Premium build quality", "Digital Crown control"]
|
||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
animationType="slide-up"
|
animationType="slide-up"
|
||||||
@@ -88,8 +101,8 @@ export default function PricingPage() {
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Company", items: [
|
title: "Company", items: [
|
||||||
{ label: "About Us", href: "#" },
|
{ label: "About Us", href: "/about" },
|
||||||
{ label: "Blog", href: "#" },
|
{ label: "Reviews", href: "/reviews" },
|
||||||
{ label: "Careers", href: "#" },
|
{ label: "Careers", href: "#" },
|
||||||
{ label: "News", href: "#" },
|
{ label: "News", href: "#" },
|
||||||
],
|
],
|
||||||
|
|||||||
281
src/app/products/page.tsx
Normal file
281
src/app/products/page.tsx
Normal file
@@ -0,0 +1,281 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
|
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||||||
|
import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
|
||||||
|
import FeatureCardMedia from "@/components/sections/feature/FeatureCardMedia";
|
||||||
|
import ProductCardThree from "@/components/sections/product/ProductCardThree";
|
||||||
|
import AboutMetric from "@/components/sections/about/AboutMetric";
|
||||||
|
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
|
||||||
|
import TestimonialCardFifteen from "@/components/sections/testimonial/TestimonialCardFifteen";
|
||||||
|
import FaqDouble from "@/components/sections/faq/FaqDouble";
|
||||||
|
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
||||||
|
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
||||||
|
import { Zap, Sparkles, ShoppingBag, Battery, Globe, Volume2, Award, Headphones, HelpCircle } from "lucide-react";
|
||||||
|
|
||||||
|
export default function ProductsPage() {
|
||||||
|
return (
|
||||||
|
<ThemeProvider
|
||||||
|
defaultButtonVariant="icon-arrow"
|
||||||
|
defaultTextAnimation="entrance-slide"
|
||||||
|
borderRadius="rounded"
|
||||||
|
contentWidth="compact"
|
||||||
|
sizing="mediumLargeSizeMediumTitles"
|
||||||
|
background="circleGradient"
|
||||||
|
cardStyle="inset"
|
||||||
|
primaryButtonStyle="double-inset"
|
||||||
|
secondaryButtonStyle="solid"
|
||||||
|
headingFontWeight="bold"
|
||||||
|
>
|
||||||
|
<div id="nav" data-section="nav">
|
||||||
|
<NavbarLayoutFloatingInline
|
||||||
|
brandName="AirPods"
|
||||||
|
navItems={[
|
||||||
|
{ name: "Products", id: "products" },
|
||||||
|
{ name: "Features", id: "features" },
|
||||||
|
{ name: "Why AirPods", id: "metrics" },
|
||||||
|
{ name: "Support", id: "faq" },
|
||||||
|
{ name: "Reviews", id: "/reviews" },
|
||||||
|
{ name: "About", id: "/about" },
|
||||||
|
{ name: "Pricing", id: "/pricing" },
|
||||||
|
{ name: "Contact", id: "/contact" },
|
||||||
|
]}
|
||||||
|
button={{ text: "Shop Now", href: "#products" }}
|
||||||
|
animateOnLoad={true}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="hero" data-section="hero">
|
||||||
|
<HeroSplitKpi
|
||||||
|
title="Experience Sound Like Never Before"
|
||||||
|
description="Premium wireless audio with active noise cancellation, spatial audio, and seamless Apple ecosystem integration. Discover the perfect fit for every moment."
|
||||||
|
background={{ variant: "plain" }}
|
||||||
|
kpis={[
|
||||||
|
{ value: "6-30 Hours", label: "Battery Life" },
|
||||||
|
{ value: "Adaptive", label: "Noise Control" },
|
||||||
|
{ value: "Instant", label: "Setup" },
|
||||||
|
]}
|
||||||
|
enableKpiAnimation={true}
|
||||||
|
tag="The Next Generation of Audio"
|
||||||
|
tagIcon={Zap}
|
||||||
|
tagAnimation="slide-up"
|
||||||
|
buttons={[
|
||||||
|
{ text: "Shop AirPods", href: "#products" },
|
||||||
|
{ text: "Learn More", href: "#features" },
|
||||||
|
]}
|
||||||
|
buttonAnimation="slide-up"
|
||||||
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/a-sleek-premium-product-shot-of-airpods--1772884352155-5b47d23f.png"
|
||||||
|
imageAlt="AirPods Pro with premium charging case"
|
||||||
|
mediaAnimation="blur-reveal"
|
||||||
|
imagePosition="right"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="features" data-section="features">
|
||||||
|
<FeatureCardMedia
|
||||||
|
title="Engineered to Perfection"
|
||||||
|
description="Discover the key features that make AirPods the world's most popular wireless audio experience."
|
||||||
|
tag="Core Features"
|
||||||
|
tagIcon={Sparkles}
|
||||||
|
tagAnimation="slide-up"
|
||||||
|
features={[
|
||||||
|
{
|
||||||
|
id: "noise-cancellation", title: "Active Noise Cancellation", description: "Experience breakthrough active noise cancellation that adapts to your environment in real time. Enjoy immersive listening wherever you go.", tag: "AirPods Pro", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/abstract-visualization-of-active-noise-c-1772884352205-cdd837a4.png", imageAlt: "Active noise cancellation visualization", buttons: [{ text: "Explore Feature", href: "#" }],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "spatial-audio", title: "Spatial Audio & Personalized Volume", description: "Feel like you're in the middle of the action with dynamic head tracking and room-aware audio. Theater-like experience in your everyday moments.", tag: "Immersive", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/spatial-audio-visualization-showing-3d-s-1772884352783-6a2daab8.png", imageAlt: "Spatial audio 3D visualization", buttons: [{ text: "Experience It", href: "#" }],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "ecosystem", title: "Seamless Apple Ecosystem", description: "Instantly connect across all your Apple devices. One tap setup with automatic switching between iPhone, Mac, iPad, and Apple Watch.", tag: "Connected", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/apple-ecosystem-integration-showing-ipho-1772884352656-6d2f7cb3.png", imageAlt: "Apple ecosystem integration", buttons: [{ text: "See Integration", href: "#" }],
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
animationType="slide-up"
|
||||||
|
textboxLayout="default"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="products" data-section="products">
|
||||||
|
<ProductCardThree
|
||||||
|
title="Find Your Perfect Fit"
|
||||||
|
description="Choose from our premium lineup designed for every lifestyle and listening preference."
|
||||||
|
tag="Shop Collection"
|
||||||
|
tagIcon={ShoppingBag}
|
||||||
|
tagAnimation="slide-up"
|
||||||
|
products={[
|
||||||
|
{
|
||||||
|
id: "airpods-pro", name: "AirPods Pro", price: "$249", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/high-quality-product-photography-of-airp-1772884351466-337fed24.png", imageAlt: "AirPods Pro with active noise cancellation", initialQuantity: 1,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "airpods-max", name: "AirPods Max", price: "$549", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/airpods-max-over-ear-headphones-displaye-1772884352294-e666eff4.png", imageAlt: "AirPods Max over-ear headphones", initialQuantity: 1,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "airpods-standard", name: "AirPods (2nd Gen)", price: "$129", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/airpods-2nd-generation-with-charging-cas-1772884351239-d2c575a8.png", imageAlt: "AirPods 2nd generation standard model", initialQuantity: 1,
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
gridVariant="three-columns-all-equal-width"
|
||||||
|
animationType="slide-up"
|
||||||
|
textboxLayout="default"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="metrics" data-section="metrics">
|
||||||
|
<AboutMetric
|
||||||
|
title="Trusted by Millions Worldwide - The Leading Choice in Wireless Audio Since Day One"
|
||||||
|
metrics={[
|
||||||
|
{ icon: Battery, label: "Extended Battery Life", value: "30+ Hours" },
|
||||||
|
{ icon: Globe, label: "Customers Globally", value: "Millions" },
|
||||||
|
{ icon: Volume2, label: "Audio Quality Rating", value: "Premium" },
|
||||||
|
{ icon: Zap, label: "Quick Setup Time", value: "Instant" },
|
||||||
|
]}
|
||||||
|
metricsAnimation="slide-up"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="social-proof" data-section="social-proof">
|
||||||
|
<SocialProofOne
|
||||||
|
title="Trusted by Audio Leaders"
|
||||||
|
description="Integrated with the world's most respected audio and technology platforms."
|
||||||
|
tag="Industry Partners"
|
||||||
|
tagIcon={Award}
|
||||||
|
tagAnimation="slide-up"
|
||||||
|
names={[
|
||||||
|
"Apple Music", "Spotify", "Apple", "Beats", "Shure", "Sennheiser", "Bose"
|
||||||
|
]}
|
||||||
|
logos={[
|
||||||
|
"http://img.b2bpic.net/free-photo/top-view-apples-around-frame-white-background-with-copy-space_141793-11956.jpg", "http://img.b2bpic.net/free-vector/flat-design-minimal-music-festival-youtube-channel-art_23-2149155264.jpg", "http://img.b2bpic.net/free-vector/set-retro-music-stickers_23-2147592207.jpg", "http://img.b2bpic.net/free-vector/music-festival-logo-collection-with-flat-design_23-2147825729.jpg", "http://img.b2bpic.net/free-vector/gradient-colored-dj-logo-set_23-2148874408.jpg", "http://img.b2bpic.net/free-vector/flat-design-dj-logo-collection_23-2148872847.jpg", "http://img.b2bpic.net/free-vector/neumorph-business-card_52683-59098.jpg"
|
||||||
|
]}
|
||||||
|
textboxLayout="default"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
speed={40}
|
||||||
|
showCard={true}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="testimonials" data-section="testimonials">
|
||||||
|
<TestimonialCardFifteen
|
||||||
|
testimonial="AirPods have completely transformed how I listen to music and take calls. The seamless integration with my Apple devices is unmatched. I can't imagine my daily routine without them. The sound quality and comfort are exceptional."
|
||||||
|
rating={5}
|
||||||
|
author="Sarah Chen, Audio Engineer"
|
||||||
|
avatars={[
|
||||||
|
{
|
||||||
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/professional-headshot-of-a-satisfied-use-1772884351817-6dec7f08.png", alt: "Sarah Chen"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/happy-lifestyle-photo-of-person-wearing--1772884353901-6ee88695.png", alt: "Customer 2"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/professional-businessperson-using-airpod-1772884353609-0ef52970.png", alt: "Customer 3"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/creative-professional-or-content-creator-1772884352345-f1e1d55c.png", alt: "Customer 4"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/active-lifestyle-user-athlete-or-fitness-1772884351718-1b549457.png", alt: "Customer 5"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/diverse-user-in-relaxed-comfortable-sett-1772884352272-d4dc5302.png", alt: "Customer 6"
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
ratingAnimation="slide-up"
|
||||||
|
avatarsAnimation="slide-up"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="faq" data-section="faq">
|
||||||
|
<FaqDouble
|
||||||
|
title="Frequently Asked Questions"
|
||||||
|
description="Everything you need to know about AirPods, compatibility, and setup."
|
||||||
|
tag="Support"
|
||||||
|
tagIcon={HelpCircle}
|
||||||
|
tagAnimation="slide-up"
|
||||||
|
faqs={[
|
||||||
|
{
|
||||||
|
id: "1", title: "How do I set up my AirPods?", content: "Simply bring your AirPods near your iPhone, iPad, Mac, or Apple Watch. A setup screen will appear automatically. Tap 'Connect' and follow the on-screen instructions. Your AirPods will automatically connect to all your Apple devices through your iCloud account."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "2", title: "What's the battery life?", content: "AirPods Pro offer up to 6 hours of listening time or 30 hours with the charging case. AirPods (2nd generation) provide up to 5 hours of listening time or 24 hours with the case. Battery life varies based on listening volume and active features used."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "3", title: "Are AirPods water resistant?", content: "AirPods Pro are water and sweat resistant (IPX4). They can withstand splashes, rain, and sweat during workouts. However, they're not designed for swimming or submersion in water. AirPods (2nd generation) are not water resistant."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "4", title: "Can I use AirPods with Android?", content: "Yes, AirPods can connect to Android devices via Bluetooth. However, you won't have access to some features like easy setup, automatic switching between devices, or Siri integration. For the best experience, we recommend using AirPods with Apple devices."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "5", title: "Do AirPods work with Windows?", content: "Yes, AirPods can pair with Windows PCs and laptops via Bluetooth. Simply put your AirPods in pairing mode and connect them through your Windows Bluetooth settings. Some exclusive Apple features won't be available on Windows."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "6", title: "What if I lose one AirPod?", content: "You can purchase replacement AirPods individually from Apple's website or authorized retailers. Visit apple.com and select your AirPods model to order a replacement earbud or charging case."
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
textboxLayout="default"
|
||||||
|
faqsAnimation="slide-up"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
animationType="smooth"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="contact-cta" data-section="contact-cta">
|
||||||
|
<ContactCTA
|
||||||
|
tag="Ready to Upgrade?"
|
||||||
|
tagIcon={Headphones}
|
||||||
|
tagAnimation="slide-up"
|
||||||
|
title="Start Your Audio Journey Today"
|
||||||
|
description="Discover the perfect AirPods for your lifestyle. Experience premium sound, seamless connectivity, and the ecosystem that just works."
|
||||||
|
buttons={[
|
||||||
|
{ text: "Shop Now", href: "#products" },
|
||||||
|
{ text: "Learn More", href: "#features" },
|
||||||
|
]}
|
||||||
|
buttonAnimation="slide-up"
|
||||||
|
background={{ variant: "plain" }}
|
||||||
|
useInvertedBackground={false}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="footer" data-section="footer">
|
||||||
|
<FooterSimple
|
||||||
|
columns={[
|
||||||
|
{
|
||||||
|
title: "Products", items: [
|
||||||
|
{ label: "AirPods Pro", href: "#products" },
|
||||||
|
{ label: "AirPods Max", href: "#products" },
|
||||||
|
{ label: "AirPods (2nd Gen)", href: "#products" },
|
||||||
|
{ label: "Compare Models", href: "#" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Support", items: [
|
||||||
|
{ label: "FAQ", href: "#faq" },
|
||||||
|
{ label: "Setup Guide", href: "#" },
|
||||||
|
{ label: "Troubleshooting", href: "#" },
|
||||||
|
{ label: "Contact Us", href: "/contact" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Company", items: [
|
||||||
|
{ label: "About Us", href: "/about" },
|
||||||
|
{ label: "Reviews", href: "/reviews" },
|
||||||
|
{ label: "Careers", href: "#" },
|
||||||
|
{ label: "News", href: "#" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Legal", items: [
|
||||||
|
{ label: "Privacy Policy", href: "#" },
|
||||||
|
{ label: "Terms of Service", href: "#" },
|
||||||
|
{ label: "Cookie Policy", href: "#" },
|
||||||
|
{ label: "Warranty", href: "#" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
bottomLeftText="© 2025 AirPods. All rights reserved."
|
||||||
|
bottomRightText="Powered by Premium Audio Technology"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</ThemeProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -2,13 +2,10 @@
|
|||||||
|
|
||||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||||||
import HeroSplit from "@/components/sections/hero/HeroSplit";
|
import TestimonialCardOne from "@/components/sections/testimonial/TestimonialCardOne";
|
||||||
import TestimonialCardFifteen from "@/components/sections/testimonial/TestimonialCardFifteen";
|
|
||||||
import BlogCardThree from "@/components/sections/blog/BlogCardThree";
|
|
||||||
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
|
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
|
||||||
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
|
||||||
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
import FooterSimple from "@/components/sections/footer/FooterSimple";
|
||||||
import { Star, Award, Users, TrendingUp, Headphones } from "lucide-react";
|
import { Award, Star } from "lucide-react";
|
||||||
|
|
||||||
export default function ReviewsPage() {
|
export default function ReviewsPage() {
|
||||||
return (
|
return (
|
||||||
@@ -34,88 +31,67 @@ export default function ReviewsPage() {
|
|||||||
{ name: "Support", id: "/" },
|
{ name: "Support", id: "/" },
|
||||||
{ name: "Reviews", id: "/reviews" },
|
{ name: "Reviews", id: "/reviews" },
|
||||||
{ name: "About", id: "/about" },
|
{ name: "About", id: "/about" },
|
||||||
|
{ name: "Pricing", id: "/pricing" },
|
||||||
|
{ name: "Contact", id: "/contact" },
|
||||||
]}
|
]}
|
||||||
button={{ text: "Shop Now", href: "/" }}
|
button={{ text: "Shop Now", href: "/" }}
|
||||||
animateOnLoad={true}
|
animateOnLoad={true}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="hero" data-section="hero">
|
|
||||||
<HeroSplit
|
|
||||||
title="Customer Reviews & Testimonials"
|
|
||||||
description="Discover what thousands of satisfied customers are saying about their AirPods experience. Read authentic reviews from real users across the globe."
|
|
||||||
background={{ variant: "plain" }}
|
|
||||||
tag="Customer Stories"
|
|
||||||
tagIcon={Star}
|
|
||||||
tagAnimation="slide-up"
|
|
||||||
buttons={[
|
|
||||||
{ text: "Share Your Review", href: "#" },
|
|
||||||
{ text: "Explore Products", href: "/" },
|
|
||||||
]}
|
|
||||||
buttonAnimation="slide-up"
|
|
||||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/happy-customer-giving-five-star-review-sa-1772884352890-a1b2c3d4.png"
|
|
||||||
imageAlt="Satisfied customer giving a five-star review"
|
|
||||||
mediaAnimation="blur-reveal"
|
|
||||||
imagePosition="right"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="testimonials" data-section="testimonials">
|
<div id="testimonials" data-section="testimonials">
|
||||||
<TestimonialCardFifteen
|
<TestimonialCardOne
|
||||||
testimonial="Over 10,000+ customers trust AirPods for their premium audio experience"
|
title="What Our Customers Say"
|
||||||
rating={5}
|
description="Real feedback from users who love their AirPods experience"
|
||||||
author="See what they say"
|
tag="Customer Reviews"
|
||||||
avatars={[
|
|
||||||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/professional-headshot-of-a-satisfied-use-1772884351817-6dec7f08.png", alt: "Customer 1" },
|
|
||||||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/happy-lifestyle-photo-of-person-wearing--1772884353901-6ee88695.png", alt: "Customer 2" },
|
|
||||||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/professional-businessperson-using-airpod-1772884353609-0ef52970.png", alt: "Customer 3" },
|
|
||||||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/creative-professional-or-content-creator-1772884352345-f1e1d55c.png", alt: "Customer 4" },
|
|
||||||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/active-lifestyle-user-athlete-or-fitness-1772884351718-1b549457.png", alt: "Customer 5" },
|
|
||||||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/diverse-user-in-relaxed-comfortable-sett-1772884352272-d4dc5302.png", alt: "Customer 6" },
|
|
||||||
]}
|
|
||||||
ratingAnimation="slide-up"
|
|
||||||
avatarsAnimation="slide-up"
|
|
||||||
useInvertedBackground={false}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="reviews" data-section="reviews">
|
|
||||||
<BlogCardThree
|
|
||||||
title="Detailed Customer Reviews"
|
|
||||||
description="Read in-depth reviews from AirPods users sharing their experiences, ratings, and recommendations."
|
|
||||||
tag="Reviews"
|
|
||||||
tagIcon={Star}
|
tagIcon={Star}
|
||||||
tagAnimation="slide-up"
|
tagAnimation="slide-up"
|
||||||
blogs={[
|
testimonials={[
|
||||||
{
|
{
|
||||||
id: "1", category: "AirPods Pro", title: "Best Wireless Earbuds for Audio Quality and Comfort", excerpt: "After using AirPods Pro for 6 months, I'm thoroughly impressed with the sound quality and seamless integration with my devices.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/high-quality-product-photography-of-airp-1772884351466-337fed24.png?_wi=3", imageAlt: "AirPods Pro review", authorName: "Sarah Chen", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/professional-headshot-of-a-satisfied-use-1772884351817-6dec7f08.png", date: "15 Jan 2025", onBlogClick: () => console.log("Review clicked"),
|
id: "1", name: "Alisa Hester", role: "Product Manager", company: "Tech Innovations", rating: 5,
|
||||||
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/professional-headshot-of-a-satisfied-use-1772884351817-6dec7f08.png", imageAlt: "Alisa Hester"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "2", category: "AirPods Max", title: "Premium Over-Ear Experience That Justifies the Investment", excerpt: "AirPods Max delivers exceptional sound, comfort, and integration that makes them worth every penny for audio enthusiasts.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/airpods-max-over-ear-headphones-displaye-1772884352294-e666eff4.png?_wi=2", imageAlt: "AirPods Max review", authorName: "James Wilson", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/happy-lifestyle-photo-of-person-wearing--1772884353901-6ee88695.png", date: "12 Jan 2025", onBlogClick: () => console.log("Review clicked"),
|
id: "2", name: "James Mitchell", role: "Creative Director", company: "Design Studio", rating: 5,
|
||||||
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/happy-lifestyle-photo-of-person-wearing--1772884353901-6ee88695.png", imageAlt: "James Mitchell"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "3", category: "AirPods 2nd Gen", title: "Affordable Excellence in Wireless Audio", excerpt: "Great value for money. These AirPods offer reliable performance and solid build quality at an accessible price point.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/airpods-2nd-generation-with-charging-cas-1772884351239-d2c575a8.png?_wi=2", imageAlt: "AirPods 2nd generation review", authorName: "Emma Davis", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/professional-businessperson-using-airpod-1772884353609-0ef52970.png", date: "10 Jan 2025", onBlogClick: () => console.log("Review clicked"),
|
id: "3", name: "Emily Rodriguez", role: "Fitness Coach", company: "Wellness Center", rating: 5,
|
||||||
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/professional-businessperson-using-airpod-1772884353609-0ef52970.png", imageAlt: "Emily Rodriguez"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "4", category: "Active Noise Cancellation", title: "Game-Changing Noise Cancellation Technology", excerpt: "The adaptive noise cancellation in AirPods Pro is revolutionary. It seamlessly adapts to your environment and never disappoints.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/abstract-visualization-of-active-noise-c-1772884352205-cdd837a4.png?_wi=3", imageAlt: "Noise cancellation review", authorName: "Michael Chen", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/creative-professional-or-content-creator-1772884352345-f1e1d55c.png", date: "8 Jan 2025", onBlogClick: () => console.log("Review clicked"),
|
id: "4", name: "Michael Chen", role: "Software Engineer", company: "Tech Company", rating: 5,
|
||||||
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/creative-professional-or-content-creator-1772884352345-f1e1d55c.png", imageAlt: "Michael Chen"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "5", name: "Sophie Laurent", role: "Digital Nomad", company: "Content Creator", rating: 5,
|
||||||
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/active-lifestyle-user-athlete-or-fitness-1772884351718-1b549457.png", imageAlt: "Sophie Laurent"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "6", name: "David Park", role: "Music Producer", company: "Studio Audio", rating: 5,
|
||||||
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AcG4WbdmgnoUEgMn6GlqKFPyhF/diverse-user-in-relaxed-comfortable-sett-1772884352272-d4dc5302.png", imageAlt: "David Park"
|
||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
|
gridVariant="three-columns-all-equal-width"
|
||||||
animationType="slide-up"
|
animationType="slide-up"
|
||||||
textboxLayout="default"
|
textboxLayout="default"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
carouselMode="buttons"
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="social-proof" data-section="social-proof">
|
<div id="social-proof" data-section="social-proof">
|
||||||
<SocialProofOne
|
<SocialProofOne
|
||||||
title="Trusted by Industry Leaders"
|
title="Trusted by Industry Leaders"
|
||||||
description="Recommended and used by tech reviewers, audio professionals, and major publications worldwide."
|
description="Recommended and endorsed by top audio professionals and technology experts worldwide"
|
||||||
tag="Industry Recognition"
|
tag="Social Proof"
|
||||||
tagIcon={Award}
|
tagIcon={Award}
|
||||||
tagAnimation="slide-up"
|
tagAnimation="slide-up"
|
||||||
names={[
|
names={[
|
||||||
"TechCrunch", "The Verge", "WIRED", "MacRumors", "AudioMag", "TechRadar", "Engadget"]}
|
"Audio Professionals", "Tech Reviewers", "Music Experts", "Industry Awards", "Customer Choice", "Best in Class", "Editor's Pick"
|
||||||
|
]}
|
||||||
|
logos={[
|
||||||
|
"http://img.b2bpic.net/free-photo/top-view-apples-around-frame-white-background-with-copy-space_141793-11956.jpg", "http://img.b2bpic.net/free-vector/flat-design-minimal-music-festival-youtube-channel-art_23-2149155264.jpg", "http://img.b2bpic.net/free-vector/set-retro-music-stickers_23-2147592207.jpg", "http://img.b2bpic.net/free-vector/music-festival-logo-collection-with-flat-design_23-2147825729.jpg", "http://img.b2bpic.net/free-vector/gradient-colored-dj-logo-set_23-2148874408.jpg", "http://img.b2bpic.net/free-vector/flat-design-dj-logo-collection_23-2148872847.jpg", "http://img.b2bpic.net/free-vector/neumorph-business-card_52683-59098.jpg"
|
||||||
|
]}
|
||||||
textboxLayout="default"
|
textboxLayout="default"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
speed={40}
|
speed={40}
|
||||||
@@ -123,23 +99,6 @@ export default function ReviewsPage() {
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="contact-cta" data-section="contact-cta">
|
|
||||||
<ContactCTA
|
|
||||||
tag="Ready to Experience Premium Audio?"
|
|
||||||
tagIcon={Headphones}
|
|
||||||
tagAnimation="slide-up"
|
|
||||||
title="Join Thousands of Satisfied Customers"
|
|
||||||
description="Experience the AirPods difference today. Find your perfect model and discover why customers worldwide choose AirPods for their audio needs."
|
|
||||||
buttons={[
|
|
||||||
{ text: "Shop Now", href: "/" },
|
|
||||||
{ text: "Compare Models", href: "/" },
|
|
||||||
]}
|
|
||||||
buttonAnimation="slide-up"
|
|
||||||
background={{ variant: "plain" }}
|
|
||||||
useInvertedBackground={false}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="footer" data-section="footer">
|
<div id="footer" data-section="footer">
|
||||||
<FooterSimple
|
<FooterSimple
|
||||||
columns={[
|
columns={[
|
||||||
@@ -156,7 +115,7 @@ export default function ReviewsPage() {
|
|||||||
{ label: "FAQ", href: "/" },
|
{ label: "FAQ", href: "/" },
|
||||||
{ label: "Setup Guide", href: "#" },
|
{ label: "Setup Guide", href: "#" },
|
||||||
{ label: "Troubleshooting", href: "#" },
|
{ label: "Troubleshooting", href: "#" },
|
||||||
{ label: "Contact Us", href: "/" },
|
{ label: "Contact Us", href: "/contact" },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -12,13 +12,13 @@
|
|||||||
|
|
||||||
--background: #ffffff;
|
--background: #ffffff;
|
||||||
--card: #f9f9f9;
|
--card: #f9f9f9;
|
||||||
--foreground: #000612e6;
|
--foreground: #000000;
|
||||||
--primary-cta: #106EFB;
|
--primary-cta: #000000;
|
||||||
--primary-cta-text: #efebe5;
|
--primary-cta-text: #efebe5;
|
||||||
--secondary-cta: #f9f9f9;
|
--secondary-cta: #f9f9f9;
|
||||||
--secondary-cta-text: #000000;
|
--secondary-cta-text: #000000;
|
||||||
--accent: #e2e2e2;
|
--accent: #e2e2e2;
|
||||||
--background-accent: #106EFB;
|
--background-accent: #c4c4c4;
|
||||||
|
|
||||||
/* text sizing - set by ThemeProvider */
|
/* text sizing - set by ThemeProvider */
|
||||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||||
|
|||||||
Reference in New Issue
Block a user