238 lines
11 KiB
TypeScript
238 lines
11 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
|
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
|
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
|
|
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
|
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
|
|
import MediaAbout from '@/components/sections/about/MediaAbout';
|
|
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
|
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
|
|
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
|
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="elastic-effect"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="pill"
|
|
contentWidth="mediumSmall"
|
|
sizing="largeSmallSizeLargeTitles"
|
|
background="blurBottom"
|
|
cardStyle="layered-gradient"
|
|
primaryButtonStyle="primary-glow"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="normal"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleApple
|
|
navItems={[
|
|
{
|
|
name: "Home", id: "hero"},
|
|
{
|
|
name: "About", id: "about"},
|
|
{
|
|
name: "Collection", id: "product"},
|
|
{
|
|
name: "Contact", id: "contact"},
|
|
]}
|
|
brandName="Aurum Luxury"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroBillboard
|
|
background={{
|
|
variant: "gradient-bars"}}
|
|
title="Timeless Elegance in Gold"
|
|
description="Discover our collection of handcrafted, luxury gold jewellery designed to last a lifetime."
|
|
buttons={[
|
|
{
|
|
text: "Explore Collection", href: "#product"},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/summer-portrait-stylish-woman-with-big-trendy-accessorises-earrings-posing-beach_273443-4250.jpg"
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/close-up-portrait-elegant-beautiful-woman-sitting-vintage-cafe-black-velvet-dress-evening-gown-rich-stylish-lady-elegant-fashion-trend-holding-golden-purse-hands_285396-7234.jpg", alt: "Elegant customer in velvet"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/high-fashion-look-glamor-closeup-portrait-beautiful-sexy-stylish-brunette-caucasian-young-woman-model-with-bright-makeup_158538-2781.jpg", alt: "Glamor fashion model"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/pretty-young-caucasian-brunette-woman-black-blouse-with-closed-eyes-keeps-hand-face-smiling-purple-background_197531-32085.jpg", alt: "Smiling customer"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/pretty-calm-young-tanned-blonde-woman-dark-green-top-with-golden-medallion-poses-with-closed-eyes-near-white-wall-with-palm-leaf_197531-19488.jpg", alt: "Tanned woman portrait"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-with-gold-butterflys-decor-isolated-grey-background_613910-10772.jpg", alt: "Customer with butterfly decor"},
|
|
]}
|
|
marqueeItems={[
|
|
{
|
|
type: "text", text: "Handcrafted"},
|
|
{
|
|
type: "text", text: "Luxury Gold"},
|
|
{
|
|
type: "text", text: "Ethical Sourcing"},
|
|
{
|
|
type: "text", text: "Premium Quality"},
|
|
{
|
|
type: "text", text: "Lifetime Promise"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<MediaAbout
|
|
useInvertedBackground={true}
|
|
title="Mastering the Art of Gold"
|
|
description="For over three decades, we have dedicated ourselves to the meticulous craft of creating exquisite gold jewellery that celebrates life's most precious moments."
|
|
imageSrc="http://img.b2bpic.net/free-photo/close-up-tools-cutting-wire_23-2148643276.jpg"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardNine
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
title: "Conflict-Free Gold", description: "Ethically sourced materials.", phoneOne: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/view-luxurious-golden-ring-with-transparent-glass_23-2150329681.jpg", imageAlt: "gold ring diamond setting"},
|
|
phoneTwo: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/jewelry-lifestyle-flat-layout-with-place-text-jewellery-background-mockup-banner-fashion-accessories_460848-12601.jpg", imageAlt: "gold ring diamond setting"},
|
|
},
|
|
{
|
|
title: "Expert Craftsmanship", description: "Artisan-made jewellery.", phoneOne: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/unrecognisable-artistic-model-posing_23-2148376676.jpg", imageAlt: "gold ring diamond setting"},
|
|
phoneTwo: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/side-view-gold-plated-bracelet-ring-set-with-crystal-black-table_140725-12895.jpg", imageAlt: "gold ring diamond setting"},
|
|
},
|
|
{
|
|
title: "Lifetime Warranty", description: "Guaranteed quality and durability.", phoneOne: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/flexible-glass-rings-vintage-chain-art_1400-29.jpg", imageAlt: "gold ring diamond setting"},
|
|
phoneTwo: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-clock-with-time-change_23-2149241140.jpg", imageAlt: "gold ring diamond setting"},
|
|
},
|
|
]}
|
|
showStepNumbers={false}
|
|
title="The Aurum Promise"
|
|
description="Our commitment to quality ensures every piece meets the highest standards."
|
|
/>
|
|
</div>
|
|
|
|
<div id="product" data-section="product">
|
|
<ProductCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="uniform-all-items-equal"
|
|
useInvertedBackground={true}
|
|
products={[
|
|
{
|
|
id: "1", brand: "Aurum", name: "Classic Gold Ring", price: "$1,200", rating: 5,
|
|
reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-photo/divorce-concept-with-smartphone_23-2148558440.jpg"},
|
|
{
|
|
id: "2", brand: "Aurum", name: "Gold Chain Necklace", price: "$2,500", rating: 5,
|
|
reviewCount: "85", imageSrc: "http://img.b2bpic.net/free-photo/luxurious-shiny-golden-chain_23-2149635290.jpg"},
|
|
{
|
|
id: "3", brand: "Aurum", name: "Diamond Drop Earrings", price: "$1,800", rating: 4,
|
|
reviewCount: "62", imageSrc: "http://img.b2bpic.net/free-photo/indoor-portrait-lovable-brunette-woman-with-plant-lovely-young-lady-with-black-hair-holding-flower_197531-14059.jpg"},
|
|
{
|
|
id: "4", brand: "Aurum", name: "Golden Bangle", price: "$900", rating: 5,
|
|
reviewCount: "44", imageSrc: "http://img.b2bpic.net/free-photo/unrecognisable-woman-posing-studio_23-2148376621.jpg"},
|
|
{
|
|
id: "5", brand: "Aurum", name: "Signature Pendant", price: "$1,100", rating: 4,
|
|
reviewCount: "98", imageSrc: "http://img.b2bpic.net/free-photo/bright-silver-pendant-background-elegance-precious_1400-33.jpg"},
|
|
{
|
|
id: "6", brand: "Aurum", name: "Luxury Watch", price: "$3,500", rating: 5,
|
|
reviewCount: "32", imageSrc: "http://img.b2bpic.net/free-photo/top-view-golden-chain-coffee-cup_23-2149836479.jpg"},
|
|
]}
|
|
title="Curated Jewellery"
|
|
description="The finest selection of gold masterpieces."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonial" data-section="testimonial">
|
|
<TestimonialCardFifteen
|
|
useInvertedBackground={false}
|
|
testimonial="The quality of craftsmanship is unparalleled. My ring is stunning."
|
|
rating={5}
|
|
author="Elena Rossi"
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/portrait-beautiful-woman-with-gold-butterflys-decor-isolated-grey-background_613910-10774.jpg", alt: "Elena"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/european-woman-with-bright-make-up-elegant-outfit-preparing-birthday-party_291650-582.jpg", alt: "Mark"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/attractive-woman-posing-with-dry-leaf-blue-background_197531-28551.jpg", alt: "Sarah"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/young-couple-buying-jewelry_7502-7606.jpg", alt: "David"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/young-woman-wearing-chain-necklace_23-2149490499.jpg", alt: "Sophia"},
|
|
]}
|
|
ratingAnimation="slide-up"
|
|
avatarsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="social" data-section="social">
|
|
<SocialProofOne
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
names={[
|
|
"Vogue", "Harper's Bazaar", "ELLE", "GQ", "Tatler"]}
|
|
title="Featured In"
|
|
description="Recognized globally for our excellence."
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitMedia
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{
|
|
id: "q1", title: "How do I care for my gold jewellery?", content: "Clean gently with warm soapy water."},
|
|
{
|
|
id: "q2", title: "Do you provide insurance?", content: "Yes, all purchases include appraisal."},
|
|
{
|
|
id: "q3", title: "What is the return policy?", content: "30-day return policy for unused items."},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/horizontal-view-hand-holding-decoration-accessories-right-side-dark-background_140725-60136.jpg"
|
|
mediaAnimation="slide-up"
|
|
title="Frequently Asked Questions"
|
|
description="Information regarding your luxury purchase."
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplitForm
|
|
useInvertedBackground={true}
|
|
title="Get in Touch"
|
|
description="Visit our boutique or request a custom design."
|
|
inputs={[
|
|
{
|
|
name: "name", type: "text", placeholder: "Name"},
|
|
{
|
|
name: "email", type: "email", placeholder: "Email Address"},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/stripes-geometric-shapes-background_23-2148772501.jpg"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterLogoReveal
|
|
logoText="Aurum Luxury"
|
|
leftLink={{
|
|
text: "Privacy Policy", href: "#"}}
|
|
rightLink={{
|
|
text: "Terms & Conditions", href: "#"}}
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|