Update src/app/page.tsx
This commit is contained in:
370
src/app/page.tsx
370
src/app/page.tsx
@@ -27,273 +27,123 @@ export default function LandingPage() {
|
||||
headingFontWeight="extrabold"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Shop",
|
||||
id: "#products",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
{
|
||||
name: "Reviews",
|
||||
id: "#testimonials",
|
||||
},
|
||||
]}
|
||||
brandName="ÁNGELES"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "Shop", id: "#products" },
|
||||
{ name: "About", id: "#about" },
|
||||
{ name: "Reviews", id: "#testimonials" },
|
||||
{ name: "Contact", id: "#contact" }
|
||||
]}
|
||||
brandName="ÁNGELES"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
title="ÁNGELES"
|
||||
description="Modern feminine fashion for your perfect summer look. Designed for confidence, elegance & effortless beauty."
|
||||
buttons={[
|
||||
{
|
||||
text: "Shop the Collection",
|
||||
href: "#products",
|
||||
},
|
||||
]}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-wearing-heels_23-2149741919.jpg?_wi=1",
|
||||
imageAlt: "Fashion editorial 1",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/skinny-fancy-girl-blue-swimsuit-bikini-summer-hot-clear-cloak-brades-near-palm-trees-sexy-lady-beach-sand-sea_343629-251.jpg?_wi=1",
|
||||
imageAlt: "Fashion editorial 2",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-covering-her-face-with-veil-beach_23-2149460564.jpg?_wi=1",
|
||||
imageAlt: "Fashion editorial 3",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-pretty-caucasian-woman-fashion-blogger-wearing-stylish-clothes-head-scarf_343596-393.jpg?_wi=1",
|
||||
imageAlt: "Fashion editorial 4",
|
||||
},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-person-eating-watermelon_23-2151553570.jpg",
|
||||
imageAlt: "Fashion editorial 5",
|
||||
},
|
||||
]}
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardGallery
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
title="ÁNGELES"
|
||||
description="Modern feminine fashion for your perfect summer look. Designed for confidence, elegance & effortless beauty."
|
||||
buttons={[{ text: "Shop the Collection", href: "#products" }]}
|
||||
mediaItems={[
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-wearing-heels_23-2149741919.jpg", imageAlt: "Fashion editorial 1" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/skinny-fancy-girl-blue-swimsuit-bikini-summer-hot-clear-cloak-brades-near-palm-trees-sexy-lady-beach-sand-sea_343629-251.jpg", imageAlt: "Fashion editorial 2" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-covering-her-face-with-veil-beach_23-2149460564.jpg", imageAlt: "Fashion editorial 3" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/young-pretty-caucasian-woman-fashion-blogger-wearing-stylish-clothes-head-scarf_343596-393.jpg", imageAlt: "Fashion editorial 4" },
|
||||
{ imageSrc: "http://img.b2bpic.net/free-photo/portrait-person-eating-watermelon_23-2151553570.jpg", imageAlt: "Fashion editorial 5" }
|
||||
]}
|
||||
mediaAnimation="blur-reveal"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Summer Dream Dress",
|
||||
price: "€129",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/brunette-lady-pink-suit-with-shopping-nets_23-2148316483.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Midnight Silk Gown",
|
||||
price: "€159",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-man-s-reflection-mirror_23-2149426425.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Golden Hour Wrap",
|
||||
price: "€99",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/spring-wardrobe-switch-still-life_23-2150176657.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Minimalist Slip",
|
||||
price: "€89",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-female-model-sleeping-underwear_1303-19361.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Floral Summer Bliss",
|
||||
price: "€119",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-woman-business-suit_1303-17713.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Effortless Midi Dress",
|
||||
price: "€139",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fashion-indoor-portrait-beautiful-glamour-woman-posing-near-grey-wall-sunny-day-wearing-silk-dress-warm-knitted-cardigan-black-hat_291049-2683.jpg",
|
||||
},
|
||||
]}
|
||||
title="Best Sellers"
|
||||
description="Trending on TikTok styles curated for your closet."
|
||||
/>
|
||||
</div>
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardOne
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "p1", name: "Summer Dream Dress", price: "€129", imageSrc: "http://img.b2bpic.net/free-photo/brunette-lady-pink-suit-with-shopping-nets_23-2148316483.jpg" },
|
||||
{ id: "p2", name: "Midnight Silk Gown", price: "€159", imageSrc: "http://img.b2bpic.net/free-photo/top-view-man-s-reflection-mirror_23-2149426425.jpg" },
|
||||
{ id: "p3", name: "Golden Hour Wrap", price: "€99", imageSrc: "http://img.b2bpic.net/free-photo/spring-wardrobe-switch-still-life_23-2150176657.jpg" },
|
||||
{ id: "p4", name: "Minimalist Slip", price: "€89", imageSrc: "http://img.b2bpic.net/free-photo/young-female-model-sleeping-underwear_1303-19361.jpg" },
|
||||
{ id: "p5", name: "Floral Summer Bliss", price: "€119", imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-woman-business-suit_1303-17713.jpg" },
|
||||
{ id: "p6", name: "Effortless Midi Dress", price: "€139", imageSrc: "http://img.b2bpic.net/free-photo/fashion-indoor-portrait-beautiful-glamour-woman-posing-near-grey-wall-sunny-day-wearing-silk-dress-warm-knitted-cardigan-black-hat_291049-2683.jpg" }
|
||||
]}
|
||||
title="Best Sellers"
|
||||
description="Trending on TikTok styles curated for your closet."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={false}
|
||||
tag="Why ÁNGELES"
|
||||
title="Designed for your moment"
|
||||
description="Our collections blend premium quality fabrics with modern silhouettes to create outfits that turn heads."
|
||||
subdescription="From summer nights to unforgettable days, look your best with ease."
|
||||
icon={Sparkles}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/fashion-women-clothes_1385-198.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
imageAlt="luxury lifestyle women fashion"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<TestimonialAboutCard
|
||||
useInvertedBackground={false}
|
||||
tag="Why ÁNGELES"
|
||||
title="Designed for your moment"
|
||||
description="Our collections blend premium quality fabrics with modern silhouettes to create outfits that turn heads."
|
||||
subdescription="From summer nights to unforgettable days, look your best with ease."
|
||||
icon={Sparkles}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/fashion-women-clothes_1385-198.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
imageAlt="luxury lifestyle women fashion"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSix
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "Sarah J.",
|
||||
handle: "@sarahstyle",
|
||||
testimonial: "I got so many compliments wearing this dress!",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/attractive-young-woman-walking-autumn-wearing-coat_285396-10992.jpg",
|
||||
imageAlt: "modern feminine wardrobe fashion",
|
||||
},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Elena M.",
|
||||
handle: "@elena_fashion",
|
||||
testimonial: "It fits perfectly, feels expensive.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-wearing-heels_23-2149741919.jpg?_wi=2",
|
||||
imageAlt: "modern feminine wardrobe fashion",
|
||||
},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Mia L.",
|
||||
handle: "@miavibes",
|
||||
testimonial: "Saw it on TikTok and had to buy it.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/skinny-fancy-girl-blue-swimsuit-bikini-summer-hot-clear-cloak-brades-near-palm-trees-sexy-lady-beach-sand-sea_343629-251.jpg?_wi=2",
|
||||
imageAlt: "modern feminine wardrobe fashion",
|
||||
},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Chloe B.",
|
||||
handle: "@chloeofficial",
|
||||
testimonial: "My go-to brand for summer outfits.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-covering-her-face-with-veil-beach_23-2149460564.jpg?_wi=2",
|
||||
imageAlt: "modern feminine wardrobe fashion",
|
||||
},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Sophia R.",
|
||||
handle: "@sophia_beauty",
|
||||
testimonial: "Simply elegant, love the fabric!",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-pretty-caucasian-woman-fashion-blogger-wearing-stylish-clothes-head-scarf_343596-393.jpg?_wi=2",
|
||||
imageAlt: "modern feminine wardrobe fashion",
|
||||
},
|
||||
]}
|
||||
title="Loved by you"
|
||||
description="See why everyone is wearing ÁNGELES."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSix
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
animationType="slide-up"
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Sarah J.", handle: "@sarahstyle", testimonial: "I got so many compliments wearing this dress!", imageSrc: "http://img.b2bpic.net/free-photo/attractive-young-woman-walking-autumn-wearing-coat_285396-10992.jpg", imageAlt: "modern feminine wardrobe fashion" },
|
||||
{ id: "t2", name: "Elena M.", handle: "@elena_fashion", testimonial: "It fits perfectly, feels expensive.", imageSrc: "http://img.b2bpic.net/free-photo/side-view-woman-wearing-heels_23-2149741919.jpg", imageAlt: "modern feminine wardrobe fashion" },
|
||||
{ id: "t3", name: "Mia L.", handle: "@miavibes", testimonial: "Saw it on TikTok and had to buy it.", imageSrc: "http://img.b2bpic.net/free-photo/skinny-fancy-girl-blue-swimsuit-bikini-summer-hot-clear-cloak-brades-near-palm-trees-sexy-lady-beach-sand-sea_343629-251.jpg", imageAlt: "modern feminine wardrobe fashion" },
|
||||
{ id: "t4", name: "Chloe B.", handle: "@chloeofficial", testimonial: "My go-to brand for summer outfits.", imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-covering-her-face-with-veil-beach_23-2149460564.jpg", imageAlt: "modern feminine wardrobe fashion" },
|
||||
{ id: "t5", name: "Sophia R.", handle: "@sophia_beauty", testimonial: "Simply elegant, love the fabric!", imageSrc: "http://img.b2bpic.net/free-photo/young-pretty-caucasian-woman-fashion-blogger-wearing-stylish-clothes-head-scarf_343596-393.jpg", imageAlt: "modern feminine wardrobe fashion" }
|
||||
]}
|
||||
title="Loved by you"
|
||||
description="See why everyone is wearing ÁNGELES."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "What's the return policy?",
|
||||
content: "You have 30 days to return unworn items.",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "How does shipping work?",
|
||||
content: "We ship globally with express options.",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "Can you help with sizing?",
|
||||
content: "Check our guide or message us for advice.",
|
||||
},
|
||||
]}
|
||||
sideTitle="ÁNGELES Assistant"
|
||||
sideDescription="Questions about sizes, shipping, or need styling advice? Ask us."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqSplitText
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{ id: "f1", title: "What's the return policy?", content: "You have 30 days to return unworn items." },
|
||||
{ id: "f2", title: "How does shipping work?", content: "We ship globally with express options." },
|
||||
{ id: "f3", title: "Can you help with sizing?", content: "Check our guide or message us for advice." }
|
||||
]}
|
||||
sideTitle="ÁNGELES Assistant"
|
||||
sideDescription="Questions about sizes, shipping, or need styling advice? Ask us."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Stay Connected"
|
||||
description="Join our community for exclusive drops and style inspiration."
|
||||
inputs={[
|
||||
{
|
||||
name: "name",
|
||||
type: "text",
|
||||
placeholder: "Your Name",
|
||||
},
|
||||
{
|
||||
name: "email",
|
||||
type: "email",
|
||||
placeholder: "Email Address",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/view-elegant-luxurious-wedding-stationery-planner-resources_23-2150166948.jpg"
|
||||
imageAlt="fashion studio contact aesthetic"
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactSplitForm
|
||||
useInvertedBackground={false}
|
||||
title="Stay Connected"
|
||||
description="Join our community for exclusive drops and style inspiration."
|
||||
inputs={[
|
||||
{ name: "name", type: "text", placeholder: "Your Name" },
|
||||
{ name: "email", type: "email", placeholder: "Email Address" }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/view-elegant-luxurious-wedding-stationery-planner-resources_23-2150166948.jpg"
|
||||
imageAlt="fashion studio contact aesthetic"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Shop",
|
||||
items: [
|
||||
{
|
||||
label: "All Dresses",
|
||||
href: "#products",
|
||||
},
|
||||
{
|
||||
label: "Accessories",
|
||||
href: "#products",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company",
|
||||
items: [
|
||||
{
|
||||
label: "About Us",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Support",
|
||||
href: "#faq",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Social",
|
||||
items: [
|
||||
{
|
||||
label: "TikTok",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Instagram",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="ÁNGELES"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{ title: "Shop", items: [{ label: "All Dresses", href: "#products" }, { label: "Accessories", href: "#products" }] },
|
||||
{ title: "Company", items: [{ label: "About Us", href: "#about" }, { label: "Support", href: "#faq" }] },
|
||||
{ title: "Social", items: [{ label: "TikTok", href: "#" }, { label: "Instagram", href: "#" }] }
|
||||
]}
|
||||
logoText="ÁNGELES"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user