Merge version_1 into main #3
@@ -2,345 +2,140 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
|
||||
import FooterBase from '@/components/sections/footer/FooterBase';
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
||||
import ProductDetailCard from '@/components/ecommerce/productDetail/ProductDetailCard';
|
||||
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
|
||||
import { Star } from "lucide-react";
|
||||
// Placeholder imports for components that might not be in the registry but are implied by errors.
|
||||
// These should be replaced with actual component imports if they existed in the project structure.
|
||||
import ProductDisplay from '@/components/core/ProductDisplay';
|
||||
import FeatureListDisplay from '@/components/core/FeatureListDisplay';
|
||||
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
||||
|
||||
export default function ProductDetailPage() {
|
||||
const navItems = [
|
||||
{
|
||||
name: "Home", id: "/"
|
||||
},
|
||||
{
|
||||
name: "Collection", id: "/collection"
|
||||
},
|
||||
{
|
||||
name: "About", id: "/about"
|
||||
},
|
||||
{
|
||||
name: "Contact", id: "/contact"
|
||||
}
|
||||
];
|
||||
|
||||
// Dummy product data to trigger variant errors
|
||||
const productData = {
|
||||
id: "prod-1", name: "The Chronos Masterpiece", description: "Experience unparalleled precision and exquisite craftsmanship. Each Horologium Lux timepiece is a testament to enduring legacy and innovative design.", price: "$55,000", images: [
|
||||
{ src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BPSYpjXlk69WrIECU6nXnUWdiQ/a-hyper-realistic-3d-render-of-a-luxury--1774389483545-ca8bc4e7.png", alt: "Product Image 1" },
|
||||
],
|
||||
variants: [
|
||||
{ label: "Size", options: ["S", "M", "L"], selected: "M", onChange: () => {} },
|
||||
{ label: "Color", options: ["Red", "Blue", "Green"], selected: "Blue", onChange: () => {} },
|
||||
{ label: "Material", options: ["Steel", "Gold"], selected: "Steel", onChange: () => {} },
|
||||
],
|
||||
};
|
||||
|
||||
const features = [
|
||||
{ title: "Precision Engineering" },
|
||||
{ title: "Sapphire Crystal" },
|
||||
{ title: "Water Resistance" },
|
||||
];
|
||||
|
||||
const techSpecs = [
|
||||
{ title: "Automatic Movement" },
|
||||
{ title: "40mm Case Diameter" },
|
||||
{ title: "Power Reserve: 72 hours" },
|
||||
];
|
||||
|
||||
const materialFeatures = [
|
||||
{ title: "Ethically Sourced Gold" },
|
||||
{ title: "Hypoallergenic Stainless Steel" },
|
||||
{ title: "Hand-stitched Leather Strap" },
|
||||
];
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="soft"
|
||||
contentWidth="small"
|
||||
sizing="largeSizeMediumTitles"
|
||||
background="grid"
|
||||
cardStyle="gradient-bordered"
|
||||
primaryButtonStyle="shadow"
|
||||
secondaryButtonStyle="radial-glow"
|
||||
headingFontWeight="medium"
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="background-highlight"
|
||||
borderRadius="soft"
|
||||
contentWidth="small"
|
||||
sizing="largeSizeMediumTitles"
|
||||
background="grid"
|
||||
cardStyle="gradient-bordered"
|
||||
primaryButtonStyle="shadow"
|
||||
secondaryButtonStyle="radial-glow"
|
||||
headingFontWeight="medium"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "home",
|
||||
href: "/",
|
||||
},
|
||||
{
|
||||
name: "Collection",
|
||||
id: "collection",
|
||||
href: "#collection",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
brandName="Horologium Lux"
|
||||
bottomLeftText="Timeless Precision"
|
||||
bottomRightText="inquire@horologiumlux.com"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={navItems}
|
||||
brandName="Horologium Lux"
|
||||
bottomLeftText="Timeless Precision"
|
||||
bottomRightText="inquire@horologiumlux.com"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="product-details" data-section="product-details">
|
||||
<ProductDetailCard
|
||||
layout="page"
|
||||
name="The Chronos Masterpiece"
|
||||
price="$12,500"
|
||||
showRating={true}
|
||||
rating={5}
|
||||
ratingIcon={Star}
|
||||
description="An exquisite blend of classic horology and modern engineering. The Chronos Masterpiece features a precision automatic movement, encased in a polished stainless steel body with a sapphire crystal. Water-resistant up to 100 meters, it's perfect for both daily wear and special occasions."
|
||||
images={[
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BPSYpjXlk69WrIECU6nXnUWdiQ/a-hyper-realistic-3d-render-of-a-luxury--1774389483545-ca8bc4e7.png",
|
||||
alt: "The Chronos Masterpiece luxury mechanical watch",
|
||||
},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BPSYpjXlk69WrIECU6nXnUWdiQ/a-hyper-realistic-3d-render-of-a-luxury--1774389483239-0ed0d78d.png",
|
||||
alt: "Close-up of the Chronos Masterpiece dial",
|
||||
},
|
||||
{
|
||||
src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BPSYpjXlk69WrIECU6nXnUWdiQ/a-hyper-realistic-3d-render-of-a-luxury--1774389482765-b841e8a7.png",
|
||||
alt: "Side view of the Chronos Masterpiece case",
|
||||
},
|
||||
]}
|
||||
variants={[
|
||||
{
|
||||
label: "Strap",
|
||||
options: [
|
||||
"Leather",
|
||||
"Steel Bracelet",
|
||||
"Rubber",
|
||||
],
|
||||
selected: "Steel Bracelet",
|
||||
},
|
||||
{
|
||||
label: "Dial Color",
|
||||
options: [
|
||||
"Midnight Blue",
|
||||
"Classic Black",
|
||||
"Arctic Silver",
|
||||
],
|
||||
selected: "Midnight Blue",
|
||||
},
|
||||
]}
|
||||
quantity={{
|
||||
label: "Quantity",
|
||||
options: [
|
||||
"1",
|
||||
"2",
|
||||
"3",
|
||||
"4",
|
||||
"5",
|
||||
],
|
||||
selected: "1",
|
||||
}}
|
||||
buttons={[
|
||||
{
|
||||
text: "Add to Cart",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
text: "Buy Now",
|
||||
href: "#",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="product-details" data-section="product-details">
|
||||
<ProductDisplay
|
||||
product={productData}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="product-features" data-section="product-features">
|
||||
<FeatureCardTen
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "1",
|
||||
title: "Precision Engineering",
|
||||
description: "Experience the flawless accuracy of our in-house developed automatic movement, a marvel of micro-mechanics.",
|
||||
media: {
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BPSYpjXlk69WrIECU6nXnUWdiQ/close-up-of-a-watchmaker-s-hands-meticul-1774389483435-b01bb99e.png?_wi=2",
|
||||
imageAlt: "Watchmaker's hands assembling a mechanical watch movement",
|
||||
},
|
||||
items: [
|
||||
"Swiss-certified movement",
|
||||
"80-hour power reserve",
|
||||
"Anti-magnetic components",
|
||||
],
|
||||
reverse: false,
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Luxury Materials",
|
||||
description: "Crafted from the finest materials, ensuring durability, comfort, and a timeless aesthetic.",
|
||||
media: {
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BPSYpjXlk69WrIECU6nXnUWdiQ/macro-shot-of-polished-luxury-watch-mate-1774389483156-bfae6720.png?_wi=2",
|
||||
imageAlt: "Macro shot of polished luxury watch materials",
|
||||
},
|
||||
items: [
|
||||
"Grade 5 Titanium case",
|
||||
"Scratch-resistant sapphire crystal",
|
||||
"Hand-polished finishes",
|
||||
],
|
||||
reverse: true,
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Timeless Design",
|
||||
description: "A harmonious blend of classic elegance and contemporary style, designed to be cherished for generations.",
|
||||
media: {
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BPSYpjXlk69WrIECU6nXnUWdiQ/an-elegant-hourglass-filled-with-sparkli-1774389483282-630737d6.png?_wi=2",
|
||||
imageAlt: "Elegant hourglass symbolizing timeless heritage",
|
||||
},
|
||||
items: [
|
||||
"Inspired by archival designs",
|
||||
"Clean, legible dial",
|
||||
"Ergonomic case profile",
|
||||
],
|
||||
reverse: false,
|
||||
},
|
||||
]}
|
||||
title="Unrivaled Craftsmanship & Innovation"
|
||||
description="Every Horologium Lux timepiece is a testament to meticulous artistry and pioneering technology, designed for discerning individuals."
|
||||
/>
|
||||
</div>
|
||||
<div id="features-list" data-section="features-list">
|
||||
<FeatureListDisplay
|
||||
title="Key Features"
|
||||
description="Discover the core attributes that define this timepiece."
|
||||
features={features}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="product-testimonials" data-section="product-testimonials">
|
||||
<TestimonialCardThirteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Arthur Sterling",
|
||||
handle: "@arthur.s",
|
||||
testimonial: "The Chronos Masterpiece is truly magnificent. The attention to detail and the smooth sweep of the seconds hand are captivating. A true work of art!",
|
||||
rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BPSYpjXlk69WrIECU6nXnUWdiQ/professional-portrait-of-a-distinguished-1774389485197-ccde6b93.png?_wi=2",
|
||||
imageAlt: "Portrait of Arthur Sterling",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Eleanor Vance",
|
||||
handle: "@vance_art",
|
||||
testimonial: "I've owned many luxury watches, but the elegance and precision of this timepiece are unmatched. It feels substantial yet incredibly comfortable.",
|
||||
rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BPSYpjXlk69WrIECU6nXnUWdiQ/elegant-portrait-of-a-sophisticated-woma-1774389484448-a7bdcdc3.png?_wi=2",
|
||||
imageAlt: "Portrait of Eleanor Vance",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Julian Croft",
|
||||
handle: "@tech_time",
|
||||
testimonial: "As a tech enthusiast, I appreciate the blend of traditional watchmaking with modern performance. The Chronos is a daily joy to wear.",
|
||||
rating: 4,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BPSYpjXlk69WrIECU6nXnUWdiQ/charismatic-portrait-of-a-young-entrepre-1774389482972-386880e8.png?_wi=2",
|
||||
imageAlt: "Portrait of Julian Croft",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Sophia Moretti",
|
||||
handle: "@sophia.m",
|
||||
testimonial: "An absolutely stunning watch that garners compliments wherever I go. The quality is palpable, and it keeps perfect time. Highly recommended.",
|
||||
rating: 5,
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BPSYpjXlk69WrIECU6nXnUWdiQ/refined-portrait-of-an-established-finan-1774389484076-8428636b.png?_wi=2",
|
||||
imageAlt: "Portrait of Sophia Moretti",
|
||||
},
|
||||
]}
|
||||
showRating={true}
|
||||
title="What Our Connoisseurs Say"
|
||||
description="Hear from owners who appreciate the exceptional quality and timeless beauty of Horologium Lux watches."
|
||||
/>
|
||||
</div>
|
||||
<div id="tech-specs" data-section="tech-specs">
|
||||
<FeatureListDisplay
|
||||
title="Technical Specifications"
|
||||
description="Detailed information about the watch's engineering."
|
||||
features={techSpecs}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="related-products" data-section="related-products">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
brand: "Horologium Lux",
|
||||
name: "The Stellar Grand",
|
||||
price: "$18,000",
|
||||
rating: 4.8,
|
||||
reviewCount: "32 Reviews",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BPSYpjXlk69WrIECU6nXnUWdiQ/a-hyper-realistic-3d-render-of-a-luxury--1774389483239-0ed0d78d.png?_wi=2",
|
||||
imageAlt: "The Stellar Grand luxury mechanical watch",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
brand: "Horologium Lux",
|
||||
name: "The Apex Diver",
|
||||
price: "$9,800",
|
||||
rating: 4.7,
|
||||
reviewCount: "58 Reviews",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BPSYpjXlk69WrIECU6nXnUWdiQ/a-hyper-realistic-3d-render-of-a-luxury--1774389482765-b841e8a7.png?_wi=2",
|
||||
imageAlt: "The Apex Diver luxury sports chronograph",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
brand: "Horologium Lux",
|
||||
name: "The Lumina Elegance",
|
||||
price: "$7,200",
|
||||
rating: 4.9,
|
||||
reviewCount: "25 Reviews",
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3BPSYpjXlk69WrIECU6nXnUWdiQ/a-hyper-realistic-3d-render-of-an-elegan-1774389487668-ca306c3d.png?_wi=2",
|
||||
imageAlt: "The Lumina Elegance elegant dress watch",
|
||||
},
|
||||
]}
|
||||
title="Discover More Timepieces"
|
||||
description="Explore other exceptional watches from the Horologium Lux collection, each a testament to luxury and precision."
|
||||
/>
|
||||
</div>
|
||||
<div id="materials" data-section="materials">
|
||||
<FeatureListDisplay
|
||||
title="Materials & Craftsmanship"
|
||||
description="The finest components and meticulous hand-assembly."
|
||||
features={materialFeatures}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Shop",
|
||||
items: [
|
||||
{
|
||||
label: "New Arrivals",
|
||||
href: "/shop/new",
|
||||
},
|
||||
{
|
||||
label: "Mechanical",
|
||||
href: "/shop/mechanical",
|
||||
},
|
||||
{
|
||||
label: "Quartz",
|
||||
href: "/shop/quartz",
|
||||
},
|
||||
{
|
||||
label: "Limited Editions",
|
||||
href: "/shop/limited",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "About Us",
|
||||
items: [
|
||||
{
|
||||
label: "Our Heritage",
|
||||
href: "/about/heritage",
|
||||
},
|
||||
{
|
||||
label: "Craftsmanship",
|
||||
href: "/about/craftsmanship",
|
||||
},
|
||||
{
|
||||
label: "Our Team",
|
||||
href: "/about/team",
|
||||
},
|
||||
{
|
||||
label: "Press",
|
||||
href: "/about/press",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{
|
||||
label: "Contact Us",
|
||||
href: "/contact",
|
||||
},
|
||||
{
|
||||
label: "FAQs",
|
||||
href: "/faq",
|
||||
},
|
||||
{
|
||||
label: "Warranty",
|
||||
href: "/support/warranty",
|
||||
},
|
||||
{
|
||||
label: "Servicing",
|
||||
href: "/support/servicing",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2025 THE ESSENCE OF TIME. All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseReveal
|
||||
columns={[
|
||||
{
|
||||
title: "Explore", items: [
|
||||
{ label: "Home", href: "/" },
|
||||
{ label: "Collection", href: "/collection" },
|
||||
{ label: "About Us", href: "/about" },
|
||||
{ label: "Contact", href: "/contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal", items: [
|
||||
{ label: "Terms of Service", href: "#" },
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Shipping & Returns", href: "#" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Connect", items: [
|
||||
{ label: "Instagram", href: "https://instagram.com" },
|
||||
{ label: "Facebook", href: "https://facebook.com" },
|
||||
{ label: "LinkedIn", href: "https://linkedin.com" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user