366 lines
16 KiB
TypeScript
366 lines
16 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
|
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
|
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
|
|
import FooterBase from '@/components/sections/footer/FooterBase';
|
|
import HeroSplit from '@/components/sections/hero/HeroSplit';
|
|
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
|
|
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
|
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
|
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
|
|
import { Award, Crown, Diamond, Gem, Hammer, Handshake, Heart, Leaf, MessageCircle, Palette, Sparkles } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="expand-hover"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="rounded"
|
|
contentWidth="compact"
|
|
sizing="largeSmallSizeLargeTitles"
|
|
background="floatingGradient"
|
|
cardStyle="inset"
|
|
primaryButtonStyle="gradient"
|
|
secondaryButtonStyle="layered"
|
|
headingFontWeight="extrabold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleCentered
|
|
navItems={[
|
|
{
|
|
name: "Home", id: "#hero"},
|
|
{
|
|
name: "Shop", id: "#products"},
|
|
{
|
|
name: "About", id: "#about"},
|
|
{
|
|
name: "Quality", id: "#quality"},
|
|
{
|
|
name: "Testimonials", id: "#testimonials"},
|
|
{
|
|
name: "FAQ", id: "#faq"},
|
|
{
|
|
name: "Contact", id: "#contact"},
|
|
]}
|
|
button={{
|
|
text: "Cart"}}
|
|
brandName="Aurora Jewels"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroSplit
|
|
background={{
|
|
variant: "radial-gradient"}}
|
|
title="Timeless Jewelry Crafted for Life's Moments"
|
|
description="Discover handselected pieces that celebrate your story. From engagement rings to everyday elegance, explore jewelry designed to last."
|
|
buttons={[
|
|
{
|
|
text: "Shop Collection", href: "#products"},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/closeup-shot-female-wearing-beautiful-silver-necklace-with-diamond-pendant_181624-21106.jpg"
|
|
imageAlt="Elegant diamond necklace"
|
|
mediaAnimation="slide-up"
|
|
avatars={[
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/pretty-attractive-young-mixed-race-model-with-large-afro-wearing-navy-jacket-her-naked-body-shorts_633478-1216.jpg", alt: "Happy customer testimonial"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/woman-smiling_1187-3196.jpg", alt: "Smiling customer"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/image-corporate-woman-working-office-sitting-front-laptop-preparing-business_1258-194628.jpg", alt: "Satisfied client"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/young-blonde-businesswoman-smiling-happy-standing-city_839833-16454.jpg", alt: "Confident shopper"},
|
|
{
|
|
src: "http://img.b2bpic.net/free-photo/full-length-image-happy-bearded-man-busines-clothes-holding-laptop-computer-looking-awayy-gray_171337-11339.jpg", alt: "Pleased customer"},
|
|
]}
|
|
avatarText="Join 10,000+ happy customers"
|
|
marqueeItems={[
|
|
{
|
|
type: "text-icon", text: "Certified Quality", icon: Diamond,
|
|
},
|
|
{
|
|
type: "text", text: "Hand-crafted Perfection"},
|
|
{
|
|
type: "text-icon", text: "Ethically Sourced", icon: Leaf,
|
|
},
|
|
{
|
|
type: "text", text: "Custom Designs"},
|
|
{
|
|
type: "text-icon", text: "Timeless Elegance", icon: Sparkles,
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<FeatureCardTen
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
features={[
|
|
{
|
|
title: "Artisan Craftsmanship", description: "Each piece is meticulously hand-crafted by skilled artisans, ensuring unparalleled detail and lasting quality.", media: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/craftswoman-working-workshop_107420-65234.jpg", imageAlt: "Jeweler's hands crafting a ring"},
|
|
items: [
|
|
{
|
|
icon: Hammer,
|
|
text: "Hand-forged perfection"},
|
|
{
|
|
icon: Gem,
|
|
text: "Premium materials"},
|
|
{
|
|
icon: Sparkles,
|
|
text: "Unrivaled quality"},
|
|
],
|
|
reverse: false,
|
|
},
|
|
{
|
|
title: "Ethical Sourcing", description: "We are dedicated to responsible practices, sourcing conflict-free gemstones and precious metals with full transparency.", media: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/red-flowers-violet-seeds-ice-blocks_23-2148216341.jpg", imageAlt: "Ethically sourced raw gemstones"},
|
|
items: [
|
|
{
|
|
icon: Leaf,
|
|
text: "Conflict-free gems"},
|
|
{
|
|
icon: Award,
|
|
text: "Certified materials"},
|
|
{
|
|
icon: Handshake,
|
|
text: "Fair trade practices"},
|
|
],
|
|
reverse: true,
|
|
},
|
|
{
|
|
title: "Personalized Experience", description: "From custom designs to expert consultations, we offer a tailored journey to find or create your perfect piece of jewelry.", media: {
|
|
imageSrc: "http://img.b2bpic.net/free-photo/luxury-shine-diamonds-digital-art_23-2151695018.jpg?_wi=1", imageAlt: "Couple choosing an engagement ring"},
|
|
items: [
|
|
{
|
|
icon: Palette,
|
|
text: "Custom designs"},
|
|
{
|
|
icon: MessageCircle,
|
|
text: "Expert guidance"},
|
|
{
|
|
icon: Heart,
|
|
text: "Cherished memories"},
|
|
],
|
|
reverse: false,
|
|
},
|
|
]}
|
|
title="Our Commitment to Brilliance"
|
|
description="At Aurora Jewels, every piece tells a story of passion, precision, and enduring beauty. We believe in the power of jewelry to mark significant milestones and become cherished heirlooms."
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardOne
|
|
animationType="opacity"
|
|
textboxLayout="default"
|
|
gridVariant="two-columns-alternating-heights"
|
|
useInvertedBackground={false}
|
|
products={[
|
|
{
|
|
id: "1", name: "Diamond Solitaire Ring", price: "$2,500", imageSrc: "http://img.b2bpic.net/free-photo/luxury-shine-diamonds-digital-art_23-2151695018.jpg?_wi=2", imageAlt: "Diamond engagement ring"},
|
|
{
|
|
id: "2", name: "Gold Hoop Earrings", price: "$450", imageSrc: "http://img.b2bpic.net/free-photo/expensive-golden-ring-displayed-white-coral-background_23-2150347050.jpg", imageAlt: "Gold hoop earrings"},
|
|
{
|
|
id: "3", name: "Classic Pearl Necklace", price: "$890", imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-posing-with-old-phone_23-2150908634.jpg", imageAlt: "Pearl necklace"},
|
|
{
|
|
id: "4", name: "Silver Filigree Bracelet", price: "$320", imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-male-wearing-white-shirt-holding-silver-men-s-necklace_181624-57059.jpg", imageAlt: "Silver bracelet"},
|
|
{
|
|
id: "5", name: "Emerald Gemstone Pendant", price: "$1,100", imageSrc: "http://img.b2bpic.net/free-photo/close-up-purple-decoration_23-2149285581.jpg", imageAlt: "Emerald pendant"},
|
|
{
|
|
id: "6", name: "Men's Sapphire Cufflinks", price: "$680", imageSrc: "http://img.b2bpic.net/free-photo/solid-brunette-groom-black-suit-indoor-sunlight_1153-6103.jpg", imageAlt: "Men's sapphire cufflinks"},
|
|
]}
|
|
title="Curated Collections"
|
|
description="Explore our exquisite range of jewelry, from stunning engagement rings to elegant daily wear, meticulously crafted to perfection."
|
|
/>
|
|
</div>
|
|
|
|
<div id="quality" data-section="quality">
|
|
<PricingCardThree
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
plans={[
|
|
{
|
|
id: "everyday", badge: "Popular", badgeIcon: Sparkles,
|
|
price: "From $299", name: "Everyday Elegance", buttons: [
|
|
{
|
|
text: "View Collection", href: "#products"},
|
|
],
|
|
features: [
|
|
"Certified Sterling Silver", "Delicate & Modern Designs", "Hypoallergenic Materials", "Perfect for Daily Wear"],
|
|
},
|
|
{
|
|
id: "signature", badge: "Premium", badgeIcon: Crown,
|
|
price: "From $999", name: "Signature Collection", buttons: [
|
|
{
|
|
text: "Explore Signature", href: "#products"},
|
|
],
|
|
features: [
|
|
"14k/18k Gold Options", "Ethically Sourced Gemstones", "Timeless & Statement Pieces", "Hand-Polished Finish"],
|
|
},
|
|
{
|
|
id: "haute", badge: "Bespoke", badgeIcon: Diamond,
|
|
price: "On Request", name: "Haute Joaillerie", buttons: [
|
|
{
|
|
text: "Inquire Now", href: "#contact"},
|
|
],
|
|
features: [
|
|
"GIA Certified Diamonds", "Platinum & Exotic Settings", "Custom Design Consultations", "Rare & Exquisite Treasures"],
|
|
},
|
|
]}
|
|
title="Artistry in Every Detail"
|
|
description="Our collections are designed with unparalleled attention to detail, using the finest materials to create pieces that radiate timeless elegance."
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardTwo
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
gridVariant="uniform-all-items-equal"
|
|
useInvertedBackground={false}
|
|
metrics={[
|
|
{
|
|
id: "1", value: "10,000+", description: "Satisfied Customers"},
|
|
{
|
|
id: "2", value: "15+", description: "Years of Craftsmanship"},
|
|
{
|
|
id: "3", value: "500+", description: "Unique Designs"},
|
|
]}
|
|
title="Our Story in Numbers"
|
|
description="Proudly serving discerning customers, our commitment to excellence is reflected in every milestone we achieve."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardTwelve
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "1", name: "Eleanor Vance", imageSrc: "http://img.b2bpic.net/free-photo/business-woman-banner-concept-with-copy-space_23-2149601533.jpg", imageAlt: "Eleanor Vance"},
|
|
{
|
|
id: "2", name: "Marcus Thorne", imageSrc: "http://img.b2bpic.net/free-photo/full-length-image-bearded-man-busines-clothes-posing-with-crossed-arms-looking-camera-gray_171337-11333.jpg", imageAlt: "Marcus Thorne"},
|
|
{
|
|
id: "3", name: "Sophia Chen", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-cafe_273609-12703.jpg", imageAlt: "Sophia Chen"},
|
|
{
|
|
id: "4", name: "David Sterling", imageSrc: "http://img.b2bpic.net/free-photo/charming-lady-black-blouse-pointing-floor-ceiling-looking-cheerful_176474-40345.jpg", imageAlt: "David Sterling"},
|
|
{
|
|
id: "5", name: "Isabella Rossi", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-correcting-grammar-mistakes_23-2150171372.jpg", imageAlt: "Isabella Rossi"},
|
|
]}
|
|
cardTitle="What Our Customers Say"
|
|
cardTag="Cherished Moments"
|
|
cardAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="social-proof" data-section="social-proof">
|
|
<SocialProofOne
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
names={[
|
|
"GIA Certified", "Ethical Gems Inc.", "Luxury Living Magazine", "International Design Awards", "Master Jewelers Guild", "Sustainable Sourcing Alliance", "Customer Trust Certified"]}
|
|
title="Trusted by Experts"
|
|
description="We collaborate with leading industry associations and use certified materials to ensure the highest standards of quality and authenticity."
|
|
/>
|
|
</div>
|
|
|
|
<div id="faq" data-section="faq">
|
|
<FaqSplitText
|
|
useInvertedBackground={false}
|
|
faqs={[
|
|
{
|
|
id: "1", title: "What is your return policy?", content: "We offer a 30-day return policy for all unworn and undamaged jewelry. Items must be returned in their original packaging with proof of purchase."},
|
|
{
|
|
id: "2", title: "How do I determine my ring size?", content: "You can refer to our detailed ring size guide available on the product page, or visit a local jeweler for a precise measurement. We also offer complimentary resizing for most rings within 60 days of purchase."},
|
|
{
|
|
id: "3", title: "Do you offer international shipping?", content: "Yes, we ship globally! Shipping costs and delivery times vary by destination. Please see our Shipping Information page for more details."},
|
|
]}
|
|
sideTitle="Your Questions, Answered"
|
|
sideDescription="Find quick answers to common questions about our products, ordering process, shipping, and care."
|
|
faqsAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplitForm
|
|
useInvertedBackground={false}
|
|
title="Get in Touch"
|
|
description="Have a special request or a question about a piece? Our dedicated team is here to assist you."
|
|
inputs={[
|
|
{
|
|
name: "name", type: "text", placeholder: "Your Name", required: true,
|
|
},
|
|
{
|
|
name: "email", type: "email", placeholder: "Your Email", required: true,
|
|
},
|
|
{
|
|
name: "subject", type: "text", placeholder: "Subject", required: true,
|
|
},
|
|
]}
|
|
textarea={{
|
|
name: "message", placeholder: "Your Message", required: true,
|
|
}}
|
|
imageSrc="http://img.b2bpic.net/free-photo/couple-celebrating-engagement-together_23-2149430748.jpg"
|
|
imageAlt="Elegant jewelry next to contact form"
|
|
mediaAnimation="slide-up"
|
|
mediaPosition="right"
|
|
buttonText="Send Message"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBase
|
|
columns={[
|
|
{
|
|
title: "Shop", items: [
|
|
{
|
|
label: "Rings", href: "#products"},
|
|
{
|
|
label: "Necklaces", href: "#products"},
|
|
{
|
|
label: "Earrings", href: "#products"},
|
|
{
|
|
label: "Bracelets", href: "#products"},
|
|
],
|
|
},
|
|
{
|
|
title: "About Us", items: [
|
|
{
|
|
label: "Our Story", href: "#about"},
|
|
{
|
|
label: "Craftsmanship", href: "#quality"},
|
|
{
|
|
label: "Testimonials", href: "#testimonials"},
|
|
],
|
|
},
|
|
{
|
|
title: "Support", items: [
|
|
{
|
|
label: "FAQ", href: "#faq"},
|
|
{
|
|
label: "Contact", href: "#contact"},
|
|
{
|
|
label: "Shipping & Returns", href: "#"},
|
|
{
|
|
label: "Privacy Policy", href: "#"},
|
|
],
|
|
},
|
|
]}
|
|
logoText="Aurora Jewels"
|
|
copyrightText="© 2024 Aurora Jewels. All rights reserved."
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|