Compare commits
6 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 6486fb2030 | |||
| 121d93aae8 | |||
| d60e0a51ce | |||
| e331dc266e | |||
| 5ce95e8eba | |||
| c0989b8af9 |
270
src/app/page.tsx
270
src/app/page.tsx
@@ -2,10 +2,10 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactSplit from '@/components/sections/contact/ContactSplit';
|
||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||||
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
|
||||
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
|
||||
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
|
||||
import FooterBase from '@/components/sections/footer/FooterBase';
|
||||
import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
|
||||
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
|
||||
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
|
||||
@@ -33,21 +33,13 @@ export default function LandingPage() {
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
name: "Home", id: "hero"},
|
||||
{
|
||||
name: "Collection",
|
||||
id: "products",
|
||||
},
|
||||
name: "Collection", id: "products"},
|
||||
{
|
||||
name: "Story",
|
||||
id: "about",
|
||||
},
|
||||
name: "Story", id: "about"},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
name: "Contact", id: "contact"},
|
||||
]}
|
||||
brandName="SparkleBoutique"
|
||||
/>
|
||||
@@ -56,41 +48,26 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
variant: "sparkles-gradient"}}
|
||||
title="Sparkle & Shine"
|
||||
description="Discover our hand-picked collection of elegant silver pieces crafted for the modern, feminine soul. Add a touch of magic to your everyday look."
|
||||
buttons={[
|
||||
{
|
||||
text: "Shop Collections",
|
||||
href: "#products",
|
||||
},
|
||||
text: "Shop the Collection", href: "#products"},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/jewelry-lifestyle-flat-layout-with-place-text-jewellery-background-mockup-banner-fashion-accessories_460848-12591.jpg?_wi=1",
|
||||
imageAlt: "Silver Jewllery",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/jewelry-lifestyle-flat-layout-with-place-text-jewellery-background-mockup-banner-fashion-accessories_460848-12591.jpg?_wi=1", imageAlt: "Silver Jewllery"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-crystalline-water-oil-drops_23-2148227285.jpg",
|
||||
imageAlt: "Silver Jewllery",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-crystalline-water-oil-drops_23-2148227285.jpg", imageAlt: "Silver Jewllery"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-beautiful-diamond-ring-white-surface_181624-57589.jpg",
|
||||
imageAlt: "Silver Jewllery",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-beautiful-diamond-ring-white-surface_181624-57589.jpg", imageAlt: "Silver Jewllery"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-fashion-lifestyle-concept_23-2148229258.jpg",
|
||||
imageAlt: "Silver Jewllery",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-fashion-lifestyle-concept_23-2148229258.jpg", imageAlt: "Silver Jewllery"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/jewelry-lifestyle-flat-layout-with-place-text-jewellery-background-mockup-banner-fashion-accessories_460848-12592.jpg",
|
||||
imageAlt: "Silver Jewllery",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/jewelry-lifestyle-flat-layout-with-place-text-jewellery-background-mockup-banner-fashion-accessories_460848-12592.jpg", imageAlt: "Silver Jewllery"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pink-model-career-kit-arrangement_23-2150083976.jpg",
|
||||
imageAlt: "Silver Jewllery",
|
||||
},
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/pink-model-career-kit-arrangement_23-2150083976.jpg", imageAlt: "Silver Jewllery"},
|
||||
]}
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
@@ -102,9 +79,7 @@ export default function LandingPage() {
|
||||
title="Crafted with Love & Glitter"
|
||||
buttons={[
|
||||
{
|
||||
text: "Our Story",
|
||||
href: "#",
|
||||
},
|
||||
text: "Our Story", href: "#"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -117,47 +92,17 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Silver Moonlight Ring",
|
||||
price: "$85",
|
||||
variant: "925 Silver",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-aesthetic-silver-earrings_23-2149846572.jpg?_wi=1",
|
||||
},
|
||||
id: "1", name: "Silver Moonlight Ring", price: "$85", variant: "925 Silver", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-aesthetic-silver-earrings_23-2149846572.jpg?_wi=1"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Dainty Star Necklace",
|
||||
price: "$120",
|
||||
variant: "Sterling Silver",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-ferromagnetic-mirrored-metal-with-blurred-elements_23-2148253535.jpg?_wi=1",
|
||||
},
|
||||
id: "2", name: "Dainty Star Necklace", price: "$120", variant: "Sterling Silver", imageSrc: "http://img.b2bpic.net/free-photo/abstract-ferromagnetic-mirrored-metal-with-blurred-elements_23-2148253535.jpg?_wi=1"},
|
||||
{
|
||||
id: "3",
|
||||
name: "Glitter Drop Earrings",
|
||||
price: "$65",
|
||||
variant: "Silver Plated",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-gold-plated-bracelet-ring-set-with-crystal-black-table_140725-12895.jpg?_wi=1",
|
||||
},
|
||||
id: "3", name: "Glitter Drop Earrings", price: "$65", variant: "Silver Plated", imageSrc: "http://img.b2bpic.net/free-photo/side-view-gold-plated-bracelet-ring-set-with-crystal-black-table_140725-12895.jpg?_wi=1"},
|
||||
{
|
||||
id: "4",
|
||||
name: "Classic Chain Bracelet",
|
||||
price: "$95",
|
||||
variant: "925 Silver",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-silver-tin-can_23-2148785202.jpg",
|
||||
},
|
||||
id: "4", name: "Classic Chain Bracelet", price: "$95", variant: "925 Silver", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-silver-tin-can_23-2148785202.jpg"},
|
||||
{
|
||||
id: "5",
|
||||
name: "Crystal Silver Studs",
|
||||
price: "$45",
|
||||
variant: "Silver Plated",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/human-hand-holding-toy-bauble_23-2147964523.jpg",
|
||||
},
|
||||
id: "5", name: "Crystal Silver Studs", price: "$45", variant: "Silver Plated", imageSrc: "http://img.b2bpic.net/free-photo/human-hand-holding-toy-bauble_23-2147964523.jpg"},
|
||||
{
|
||||
id: "6",
|
||||
name: "Minimalist Hoop Ring",
|
||||
price: "$70",
|
||||
variant: "925 Silver",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/selective-focus-shot-wedding-ring-wooden-surface_181624-60193.jpg",
|
||||
},
|
||||
id: "6", name: "Minimalist Hoop Ring", price: "$70", variant: "925 Silver", imageSrc: "http://img.b2bpic.net/free-photo/selective-focus-shot-wedding-ring-wooden-surface_181624-60193.jpg"},
|
||||
]}
|
||||
title="New Arrivals"
|
||||
description="Exquisite silver jewellery pieces, meticulously selected for their shimmer and style."
|
||||
@@ -171,34 +116,16 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "f1",
|
||||
label: "Quality",
|
||||
title: "Premium 925 Silver",
|
||||
items: [
|
||||
"Genuine materials",
|
||||
"High durability",
|
||||
"Nickel-free",
|
||||
],
|
||||
id: "f1", label: "Quality", title: "Premium 925 Silver", items: [
|
||||
"Genuine materials", "High durability", "Nickel-free"],
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
label: "Design",
|
||||
title: "Feminine Aesthetic",
|
||||
items: [
|
||||
"Girly chic style",
|
||||
"Trend-focused",
|
||||
"Sophisticated",
|
||||
],
|
||||
id: "f2", label: "Design", title: "Feminine Aesthetic", items: [
|
||||
"Girly chic style", "Trend-focused", "Sophisticated"],
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
label: "Care",
|
||||
title: "Gift-Ready Packaging",
|
||||
items: [
|
||||
"Beautiful pink box",
|
||||
"Includes polishing cloth",
|
||||
"Ready to gift",
|
||||
],
|
||||
id: "f3", label: "Care", title: "Gift-Ready Packaging", items: [
|
||||
"Beautiful pink box", "Includes polishing cloth", "Ready to gift"],
|
||||
},
|
||||
]}
|
||||
title="Why Choose SparkleBoutique?"
|
||||
@@ -212,60 +139,15 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Alice M.",
|
||||
date: "Jan 2025",
|
||||
title: "Love it!",
|
||||
quote: "The most beautiful silver pieces I own.",
|
||||
tag: "Silver",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/grateful-charming-blond-european-25s-woman-silver-party-dress-press-palms-heart-feel-thankful-appreciate-effort-cherish-romantic-gesture-receive-flattering-compliments-gifts-smiling-happily_1258-308442.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/jewelry-lifestyle-flat-layout-with-place-text-jewellery-background-mockup-banner-fashion-accessories_460848-12591.jpg?_wi=2",
|
||||
imageAlt: "happy customer wearing jewellery",
|
||||
},
|
||||
id: "1", name: "Alice M.", date: "Jan 2025", title: "Love it!", quote: "The most beautiful silver pieces I own.", tag: "Silver", avatarSrc: "http://img.b2bpic.net/free-photo/grateful-charming-blond-european-25s-woman-silver-party-dress-press-palms-heart-feel-thankful-appreciate-effort-cherish-romantic-gesture-receive-flattering-compliments-gifts-smiling-happily_1258-308442.jpg", imageSrc: "http://img.b2bpic.net/free-photo/jewelry-lifestyle-flat-layout-with-place-text-jewellery-background-mockup-banner-fashion-accessories_460848-12591.jpg?_wi=2", imageAlt: "happy customer wearing jewellery"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Bella K.",
|
||||
date: "Dec 2024",
|
||||
title: "Stunning!",
|
||||
quote: "Sparkles like no other. Simply amazing.",
|
||||
tag: "Gift",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/charming-girl-stands-ballcony_8353-5669.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/flower-bouquet-fountain-pen-envelope-paperclip-macaroons-marble-textured-background_23-2147940342.jpg",
|
||||
imageAlt: "happy customer wearing jewellery",
|
||||
},
|
||||
id: "2", name: "Bella K.", date: "Dec 2024", title: "Stunning!", quote: "Sparkles like no other. Simply amazing.", tag: "Gift", avatarSrc: "http://img.b2bpic.net/free-photo/charming-girl-stands-ballcony_8353-5669.jpg", imageSrc: "http://img.b2bpic.net/free-photo/flower-bouquet-fountain-pen-envelope-paperclip-macaroons-marble-textured-background_23-2147940342.jpg", imageAlt: "happy customer wearing jewellery"},
|
||||
{
|
||||
id: "3",
|
||||
name: "Chloe S.",
|
||||
date: "Dec 2024",
|
||||
title: "So girly!",
|
||||
quote: "Absolutely obsessed with these pink details.",
|
||||
tag: "Style",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/glad-african-american-young-woman-rests-alone-coffee-shop-has-delighted-look-rests-after-work-laptop-computer-has-positive-expression_273609-3414.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-aesthetic-silver-earrings_23-2149846572.jpg?_wi=2",
|
||||
imageAlt: "happy customer wearing jewellery",
|
||||
},
|
||||
id: "3", name: "Chloe S.", date: "Dec 2024", title: "So girly!", quote: "Absolutely obsessed with these pink details.", tag: "Style", avatarSrc: "http://img.b2bpic.net/free-photo/glad-african-american-young-woman-rests-alone-coffee-shop-has-delighted-look-rests-after-work-laptop-computer-has-positive-expression_273609-3414.jpg", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-aesthetic-silver-earrings_23-2149846572.jpg?_wi=2", imageAlt: "happy customer wearing jewellery"},
|
||||
{
|
||||
id: "4",
|
||||
name: "Diana P.",
|
||||
date: "Nov 2024",
|
||||
title: "Excellent Quality",
|
||||
quote: "Worth every penny. Stunning design.",
|
||||
tag: "Premium",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/positive-young-hippy-woman-with-joyful-expression-points-aside-dressed-stylish-headband-denim-overalls_273609-17257.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-ferromagnetic-mirrored-metal-with-blurred-elements_23-2148253535.jpg?_wi=2",
|
||||
imageAlt: "happy customer wearing jewellery",
|
||||
},
|
||||
id: "4", name: "Diana P.", date: "Nov 2024", title: "Excellent Quality", quote: "Worth every penny. Stunning design.", tag: "Premium", avatarSrc: "http://img.b2bpic.net/free-photo/positive-young-hippy-woman-with-joyful-expression-points-aside-dressed-stylish-headband-denim-overalls_273609-17257.jpg", imageSrc: "http://img.b2bpic.net/free-photo/abstract-ferromagnetic-mirrored-metal-with-blurred-elements_23-2148253535.jpg?_wi=2", imageAlt: "happy customer wearing jewellery"},
|
||||
{
|
||||
id: "5",
|
||||
name: "Emma R.",
|
||||
date: "Oct 2024",
|
||||
title: "Perfect!",
|
||||
quote: "The gift packaging is just as pretty as the ring.",
|
||||
tag: "Packaging",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/attractive-excited-happy-charming-blond-girl-attend-luxurious-party-see-famous-person-feel-lucky_1258-228521.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-gold-plated-bracelet-ring-set-with-crystal-black-table_140725-12895.jpg?_wi=2",
|
||||
imageAlt: "happy customer wearing jewellery",
|
||||
},
|
||||
id: "5", name: "Emma R.", date: "Oct 2024", title: "Perfect!", quote: "The gift packaging is just as pretty as the ring.", tag: "Packaging", avatarSrc: "http://img.b2bpic.net/free-photo/attractive-excited-happy-charming-blond-girl-attend-luxurious-party-see-famous-person-feel-lucky_1258-228521.jpg", imageSrc: "http://img.b2bpic.net/free-photo/side-view-gold-plated-bracelet-ring-set-with-crystal-black-table_140725-12895.jpg?_wi=2", imageAlt: "happy customer wearing jewellery"},
|
||||
]}
|
||||
title="Words From Our Stars"
|
||||
description="Join our community of happy jewellery lovers."
|
||||
@@ -279,22 +161,13 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
title: "Happy Clients",
|
||||
value: "5,000+",
|
||||
icon: Star,
|
||||
id: "m1", title: "Happy Clients", value: "5,000+", icon: Star,
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
title: "Jewellery Sold",
|
||||
value: "12,000+",
|
||||
icon: Sparkles,
|
||||
id: "m2", title: "Jewellery Sold", value: "12,000+", icon: Sparkles,
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
title: "Unique Designs",
|
||||
value: "150+",
|
||||
icon: Diamond,
|
||||
id: "m3", title: "Unique Designs", value: "150+", icon: Diamond,
|
||||
},
|
||||
]}
|
||||
title="Our Impact"
|
||||
@@ -307,20 +180,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "Do you use real silver?",
|
||||
content: "Yes, we focus on high-quality 925 sterling silver.",
|
||||
},
|
||||
id: "q1", title: "Do you use real silver?", content: "Yes, we focus on high-quality 925 sterling silver."},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Can I return items?",
|
||||
content: "Absolutely! We have a 30-day return policy.",
|
||||
},
|
||||
id: "q2", title: "Can I return items?", content: "Absolutely! We have a 30-day return policy."},
|
||||
{
|
||||
id: "q3",
|
||||
title: "Do you ship worldwide?",
|
||||
content: "Yes, we ship globally.",
|
||||
},
|
||||
id: "q3", title: "Do you ship worldwide?", content: "Yes, we ship globally."},
|
||||
]}
|
||||
sideTitle="Frequently Asked"
|
||||
faqsAnimation="slide-up"
|
||||
@@ -328,55 +192,49 @@ export default function LandingPage() {
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplit
|
||||
<ContactCenter
|
||||
tag="Contact Us"
|
||||
title="Get in Touch"
|
||||
description="We're here to help with any questions, inquiries, or style advice you need. Reach out and let's sparkle together."
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
tag="Join Us"
|
||||
title="Stay Sparkly"
|
||||
description="Subscribe to our newsletter for exclusive offers and new collection sneak peeks."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/view-elegant-luxurious-wedding-stationery-planner-resources_23-2150166943.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
background={{ variant: "plain" }}
|
||||
buttonText="Send Message"
|
||||
onSubmit={(email) => console.log("Form submitted", email)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
<FooterBase
|
||||
logoText="SparkleBoutique"
|
||||
columns={[
|
||||
{
|
||||
title: "Shop",
|
||||
items: [
|
||||
title: "Shop", items: [
|
||||
{
|
||||
label: "Rings",
|
||||
href: "#",
|
||||
},
|
||||
label: "Rings", href: "#"},
|
||||
{
|
||||
label: "Necklaces",
|
||||
href: "#",
|
||||
},
|
||||
label: "Necklaces", href: "#"},
|
||||
{
|
||||
label: "Earrings",
|
||||
href: "#",
|
||||
},
|
||||
label: "Earrings", href: "#"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
title: "Support", items: [
|
||||
{
|
||||
label: "Returns",
|
||||
href: "#",
|
||||
},
|
||||
label: "Returns", href: "#"},
|
||||
{
|
||||
label: "Shipping",
|
||||
href: "#",
|
||||
},
|
||||
label: "Shipping", href: "#"},
|
||||
{
|
||||
label: "Contact",
|
||||
href: "#",
|
||||
},
|
||||
label: "Contact", href: "#"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Connect", items: [
|
||||
{
|
||||
label: "Instagram", href: "#"},
|
||||
{
|
||||
label: "Facebook", href: "#"},
|
||||
{
|
||||
label: "TikTok", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
|
||||
@@ -10,15 +10,15 @@
|
||||
--accent: #ffffff;
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #fdf2f8;
|
||||
--background: #fdf8f6;
|
||||
--card: #ffffff;
|
||||
--foreground: #500724;
|
||||
--primary-cta: #db2777;
|
||||
--foreground: #4a3728;
|
||||
--primary-cta: #c17f59;
|
||||
--primary-cta-text: #ffffff;
|
||||
--secondary-cta: #fce7f3;
|
||||
--secondary-cta: #f3e5db;
|
||||
--secondary-cta-text: #831843;
|
||||
--accent: #c084fc;
|
||||
--background-accent: #fbcfe8;
|
||||
--accent: #dcbfae;
|
||||
--background-accent: #f7ece6;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user