Merge version_2 into main #1
297
src/app/page.tsx
297
src/app/page.tsx
@@ -17,13 +17,13 @@ import { Camera, Layers, Palette } from "lucide-react";
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="expand-hover"
|
||||
defaultButtonVariant="hover-magnetic"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="mediumLarge"
|
||||
sizing="largeSizeMediumTitles"
|
||||
background="fluid"
|
||||
cardStyle="subtle-shadow"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="flat"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="semibold"
|
||||
@@ -33,74 +33,47 @@ export default function LandingPage() {
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Kollektion",
|
||||
id: "#collection",
|
||||
},
|
||||
name: "Kollektion", id: "#collection"},
|
||||
{
|
||||
name: "Markenstory",
|
||||
id: "#about",
|
||||
},
|
||||
name: "Markenstory", id: "#about"},
|
||||
{
|
||||
name: "Anprobe",
|
||||
id: "#tryon",
|
||||
},
|
||||
name: "Anprobe", id: "#tryon"},
|
||||
{
|
||||
name: "Termin",
|
||||
id: "#contact",
|
||||
},
|
||||
name: "Termin", id: "#contact"},
|
||||
]}
|
||||
logoSrc="http://img.b2bpic.net/free-photo/sensual-glamour-portrait-beautiful-blond-woman-model-with-fresh-daily-makeup-with-purple-lips-color-clean-healthy-skin-glasses-black-white_158538-10438.jpg"
|
||||
logoAlt="Opulent Optics Logo"
|
||||
brandName="Opulent Optics"
|
||||
button={{
|
||||
text: "Showroom",
|
||||
href: "#contact",
|
||||
}}
|
||||
text: "Showroom", href: "#contact"}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
variant: "radial-gradient"}}
|
||||
title="Luxury Eyewear Redefined"
|
||||
description="Handcrafted designer glasses for those who see the world differently."
|
||||
buttons={[
|
||||
{
|
||||
text: "Kollektion entdecken",
|
||||
href: "#collection",
|
||||
},
|
||||
text: "Kollektion entdecken", href: "#collection"},
|
||||
{
|
||||
text: "Virtuell anprobieren",
|
||||
href: "#tryon",
|
||||
},
|
||||
text: "Virtuell anprobieren", href: "#tryon"},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/glasses-with-slightly-rounded-frame_23-2150670729.jpg",
|
||||
imageAlt: "Luxury gold rim glasses 3D render",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/glasses-with-slightly-rounded-frame_23-2150670729.jpg", imageAlt: "Luxury gold rim glasses 3D render"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/glasses-with-slightly-rounded-frame_23-2150670770.jpg",
|
||||
imageAlt: "Luxury emerald acetate glasses 3D render",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/glasses-with-slightly-rounded-frame_23-2150670770.jpg", imageAlt: "Luxury emerald acetate glasses 3D render"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/glasses-with-slightly-rounded-frame_23-2150670782.jpg",
|
||||
imageAlt: "Luxury silver frame glasses 3D render",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/glasses-with-slightly-rounded-frame_23-2150670782.jpg", imageAlt: "Luxury silver frame glasses 3D render"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-with-glasses-dark-looks-computer-screen-copy-space_169016-14890.jpg",
|
||||
imageAlt: "Luxury titanium frame glasses 3D render",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-with-glasses-dark-looks-computer-screen-copy-space_169016-14890.jpg", imageAlt: "Luxury titanium frame glasses 3D render"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/sensual-glamour-portrait-beautiful-blond-woman-model-with-fresh-daily-makeup-with-purple-lips-color-clean-healthy-skin-glasses_158538-10451.jpg",
|
||||
imageAlt: "Luxury polished black acetate glasses 3D render",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/sensual-glamour-portrait-beautiful-blond-woman-model-with-fresh-daily-makeup-with-purple-lips-color-clean-healthy-skin-glasses_158538-10451.jpg", imageAlt: "Luxury polished black acetate glasses 3D render"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/glasses-with-rounded-frames-still-life_23-2150649685.jpg",
|
||||
imageAlt: "Luxury unique design glasses 3D render",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/glasses-with-rounded-frames-still-life_23-2150649685.jpg", imageAlt: "Luxury unique design glasses 3D render"},
|
||||
]}
|
||||
mediaAnimation="opacity"
|
||||
/>
|
||||
@@ -115,17 +88,11 @@ export default function LandingPage() {
|
||||
description="Bei Opulent Optics verbinden wir jahrhundertealte Handwerkstradition mit modernster Technologie. Jedes Paar Brillen ist ein Meisterwerk, gefertigt aus erlesensten Materialien wie italienischem Acetat, japanischem Titan und edlen Goldakzenten. Wir kreieren nicht nur Brillen, sondern Kunstwerke, die Ihre Persönlichkeit unterstreichen und Ihre Sichtweise auf die Welt verändern."
|
||||
bulletPoints={[
|
||||
{
|
||||
title: "Exquisite Materialien",
|
||||
description: "Nur die feinsten Materialien: Titan, handpoliertes Acetat, Gold und präzisionsgeschliffene Gläser.",
|
||||
},
|
||||
title: "Exquisite Materialien", description: "Nur die feinsten Materialien: Titan, handpoliertes Acetat, Gold und präzisionsgeschliffene Gläser."},
|
||||
{
|
||||
title: "Meisterliche Handwerkskunst",
|
||||
description: "Jede Fassung wird von erfahrenen Handwerkern mit Leidenschaft und Präzision gefertigt.",
|
||||
},
|
||||
title: "Meisterliche Handwerkskunst", description: "Jede Fassung wird von erfahrenen Handwerkern mit Leidenschaft und Präzision gefertigt."},
|
||||
{
|
||||
title: "Innovatives Design",
|
||||
description: "Zeitloses Design trifft auf avantgardistische Formen und zukunftsweisende Ästhetik.",
|
||||
},
|
||||
title: "Innovatives Design", description: "Zeitloses Design trifft auf avantgardistische Formen und zukunftsweisende Ästhetik."},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/medium-shot-woman-working-beer-factory_23-2150573903.jpg"
|
||||
imageAlt="Craftsman working on luxury eyewear detail"
|
||||
@@ -135,68 +102,26 @@ export default function LandingPage() {
|
||||
|
||||
<div id="collection" data-section="collection">
|
||||
<ProductCardFour
|
||||
animationType="slide-up"
|
||||
animationType="scale-rotate"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
carouselMode="buttons"
|
||||
products={[
|
||||
{
|
||||
id: "prod-1",
|
||||
name: "Aethelred",
|
||||
price: "€1,299",
|
||||
variant: "Champagner-Gold",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/positive-elegant-young-woman-hat-eyeglasses-with-mug-drink_23-2148068361.jpg",
|
||||
imageAlt: "Luxury gold rim round spectacles",
|
||||
},
|
||||
id: "prod-1", name: "Aethelred", price: "€1,299", variant: "Champagner-Gold", imageSrc: "http://img.b2bpic.net/free-photo/positive-elegant-young-woman-hat-eyeglasses-with-mug-drink_23-2148068361.jpg", imageAlt: "Luxury gold rim round spectacles"},
|
||||
{
|
||||
id: "prod-2",
|
||||
name: "Veridian",
|
||||
price: "€1,149",
|
||||
variant: "Tiefes Smaragdgrün",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/glasses-with-rounded-frames-still-life_23-2150649669.jpg",
|
||||
imageAlt: "Luxury emerald acetate square glasses",
|
||||
},
|
||||
id: "prod-2", name: "Veridian", price: "€1,149", variant: "Tiefes Smaragdgrün", imageSrc: "http://img.b2bpic.net/free-photo/glasses-with-rounded-frames-still-life_23-2150649669.jpg", imageAlt: "Luxury emerald acetate square glasses"},
|
||||
{
|
||||
id: "prod-3",
|
||||
name: "Titania",
|
||||
price: "€1,499",
|
||||
variant: "Gebürstetes Titan",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/glasses-with-slightly-rounded-frame_23-2150670722.jpg",
|
||||
imageAlt: "Luxury titanium frame aviator glasses",
|
||||
},
|
||||
id: "prod-3", name: "Titania", price: "€1,499", variant: "Gebürstetes Titan", imageSrc: "http://img.b2bpic.net/free-photo/glasses-with-slightly-rounded-frame_23-2150670722.jpg", imageAlt: "Luxury titanium frame aviator glasses"},
|
||||
{
|
||||
id: "prod-4",
|
||||
name: "Zenith",
|
||||
price: "€1,899",
|
||||
variant: "Limitierte Edition",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/colored-transparent-sunglasses-still-life_23-2150163152.jpg",
|
||||
imageAlt: "Exclusive unique design luxury eyewear",
|
||||
},
|
||||
id: "prod-4", name: "Zenith", price: "€1,899", variant: "Limitierte Edition", imageSrc: "http://img.b2bpic.net/free-photo/colored-transparent-sunglasses-still-life_23-2150163152.jpg", imageAlt: "Exclusive unique design luxury eyewear"},
|
||||
{
|
||||
id: "prod-5",
|
||||
name: "Clarity",
|
||||
price: "€999",
|
||||
variant: "Kristallklar",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/black-eye-glasses-isolated-white_493343-29825.jpg",
|
||||
imageAlt: "Luxury crystal frame clear glasses",
|
||||
},
|
||||
id: "prod-5", name: "Clarity", price: "€999", variant: "Kristallklar", imageSrc: "http://img.b2bpic.net/free-photo/black-eye-glasses-isolated-white_493343-29825.jpg", imageAlt: "Luxury crystal frame clear glasses"},
|
||||
{
|
||||
id: "prod-6",
|
||||
name: "Obsidian",
|
||||
price: "€899",
|
||||
variant: "Polarisierte Sonnenbrille",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/sexy-woman-with-long-hair-leather-clothes-night-city-street_158595-3337.jpg",
|
||||
imageAlt: "Luxury polarized black sunglasses",
|
||||
},
|
||||
id: "prod-6", name: "Obsidian", price: "€899", variant: "Polarisierte Sonnenbrille", imageSrc: "http://img.b2bpic.net/free-photo/sexy-woman-with-long-hair-leather-clothes-night-city-street_158595-3337.jpg", imageAlt: "Luxury polarized black sunglasses"},
|
||||
{
|
||||
id: "prod-7",
|
||||
name: "Visionair",
|
||||
price: "€949",
|
||||
variant: "Korrekturbrille",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-man-model-with-smile-black-fashionable-leather-jacket-colorful-pink-neon-lights_231208-14379.jpg",
|
||||
imageAlt: "Luxury prescription clear lens glasses",
|
||||
},
|
||||
id: "prod-7", name: "Visionair", price: "€949", variant: "Korrekturbrille", imageSrc: "http://img.b2bpic.net/free-photo/young-man-model-with-smile-black-fashionable-leather-jacket-colorful-pink-neon-lights_231208-14379.jpg", imageAlt: "Luxury prescription clear lens glasses"},
|
||||
]}
|
||||
title="Exklusive Kollektion & Limitierte Editionen"
|
||||
description="Entdecken Sie unsere sorgfältig kuratierte Auswahl an Luxusbrillen. Jedes Modell ist ein Statement für Stil und Raffinesse, von zeitlosen Klassikern bis zu avantgardistischen Limited Editions."
|
||||
@@ -205,25 +130,19 @@ export default function LandingPage() {
|
||||
|
||||
<div id="tryon" data-section="tryon">
|
||||
<FeatureBorderGlow
|
||||
animationType="slide-up"
|
||||
animationType="scale-rotate"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
icon: Camera,
|
||||
title: "Echtzeit-Vorschau",
|
||||
description: "Sehen Sie die Brille live auf Ihrem Gesicht, angepasst an Ihre Kopfform.",
|
||||
},
|
||||
title: "Echtzeit-Vorschau", description: "Sehen Sie die Brille live auf Ihrem Gesicht, angepasst an Ihre Kopfform."},
|
||||
{
|
||||
icon: Layers,
|
||||
title: "3D-Rotation & Zoom",
|
||||
description: "Betrachten Sie jedes Detail aus allen Blickwinkeln mit interaktiven 3D-Modellen.",
|
||||
},
|
||||
title: "3D-Rotation & Zoom", description: "Betrachten Sie jedes Detail aus allen Blickwinkeln mit interaktiven 3D-Modellen."},
|
||||
{
|
||||
icon: Palette,
|
||||
title: "Farb- und Materialwahl",
|
||||
description: "Experimentieren Sie mit verschiedenen Tönungen und Materialien direkt in der Anprobe.",
|
||||
},
|
||||
title: "Farb- und Materialwahl", description: "Experimentieren Sie mit verschiedenen Tönungen und Materialien direkt in der Anprobe."},
|
||||
]}
|
||||
title="Virtuell anprobieren: Ihr Digitaler Spiegel"
|
||||
description="Erleben Sie unsere Kollektion, als wären Sie in unserem Showroom. Wählen Sie Ihr Wunschmodell und nutzen Sie unsere innovative 3D-Anprobe, um zu sehen, wie die Brille an Ihnen aussieht – ganz bequem von zu Hause aus."
|
||||
@@ -232,34 +151,16 @@ export default function LandingPage() {
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardEleven
|
||||
animationType="slide-up"
|
||||
animationType="scale-rotate"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "25+",
|
||||
title: "Jahre Handwerkskunst",
|
||||
description: "Tradition und Innovation seit über zwei Dekaden.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/steel-shiny-progress-turning-teamwork_1112-1057.jpg",
|
||||
imageAlt: "Vintage clock gears",
|
||||
},
|
||||
id: "m1", value: "25+", title: "Jahre Handwerkskunst", description: "Tradition und Innovation seit über zwei Dekaden.", imageSrc: "http://img.b2bpic.net/free-photo/steel-shiny-progress-turning-teamwork_1112-1057.jpg", imageAlt: "Vintage clock gears"},
|
||||
{
|
||||
id: "m2",
|
||||
value: "100%",
|
||||
title: "Handgefertigt",
|
||||
description: "Jedes Paar wird sorgfältig von Hand gefertigt, für höchste Qualität.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/craftswoman-working-workshop_107420-65276.jpg",
|
||||
imageAlt: "Diamond cutting process",
|
||||
},
|
||||
id: "m2", value: "100%", title: "Handgefertigt", description: "Jedes Paar wird sorgfältig von Hand gefertigt, für höchste Qualität.", imageSrc: "http://img.b2bpic.net/free-photo/craftswoman-working-workshop_107420-65276.jpg", imageAlt: "Diamond cutting process"},
|
||||
{
|
||||
id: "m3",
|
||||
value: "500+",
|
||||
title: "Exklusive Designs",
|
||||
description: "Eine ständig wachsende Kollektion einzigartiger und limitierter Modelle.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-working-with-geometric-triangle-pen_23-2148039880.jpg",
|
||||
imageAlt: "Elegant design sketch",
|
||||
},
|
||||
id: "m3", value: "500+", title: "Exklusive Designs", description: "Eine ständig wachsende Kollektion einzigartiger und limitierter Modelle.", imageSrc: "http://img.b2bpic.net/free-photo/woman-working-with-geometric-triangle-pen_23-2148039880.jpg", imageAlt: "Elegant design sketch"},
|
||||
]}
|
||||
title="Opulent Optics in Zahlen"
|
||||
description="Unsere Hingabe an Perfektion spiegelt sich in jedem Detail wider. Wir sind stolz auf unsere Geschichte und unsere zukunftsweisende Vision."
|
||||
@@ -271,14 +172,7 @@ export default function LandingPage() {
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
names={[
|
||||
"Versace",
|
||||
"Prada",
|
||||
"Chanel",
|
||||
"Gucci",
|
||||
"Dior",
|
||||
"Cartier",
|
||||
"Louis Vuitton",
|
||||
]}
|
||||
"Versace", "Prada", "Chanel", "Gucci", "Dior", "Cartier", "Louis Vuitton"]}
|
||||
title="Gesehen bei führenden Luxusmarken"
|
||||
description="Unsere Designs werden von Kennern der Luxuswelt geschätzt und sind in ausgewählten Boutiquen weltweit vertreten."
|
||||
/>
|
||||
@@ -286,58 +180,28 @@ export default function LandingPage() {
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
animationType="slide-up"
|
||||
animationType="depth-3d"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Isabella Schmidt",
|
||||
handle: "@isabella.s",
|
||||
testimonial: "Die Brillen von Opulent Optics sind einfach atemberaubend. Die Qualität und das Design übertreffen alles, was ich bisher kannte. Ein echtes Statement-Piece!",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pretty-woman-grey-jacket-white-shirt-sunglasses-with-red-lipstick-is-touching-hair-posing-near-her-house-beautiful-lady-grey-oversize-jacket-pants-walks-outside_291650-2564.jpg",
|
||||
},
|
||||
id: "1", name: "Isabella Schmidt", handle: "@isabella.s", testimonial: "Die Brillen von Opulent Optics sind einfach atemberaubend. Die Qualität und das Design übertreffen alles, was ich bisher kannte. Ein echtes Statement-Piece!", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pretty-woman-grey-jacket-white-shirt-sunglasses-with-red-lipstick-is-touching-hair-posing-near-her-house-beautiful-lady-grey-oversize-jacket-pants-walks-outside_291650-2564.jpg"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Maximilian Bauer",
|
||||
handle: "@max.b_official",
|
||||
testimonial: "Endlich eine Marke, die Luxus und Komfort perfekt vereint. Die virtuelle Anprobe ist fantastisch und hat mir die Entscheidung leicht gemacht.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-blond-muscular-male-sunglasses-dressed-white-t-shirt-brown-leather-jacket_613910-12778.jpg",
|
||||
},
|
||||
id: "2", name: "Maximilian Bauer", handle: "@max.b_official", testimonial: "Endlich eine Marke, die Luxus und Komfort perfekt vereint. Die virtuelle Anprobe ist fantastisch und hat mir die Entscheidung leicht gemacht.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/handsome-blond-muscular-male-sunglasses-dressed-white-t-shirt-brown-leather-jacket_613910-12778.jpg"},
|
||||
{
|
||||
id: "3",
|
||||
name: "Sophie Richter",
|
||||
handle: "@sophie.r",
|
||||
testimonial: "Jedes Detail ist makellos. Ich werde oft auf meine Brille angesprochen. Opulent Optics hat einen neuen Standard für Luxusbrillen gesetzt.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-wearing-black-turtleneck-fanny-pack_250224-351.jpg",
|
||||
},
|
||||
id: "3", name: "Sophie Richter", handle: "@sophie.r", testimonial: "Jedes Detail ist makellos. Ich werde oft auf meine Brille angesprochen. Opulent Optics hat einen neuen Standard für Luxusbrillen gesetzt.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-wearing-black-turtleneck-fanny-pack_250224-351.jpg"},
|
||||
{
|
||||
id: "4",
|
||||
name: "Thomas Wagner",
|
||||
handle: "@thomas.w",
|
||||
testimonial: "Von der Beratung bis zum Produkt – ein erstklassiges Erlebnis. Die Handwerkskunst ist unvergleichlich, und die Materialien fühlen sich einfach unglaublich an.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blue-eyed-woman-with-short-hair-glasses_1304-3049.jpg",
|
||||
},
|
||||
id: "4", name: "Thomas Wagner", handle: "@thomas.w", testimonial: "Von der Beratung bis zum Produkt – ein erstklassiges Erlebnis. Die Handwerkskunst ist unvergleichlich, und die Materialien fühlen sich einfach unglaublich an.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blue-eyed-woman-with-short-hair-glasses_1304-3049.jpg"},
|
||||
{
|
||||
id: "5",
|
||||
name: "Lena Fischer",
|
||||
handle: "@lena.f_vision",
|
||||
testimonial: "Meine neue Brille ist nicht nur ein Accessoire, sondern ein Teil meiner Persönlichkeit geworden. Der Tragekomfort ist hervorragend, und das Design einzigartig.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/styilish-punk-girl-wirh-dreadlocks-tatooes-her-hands-big-toned-glasses-is-standing-skyscraper_613910-3859.jpg",
|
||||
},
|
||||
id: "5", name: "Lena Fischer", handle: "@lena.f_vision", testimonial: "Meine neue Brille ist nicht nur ein Accessoire, sondern ein Teil meiner Persönlichkeit geworden. Der Tragekomfort ist hervorragend, und das Design einzigartig.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/styilish-punk-girl-wirh-dreadlocks-tatooes-her-hands-big-toned-glasses-is-standing-skyscraper_613910-3859.jpg"},
|
||||
{
|
||||
id: "6",
|
||||
name: "Julian Becker",
|
||||
handle: "@julian.b_design",
|
||||
testimonial: "Als Designer schätze ich die Liebe zum Detail und die innovative Ästhetik. Die Brillen sind wahre Kunstwerke und eine Bereicherung für meine Kollektion.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/confident-middle-aged-blonde-superhero-woman-red-cape-wearing-grabbing-glasses-looking-front-isolated-white-wall-with-copy-space_141793-110302.jpg",
|
||||
},
|
||||
id: "6", name: "Julian Becker", handle: "@julian.b_design", testimonial: "Als Designer schätze ich die Liebe zum Detail und die innovative Ästhetik. Die Brillen sind wahre Kunstwerke und eine Bereicherung für meine Kollektion.", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/confident-middle-aged-blonde-superhero-woman-red-cape-wearing-grabbing-glasses-looking-front-isolated-white-wall-with-copy-space_141793-110302.jpg"},
|
||||
]}
|
||||
showRating={true}
|
||||
title="Was unsere Kunden sagen"
|
||||
@@ -349,8 +213,7 @@ export default function LandingPage() {
|
||||
<ContactSplit
|
||||
useInvertedBackground={true}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
variant: "plain"}}
|
||||
tag="Kontakt"
|
||||
title="Vereinbaren Sie einen Showroom-Termin"
|
||||
description="Erleben Sie unsere Kollektion persönlich in unserem exklusiven Showroom. Melden Sie sich für unseren Newsletter an, um über die neuesten Modelle und limitierte Editionen informiert zu bleiben."
|
||||
@@ -371,71 +234,43 @@ export default function LandingPage() {
|
||||
logoText="Opulent Optics"
|
||||
columns={[
|
||||
{
|
||||
title: "Kollektionen",
|
||||
items: [
|
||||
title: "Kollektionen", items: [
|
||||
{
|
||||
label: "Sonnenbrillen",
|
||||
href: "#collection",
|
||||
},
|
||||
label: "Sonnenbrillen", href: "#collection"},
|
||||
{
|
||||
label: "Korrekturbrillen",
|
||||
href: "#collection",
|
||||
},
|
||||
label: "Korrekturbrillen", href: "#collection"},
|
||||
{
|
||||
label: "Limitierte Editionen",
|
||||
href: "#collection",
|
||||
},
|
||||
label: "Limitierte Editionen", href: "#collection"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Über uns",
|
||||
items: [
|
||||
title: "Über uns", items: [
|
||||
{
|
||||
label: "Markenstory",
|
||||
href: "#about",
|
||||
},
|
||||
label: "Markenstory", href: "#about"},
|
||||
{
|
||||
label: "Showroom",
|
||||
href: "#contact",
|
||||
},
|
||||
label: "Showroom", href: "#contact"},
|
||||
{
|
||||
label: "Karriere",
|
||||
href: "#",
|
||||
},
|
||||
label: "Karriere", href: "#"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
title: "Support", items: [
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#",
|
||||
},
|
||||
label: "FAQ", href: "#"},
|
||||
{
|
||||
label: "Versand & Rückgabe",
|
||||
href: "#",
|
||||
},
|
||||
label: "Versand & Rückgabe", href: "#"},
|
||||
{
|
||||
label: "Kontakt",
|
||||
href: "#contact",
|
||||
},
|
||||
label: "Kontakt", href: "#contact"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Rechtliches",
|
||||
items: [
|
||||
title: "Rechtliches", items: [
|
||||
{
|
||||
label: "Datenschutz",
|
||||
href: "#",
|
||||
},
|
||||
label: "Datenschutz", href: "#"},
|
||||
{
|
||||
label: "Impressum",
|
||||
href: "#",
|
||||
},
|
||||
label: "Impressum", href: "#"},
|
||||
{
|
||||
label: "AGB",
|
||||
href: "#",
|
||||
},
|
||||
label: "AGB", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
|
||||
153
src/app/product-detail/page.tsx
Normal file
153
src/app/product-detail/page.tsx
Normal file
@@ -0,0 +1,153 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
||||
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
|
||||
import FeatureBorderGlow from '@/components/sections/feature/featureBorderGlow/FeatureBorderGlow';
|
||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import { Eye, Paintbrush, Gem } from "lucide-react";
|
||||
|
||||
export default function ProductDetailPage() {
|
||||
const navItems = [
|
||||
{
|
||||
name: "Kollektion", id: "/product-detail"},
|
||||
{
|
||||
name: "Markenstory", id: "/#about"},
|
||||
{
|
||||
name: "Anprobe", id: "/#tryon"},
|
||||
{
|
||||
name: "Termin", id: "/#contact"},
|
||||
];
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="expand-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="mediumLarge"
|
||||
sizing="largeSizeMediumTitles"
|
||||
background="fluid"
|
||||
cardStyle="subtle-shadow"
|
||||
primaryButtonStyle="flat"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={navItems}
|
||||
logoSrc="http://img.b2bpic.net/free-photo/sensual-glamour-portrait-beautiful-blond-woman-model-with-fresh-daily-makeup-with-purple-lips-color-clean-healthy-skin-glasses-black-white_158538-10438.jpg"
|
||||
logoAlt="Opulent Optics Logo"
|
||||
brandName="Opulent Optics"
|
||||
button={{
|
||||
text: "Showroom", href: "#contact"}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="product-viewer" data-section="product-viewer">
|
||||
<HeroSplitDualMedia
|
||||
background={{ variant: "radial-gradient" }}
|
||||
tag="Exklusive Edition"
|
||||
title="Zenith: Zeitlose Eleganz"
|
||||
description="Erleben Sie die Zenith-Kollektion in atemberaubender 3D-Präsentation. Zoomen Sie, drehen Sie und wählen Sie aus einer Vielzahl von Farben und Materialien. Handgefertigt aus feinstem japanischem Titan und poliertem italienischem Acetat, bietet Zenith unvergleichlichen Stil und Komfort. Preis: €1,899."
|
||||
buttons={[
|
||||
{
|
||||
text: "Zum Warenkorb hinzufügen (€1,899)", onClick: () => alert('Produkt zum Warenkorb hinzugefügt!'),
|
||||
},
|
||||
{
|
||||
text: "Showroom Termin buchen", href: "#contact"},
|
||||
]}
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/glasses-with-slightly-rounded-frame_23-2150670770.jpg", imageAlt: "Zenith glasses in emerald" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/glasses-with-slightly-rounded-frame_23-2150670729.jpg", imageAlt: "Zenith glasses in gold" },
|
||||
]}
|
||||
mediaAnimation="slide-up"
|
||||
rating={5}
|
||||
ratingText="Luxusbewertung"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="material-details" data-section="material-details">
|
||||
<FeatureBorderGlow
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
icon: Eye,
|
||||
title: "3D Viewer & Zoom", description: "Interaktive 3D-Ansicht mit detailliertem Zoom, um jedes Detail der Fassung zu erkunden."},
|
||||
{
|
||||
icon: Paintbrush,
|
||||
title: "Farb- und Oberflächenauswahl", description: "Personalisieren Sie Ihre Brille mit verschiedenen Farboptionen und Materialoberflächen wie matt, glänzend oder gebürstet."},
|
||||
{
|
||||
icon: Gem,
|
||||
title: "Premium Materialien", description: "Gefertigt aus ultraleichtem Titan und handpoliertem Acetat für höchsten Tragekomfort und Langlebigkeit."},
|
||||
]}
|
||||
title="Die Details machen den Unterschied"
|
||||
description="Entdecken Sie die präzise Ingenieurskunst und die hochwertigen Materialien, die jede Opulent Optics Brille zu einem Meisterwerk machen."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
useInvertedBackground={true}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Termin"
|
||||
title="Exklusiven Showroom-Termin buchen"
|
||||
description="Erleben Sie die Zenith-Kollektion und weitere Modelle persönlich. Unsere Stylisten beraten Sie gerne."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/portrait-smart-businesswoman-thinking_23-2148452670.jpg"
|
||||
imageAlt="Luxury eyewear showroom interior"
|
||||
mediaAnimation="opacity"
|
||||
mediaPosition="left"
|
||||
inputPlaceholder="Ihre E-Mail-Adresse"
|
||||
buttonText="Termin anfragen"
|
||||
termsText="Mit dem Absenden stimmen Sie unseren Datenschutzbestimmungen zu."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterMedia
|
||||
imageSrc="http://img.b2bpic.net/free-photo/optic-glasses-table_140725-7411.jpg"
|
||||
imageAlt="Luxury eyewear showroom interior with elegant display"
|
||||
logoText="Opulent Optics"
|
||||
columns={[
|
||||
{
|
||||
title: "Kollektionen", items: [
|
||||
{
|
||||
label: "Alle Modelle", href: "/product-detail"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Über uns", items: [
|
||||
{
|
||||
label: "Markenstory", href: "/#about"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support", items: [
|
||||
{
|
||||
label: "FAQ", href: "/#"},
|
||||
{
|
||||
label: "Kontakt", href: "#contact"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Rechtliches", items: [
|
||||
{
|
||||
label: "Datenschutz", href: "/#"},
|
||||
{
|
||||
label: "Impressum", href: "/#"},
|
||||
{
|
||||
label: "AGB", href: "/#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
copyrightText="© 2024 Opulent Optics. Alle Rechte vorbehalten."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user