Update src/app/features/page.tsx
This commit is contained in:
@@ -7,7 +7,7 @@ import FeatureCardMedia from "@/components/sections/feature/FeatureCardMedia";
|
||||
import AboutMetric from "@/components/sections/about/AboutMetric";
|
||||
import ContactCTA from "@/components/sections/contact/ContactCTA";
|
||||
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() {
|
||||
return (
|
||||
@@ -29,57 +29,105 @@ export default function FeaturesPage() {
|
||||
navItems={[
|
||||
{ name: "Products", id: "/" },
|
||||
{ name: "Features", id: "/features" },
|
||||
{ name: "Comparison", id: "/comparison" },
|
||||
{ name: "Why AirPods", id: "/" },
|
||||
{ name: "Support", id: "/" },
|
||||
{ name: "Compare", id: "/comparison" },
|
||||
]}
|
||||
button={{ text: "Shop Now", href: "/#products" }}
|
||||
button={{ text: "Shop Now", href: "#products" }}
|
||||
animateOnLoad={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplitKpi
|
||||
title="Discover AirPods Key Features"
|
||||
description="Explore the innovative technologies that make AirPods the world's most advanced wireless audio experience. From noise cancellation to seamless connectivity."
|
||||
title="Advanced Features Built for You"
|
||||
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" }}
|
||||
kpis={[
|
||||
{ value: "Active", label: "Noise Cancellation" },
|
||||
{ value: "Spatial", label: "3D Audio" },
|
||||
{ value: "Instant", label: "Device Switching" },
|
||||
{ value: "30+ Hours", label: "Total Battery" },
|
||||
{ value: "Adaptive", label: "Noise Control" },
|
||||
{ value: "360°", label: "Spatial Audio" },
|
||||
]}
|
||||
enableKpiAnimation={true}
|
||||
tag="Innovation at Work"
|
||||
tag="Feature Deep Dive"
|
||||
tagIcon={Sparkles}
|
||||
tagAnimation="slide-up"
|
||||
buttons={[
|
||||
{ text: "Explore All Products", href: "/#products" },
|
||||
{ text: "Compare Models", href: "/comparison" },
|
||||
{ text: "Shop Now", href: "/" },
|
||||
{ text: "Back Home", href: "/" },
|
||||
]}
|
||||
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"
|
||||
imageAlt="AirPods Pro premium features showcase"
|
||||
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">
|
||||
<div id="noise-cancellation" data-section="features-noise">
|
||||
<FeatureCardMedia
|
||||
title="Signature AirPods Technologies"
|
||||
description="Experience the cutting-edge features that define premium wireless audio."
|
||||
tag="Core Technologies"
|
||||
title="Noise Cancellation Excellence"
|
||||
description="Experience advanced active noise cancellation that learns and adapts to your environment."
|
||||
tag="Core Technology"
|
||||
tagIcon={Zap}
|
||||
tagAnimation="slide-up"
|
||||
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"
|
||||
@@ -90,12 +138,12 @@ export default function FeaturesPage() {
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<AboutMetric
|
||||
title="Performance Metrics That Matter"
|
||||
title="Feature Specifications That Matter"
|
||||
metrics={[
|
||||
{ icon: Battery, label: "Maximum Battery", value: "30 Hours" },
|
||||
{ icon: Radio, label: "Bluetooth Range", value: "10+ Meters" },
|
||||
{ icon: Volume2, label: "Noise Reduction", value: "Up to 40dB" },
|
||||
{ icon: Wifi, label: "Seamless Pairing", value: "All Apple Devices" },
|
||||
{ icon: Battery, label: "Maximum Battery Life", value: "30+ Hours" },
|
||||
{ icon: Waves, label: "Noise Cancellation Levels", value: "Multi-Stage" },
|
||||
{ icon: Headphones, label: "Audio Modes", value: "4+ Modes" },
|
||||
{ icon: ZapIcon, label: "Setup Time", value: "Instant" },
|
||||
]}
|
||||
metricsAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
@@ -104,14 +152,14 @@ export default function FeaturesPage() {
|
||||
|
||||
<div id="contact-cta" data-section="contact-cta">
|
||||
<ContactCTA
|
||||
tag="Experience the Difference"
|
||||
tag="Ready to Experience?"
|
||||
tagIcon={Headphones}
|
||||
tagAnimation="slide-up"
|
||||
title="Ready to Upgrade Your Audio?"
|
||||
description="Discover which AirPods model is perfect for your lifestyle. Compare features, read expert reviews, and find your ideal match."
|
||||
title="Discover Premium Audio Innovation"
|
||||
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={[
|
||||
{ text: "Shop Now", href: "/#products" },
|
||||
{ text: "Compare Models", href: "/comparison" },
|
||||
{ text: "Shop AirPods Pro", href: "/" },
|
||||
{ text: "View Comparison", href: "/comparison" },
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
background={{ variant: "plain" }}
|
||||
@@ -124,26 +172,26 @@ export default function FeaturesPage() {
|
||||
columns={[
|
||||
{
|
||||
title: "Products", items: [
|
||||
{ label: "AirPods Pro", href: "/#products" },
|
||||
{ label: "AirPods Max", href: "/#products" },
|
||||
{ label: "AirPods (2nd Gen)", href: "/#products" },
|
||||
{ label: "AirPods Pro", href: "/" },
|
||||
{ label: "AirPods Max", href: "/" },
|
||||
{ label: "AirPods (2nd Gen)", href: "/" },
|
||||
{ label: "Compare Models", href: "/comparison" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support", items: [
|
||||
{ label: "FAQ", href: "/#faq" },
|
||||
{ label: "Setup Guide", href: "#" },
|
||||
{ label: "Troubleshooting", href: "#" },
|
||||
{ label: "Contact Us", href: "/#contact-cta" },
|
||||
title: "Features", items: [
|
||||
{ label: "Noise Cancellation", href: "#noise-cancellation" },
|
||||
{ label: "Battery Life", href: "#battery-life" },
|
||||
{ label: "Sound Quality", href: "#immersive-sound" },
|
||||
{ label: "Ecosystem", href: "/" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "#" },
|
||||
{ label: "Blog", href: "#" },
|
||||
{ label: "Careers", href: "#" },
|
||||
{ label: "News", href: "#" },
|
||||
title: "Support", items: [
|
||||
{ label: "Setup Guide", href: "/" },
|
||||
{ label: "FAQ", href: "/" },
|
||||
{ label: "Troubleshooting", href: "/" },
|
||||
{ label: "Contact Us", href: "/" },
|
||||
],
|
||||
},
|
||||
{
|
||||
|
||||
Reference in New Issue
Block a user