Update src/pages/HomePage.tsx
This commit is contained in:
@@ -12,267 +12,146 @@ import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
export default function HomePage() {
|
||||
return (
|
||||
<>
|
||||
<div id="hero" data-section="hero">
|
||||
<SectionErrorBoundary name="hero">
|
||||
<div id="hero" data-section="hero">
|
||||
<SectionErrorBoundary name="hero">
|
||||
<HeroOverlay
|
||||
tag="Luxury Tech Selection"
|
||||
title="Engineering Meets Elegance—Gadgets Redefined"
|
||||
description="Curated premium technology for those who demand excellence. Experience innovation designed for the discerning."
|
||||
primaryButton={{
|
||||
text: "Explore Our Collection",
|
||||
href: "#products",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Our Story",
|
||||
href: "#about",
|
||||
}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/transparent-prism_23-2147960159.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Luxury Tech Selection"
|
||||
title="Engineering Meets Elegance—Gadgets Redefined"
|
||||
description="Curated premium technology for those who demand excellence. Experience innovation designed for the discerning."
|
||||
primaryButton={{
|
||||
text: "Explore Our Collection", href: "#products"}}
|
||||
secondaryButton={{
|
||||
text: "Our Story", href: "#about"}}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/transparent-prism_23-2147960159.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SectionErrorBoundary name="about">
|
||||
<div id="about" data-section="about">
|
||||
<SectionErrorBoundary name="about">
|
||||
<AboutFeaturesSplit
|
||||
tag="The Art of Tech"
|
||||
title="Craftsmanship in Every Detail"
|
||||
description="We believe that technology should be as beautiful as it is functional. Our hand-selected gadgets redefine what it means to live in the future."
|
||||
items={[
|
||||
{
|
||||
icon: Shield,
|
||||
title: "Verified Authenticity",
|
||||
description: "Guaranteed quality and original parts in every unit.",
|
||||
},
|
||||
{
|
||||
icon: Zap,
|
||||
title: "Cutting Edge",
|
||||
description: "Innovations that set the standard for the industry.",
|
||||
},
|
||||
{
|
||||
icon: Award,
|
||||
title: "Exclusivity",
|
||||
description: "Curated selection available only to our members.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/spiky-blue-ferromagnetic-liquid-metal-with-copy-space_23-2148253533.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="The Art of Tech"
|
||||
title="Craftsmanship in Every Detail"
|
||||
description="We believe that technology should be as beautiful as it is functional. Our hand-selected gadgets redefine what it means to live in the future."
|
||||
items={[
|
||||
{
|
||||
icon: "Shield", title: "Verified Authenticity", description: "Guaranteed quality and original parts in every unit."},
|
||||
{
|
||||
icon: "Zap", title: "Cutting Edge", description: "Innovations that set the standard for the industry."},
|
||||
{
|
||||
icon: "Award", title: "Exclusivity", description: "Curated selection available only to our members."},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/spiky-blue-ferromagnetic-liquid-metal-with-copy-space_23-2148253533.jpg"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<SectionErrorBoundary name="products">
|
||||
<div id="products" data-section="products">
|
||||
<SectionErrorBoundary name="products">
|
||||
<FeaturesRevealCardsBento
|
||||
tag="Our Collection"
|
||||
title="Curated Tech Masterpieces"
|
||||
description="Explore the pinnacle of modern gadget design, performance, and aesthetic beauty."
|
||||
items={[
|
||||
{
|
||||
title: "Precision Audio",
|
||||
description: "Acoustically perfect instruments for the refined ear.",
|
||||
href: "#",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/golden-light-streak-background_1017-3395.jpg",
|
||||
},
|
||||
{
|
||||
title: "Smart Timepieces",
|
||||
description: "Wearable intelligence crafted from aerospace titanium.",
|
||||
href: "#",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/metallic-plate-background-with-scratched-grunge-effect_1048-7933.jpg",
|
||||
},
|
||||
{
|
||||
title: "Optic Vision",
|
||||
description: "Advanced imaging captured with unparalleled clarity.",
|
||||
href: "#",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-microscope-table_1252-725.jpg",
|
||||
},
|
||||
{
|
||||
title: "Kinetic Chargers",
|
||||
description: "Energy efficiency meeting high-end material design.",
|
||||
href: "#",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/painted-white-camera-eyeglass-formula-one-car-light-bulb-against-pink-background_23-2148084274.jpg",
|
||||
},
|
||||
{
|
||||
title: "Haptic Controllers",
|
||||
description: "Interface perfection for professional creators.",
|
||||
href: "#",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/you-can-trust-us-polygraph-examiner-works-office-with-his-lie-detector-s-equipment_146671-17302.jpg",
|
||||
},
|
||||
{
|
||||
title: "Luminary Displays",
|
||||
description: "Visual clarity refined for every environment.",
|
||||
href: "#",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-monitor-elegant-table_23-2150706499.jpg",
|
||||
},
|
||||
{
|
||||
title: "Silica Hardware",
|
||||
description: "The ultimate in sustainable high-performance compute.",
|
||||
href: "#",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blurred-night-lights_23-2148139374.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Our Collection"
|
||||
title="Curated Tech Masterpieces"
|
||||
description="Explore the pinnacle of modern gadget design, performance, and aesthetic beauty."
|
||||
items={[
|
||||
{ title: "Precision Audio", description: "Acoustically perfect instruments for the refined ear.", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/golden-light-streak-background_1017-3395.jpg" },
|
||||
{ title: "Smart Timepieces", description: "Wearable intelligence crafted from aerospace titanium.", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/metallic-plate-background-with-scratched-grunge-effect_1048-7933.jpg" },
|
||||
{ title: "Optic Vision", description: "Advanced imaging captured with unparalleled clarity.", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/close-up-microscope-table_1252-725.jpg" },
|
||||
{ title: "Kinetic Chargers", description: "Energy efficiency meeting high-end material design.", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/painted-white-camera-eyeglass-formula-one-car-light-bulb-against-pink-background_23-2148084274.jpg" },
|
||||
{ title: "Haptic Controllers", description: "Interface perfection for professional creators.", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/you-can-trust-us-polygraph-examiner-works-office-with-his-lie-detector-s-equipment_146671-17302.jpg" },
|
||||
{ title: "Luminary Displays", description: "Visual clarity refined for every environment.", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/modern-monitor-elegant-table_23-2150706499.jpg" },
|
||||
{ title: "Silica Hardware", description: "The ultimate in sustainable high-performance compute.", href: "#", imageSrc: "http://img.b2bpic.net/free-photo/blurred-night-lights_23-2148139374.jpg" },
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="features" data-section="features">
|
||||
<SectionErrorBoundary name="features">
|
||||
<div id="features" data-section="features">
|
||||
<SectionErrorBoundary name="features">
|
||||
<FeaturesComparison
|
||||
tag="Why Technics"
|
||||
title="Beyond Standard Gadgets"
|
||||
description="We don't just sell technology; we curate lifestyle investments."
|
||||
negativeItems={[
|
||||
"Mass-produced hardware",
|
||||
"Planned obsolescence",
|
||||
"Generic design trends",
|
||||
]}
|
||||
positiveItems={[
|
||||
"Premium artisan materials",
|
||||
"Lifetime performance engineering",
|
||||
"Signature timeless design",
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Why Technics"
|
||||
title="Beyond Standard Gadgets"
|
||||
description="We don't just sell technology; we curate lifestyle investments."
|
||||
negativeItems={[
|
||||
"Mass-produced hardware", "Planned obsolescence", "Generic design trends"]}
|
||||
positiveItems={[
|
||||
"Premium artisan materials", "Lifetime performance engineering", "Signature timeless design"]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="pricing" data-section="pricing">
|
||||
<SectionErrorBoundary name="pricing">
|
||||
<div id="pricing" data-section="pricing">
|
||||
<SectionErrorBoundary name="pricing">
|
||||
<PricingCenteredCards
|
||||
tag="Investment"
|
||||
title="Valuation Tiers"
|
||||
description="Select the level of excellence that matches your lifestyle."
|
||||
plans={[
|
||||
{
|
||||
tag: "Essential",
|
||||
price: "$299",
|
||||
description: "Perfect introduction to elite tech.",
|
||||
features: [
|
||||
"1-year guarantee",
|
||||
"Direct support",
|
||||
],
|
||||
primaryButton: {
|
||||
text: "Select",
|
||||
href: "#",
|
||||
},
|
||||
},
|
||||
{
|
||||
tag: "Professional",
|
||||
price: "$1,499",
|
||||
description: "Advanced performance for pros.",
|
||||
features: [
|
||||
"3-year guarantee",
|
||||
"Concierge support",
|
||||
"Limited Edition",
|
||||
],
|
||||
primaryButton: {
|
||||
text: "Select",
|
||||
href: "#",
|
||||
},
|
||||
},
|
||||
{
|
||||
tag: "Collector",
|
||||
price: "$4,999",
|
||||
description: "The ultimate expression of style.",
|
||||
features: [
|
||||
"5-year guarantee",
|
||||
"Priority concierge",
|
||||
"Unique serial ID",
|
||||
],
|
||||
primaryButton: {
|
||||
text: "Select",
|
||||
href: "#",
|
||||
},
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Investment"
|
||||
title="Valuation Tiers"
|
||||
description="Select the level of excellence that matches your lifestyle."
|
||||
plans={[
|
||||
{
|
||||
tag: "Essential", price: "$299", description: "Perfect introduction to elite tech.", features: ["1-year guarantee", "Direct support"],
|
||||
primaryButton: { text: "Select", href: "#" },
|
||||
},
|
||||
{
|
||||
tag: "Professional", price: "$1,499", description: "Advanced performance for pros.", features: ["3-year guarantee", "Concierge support", "Limited Edition"],
|
||||
primaryButton: { text: "Select", href: "#" },
|
||||
},
|
||||
{
|
||||
tag: "Collector", price: "$4,999", description: "The ultimate expression of style.", features: ["5-year guarantee", "Priority concierge", "Unique serial ID"],
|
||||
primaryButton: { text: "Select", href: "#" },
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="reviews" data-section="reviews">
|
||||
<SectionErrorBoundary name="reviews">
|
||||
<div id="reviews" data-section="reviews">
|
||||
<SectionErrorBoundary name="reviews">
|
||||
<TestimonialOverlayCards
|
||||
tag="Social Proof"
|
||||
title="Voices of Excellence"
|
||||
description="Hear from our elite community of tech enthusiasts."
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Marcus Thorne",
|
||||
role: "Creative Director",
|
||||
company: "DesignLab",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-posing-with-yellow-jacket_23-2149020793.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Elise Chen",
|
||||
role: "VP Product",
|
||||
company: "TechStream",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiley-businesswoman-indoors_23-2148824825.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Julian Vane",
|
||||
role: "Architect",
|
||||
company: "Vane Design",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-man-with-tablet-helmet_23-2148269247.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Sarah Jenkins",
|
||||
role: "Tech Founder",
|
||||
company: "Innovation X",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/technician-optimizing-data-center-equipment-maximum-efficiency_482257-117650.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "David Wu",
|
||||
role: "Designer",
|
||||
company: "Studio Core",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/nervous-puzzled-woman-banker-bites-lips-worries_273609-45620.jpg",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Social Proof"
|
||||
title="Voices of Excellence"
|
||||
description="Hear from our elite community of tech enthusiasts."
|
||||
testimonials={[
|
||||
{
|
||||
name: "Marcus Thorne", role: "Creative Director", company: "DesignLab", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-posing-with-yellow-jacket_23-2149020793.jpg"},
|
||||
{
|
||||
name: "Elise Chen", role: "VP Product", company: "TechStream", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiley-businesswoman-indoors_23-2148824825.jpg"},
|
||||
{
|
||||
name: "Julian Vane", role: "Architect", company: "Vane Design", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-man-with-tablet-helmet_23-2148269247.jpg"},
|
||||
{
|
||||
name: "Sarah Jenkins", role: "Tech Founder", company: "Innovation X", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/technician-optimizing-data-center-equipment-maximum-efficiency_482257-117650.jpg"},
|
||||
{
|
||||
name: "David Wu", role: "Designer", company: "Studio Core", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/nervous-puzzled-woman-banker-bites-lips-worries_273609-45620.jpg"},
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="proof" data-section="proof">
|
||||
<SectionErrorBoundary name="proof">
|
||||
<div id="proof" data-section="proof">
|
||||
<SectionErrorBoundary name="proof">
|
||||
<SocialProofMarquee
|
||||
tag="Affiliations"
|
||||
title="Recognized by Industry Leaders"
|
||||
description="Joining the select ranks of global design and tech innovators."
|
||||
names={[
|
||||
"Tech Insider",
|
||||
"Design Week",
|
||||
"Hype Gadget",
|
||||
"Future Tech",
|
||||
"Style & Silicon",
|
||||
"Global Innovator",
|
||||
"Master Design",
|
||||
]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Affiliations"
|
||||
title="Recognized by Industry Leaders"
|
||||
description="Joining the select ranks of global design and tech innovators."
|
||||
names={[
|
||||
"Tech Insider", "Design Week", "Hype Gadget", "Future Tech", "Style & Silicon", "Global Innovator", "Master Design"]}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<SectionErrorBoundary name="contact">
|
||||
<div id="contact" data-section="contact">
|
||||
<SectionErrorBoundary name="contact">
|
||||
<ContactCta
|
||||
tag="Inquire"
|
||||
text="Join our curated list for exclusive product releases and private events."
|
||||
primaryButton={{
|
||||
text: "Contact Us",
|
||||
href: "#",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Learn More",
|
||||
href: "#",
|
||||
}}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
tag="Inquire"
|
||||
text="Join our curated list for exclusive product releases and private events."
|
||||
primaryButton={{ text: "Contact Us", href: "#" }}
|
||||
secondaryButton={{ text: "Learn More", href: "#" }}
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user