bender/6a433712-4e6e-41a8-a7aa-5ea7575e6043
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update src/app/page.tsx

Browse Source
This commit is contained in:
bender
2026-05-05 19:00:44 +00:00
parent 8b16833428
commit c8b2d3d9df
1 changed files with 47 additions and 293 deletions
Download Patch File Download Diff File Expand all files Collapse all files

340
src/app/page.tsx
View File

@@ -31,69 +31,32 @@ export default function LandingPage() {
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
navItems={[
{
name: "Shop",
id: "products",
},
{
name: "Gifts",
id: "gifting",
},
{
name: "Story",
id: "about",
},
{
name: "Contact",
id: "contact",
},
{ name: "Shop", id: "products" },
{ name: "Gifts", id: "gifting" },
{ name: "Story", id: "about" },
{ name: "Contact", id: "contact" },
]}
brandName="The Imperialist Club"
button={{ text: "Contact Us", href: "#contact" }}
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardCarousel
background={{
variant: "gradient-bars",
}}
background={{ variant: "gradient-bars" }}
title="Dress Like You Own The Room."
description="Premium accessories designed to elevate every man’s presence."
buttons={[
{
text: "Shop Collection",
href: "#products",
},
{
text: "Find The Perfect Gift",
href: "#gifting",
},
{ text: "Shop Collection", href: "#products" },
{ text: "Find The Perfect Gift", href: "#gifting" },
]}
mediaItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-fashion-stylish-hipster-businessman-model-dressed-elegant-brown-suit-sitting-near-dark_158538-11270.jpg?_wi=1",
imageAlt: "elegant man adjusting blazer cufflinks",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/picture-elegant-young-fashion-man_158595-529.jpg?_wi=1",
imageAlt: "elegant man adjusting blazer cufflinks",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/groom-his-wedding-day_1303-10476.jpg",
imageAlt: "elegant man adjusting blazer cufflinks",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-fashion-stylish-hipster-businessman-model-dressed-elegant-brown-suit-sitting-near-dark-studio_158538-11298.jpg",
imageAlt: "elegant man adjusting blazer cufflinks",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/handsome-bearded-elegant-male-eyeglasses-dressed-dark-blue-suit-with-bow-tie-grey-vignette-background_613910-629.jpg",
imageAlt: "elegant man adjusting blazer cufflinks",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/handsome-bearded-man-drinking-whiskey_1303-19850.jpg",
imageAlt: "elegant man adjusting blazer cufflinks",
},
{ imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-fashion-stylish-hipster-businessman-model-dressed-elegant-brown-suit-sitting-near-dark_158538-11270.jpg", imageAlt: "elegant man adjusting blazer cufflinks" },
{ imageSrc: "http://img.b2bpic.net/free-photo/picture-elegant-young-fashion-man_158595-529.jpg", imageAlt: "elegant man adjusting blazer cufflinks" },
{ imageSrc: "http://img.b2bpic.net/free-photo/groom-his-wedding-day_1303-10476.jpg", imageAlt: "elegant man adjusting blazer cufflinks" },
{ imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-fashion-stylish-hipster-businessman-model-dressed-elegant-brown-suit-sitting-near-dark-studio_158538-11298.jpg", imageAlt: "elegant man adjusting blazer cufflinks" },
{ imageSrc: "http://img.b2bpic.net/free-photo/handsome-bearded-elegant-male-eyeglasses-dressed-dark-blue-suit-with-bow-tie-grey-vignette-background_613910-629.jpg", imageAlt: "elegant man adjusting blazer cufflinks" },
{ imageSrc: "http://img.b2bpic.net/free-photo/handsome-bearded-man-drinking-whiskey_1303-19850.jpg", imageAlt: "elegant man adjusting blazer cufflinks" },
]}
/>
</div>
@@ -103,14 +66,7 @@ export default function LandingPage() {
textboxLayout="default"
useInvertedBackground={true}
names={[
"Gentlemen's Journal",
"GQ Style",
"The Modern Alpha",
"Forbes Life",
"Esquire UK",
"Business Insider",
"Men's Health",
]}
"Gentlemen's Journal", "GQ Style", "The Modern Alpha", "Forbes Life", "Esquire UK", "Business Insider", "Men's Health"]}
title="Loved by modern gentlemen & smart gift-givers"
description="Rated 5 stars by thousands of satisfied customers."
/>
@@ -121,35 +77,12 @@ export default function LandingPage() {
textboxLayout="default"
gridVariant="four-items-2x2-equal-grid"
useInvertedBackground={false}
animationType="scale-rotate"
products={[
{
id: "p1",
name: "Classic Watch",
price: "$199",
variant: "Bestseller",
imageSrc: "http://img.b2bpic.net/free-photo/man-listening-music_1157-5.jpg?_wi=1",
},
{
id: "p2",
name: "Leather Wallet",
price: "$89",
variant: "Minimalist",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-clock-with-time-change_23-2149241141.jpg",
},
{
id: "p3",
name: "Gold Bracelet",
price: "$129",
variant: "Gold",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-military-protection-item-background_23-2149341300.jpg",
},
{
id: "p4",
name: "Sunglasses",
price: "$150",
variant: "UV400",
imageSrc: "http://img.b2bpic.net/free-photo/leather-bag-travel-with-jeans-wallet_23-2149434021.jpg",
},
{ id: "p1", name: "Classic Watch", price: "$199", variant: "Bestseller", imageSrc: "http://img.b2bpic.net/free-photo/man-listening-music_1157-5.jpg" },
{ id: "p2", name: "Leather Wallet", price: "$89", variant: "Minimalist", imageSrc: "http://img.b2bpic.net/free-photo/close-up-clock-with-time-change_23-2149241141.jpg" },
{ id: "p3", name: "Gold Bracelet", price: "$129", variant: "Gold", imageSrc: "http://img.b2bpic.net/free-photo/close-up-military-protection-item-background_23-2149341300.jpg" },
{ id: "p4", name: "Sunglasses", price: "$150", variant: "UV400", imageSrc: "http://img.b2bpic.net/free-photo/leather-bag-travel-with-jeans-wallet_23-2149434021.jpg" },
]}
title="Featured Collections"
description="Explore our curated selection of premium accessories."
@@ -161,31 +94,11 @@ export default function LandingPage() {
useInvertedBackground={true}
title="Why The Imperialist Club"
metrics={[
{
icon: Gift,
label: "Effortless Gifting",
value: "Done for you",
},
{
icon: ShieldCheck,
label: "Premium Quality",
value: "Built to last",
},
{
icon: Zap,
label: "Style Upgrade",
value: "Big Impact",
},
{
icon: Clock,
label: "Fast Delivery",
value: "48 hours",
},
{
icon: Award,
label: "Satisfaction",
value: "Guaranteed",
},
{ icon: Gift, label: "Effortless Gifting", value: "Done for you" },
{ icon: ShieldCheck, label: "Premium Quality", value: "Built to last" },
{ icon: Zap, label: "Style Upgrade", value: "Big Impact" },
{ icon: Clock, label: "Fast Delivery", value: "48 hours" },
{ icon: Award, label: "Satisfaction", value: "Guaranteed" },
]}
metricsAnimation="slide-up"
/>
@@ -198,48 +111,12 @@ export default function LandingPage() {
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
products={[
{
id: "b1",
name: "Signature Watch",
price: "$299",
variant: "Luxury",
imageSrc: "http://img.b2bpic.net/free-photo/fashion-portrait-young-businessman-handsome-model-man-casual-cloth-suit-with-accesories-hands_158538-9460.jpg",
},
{
id: "b2",
name: "Gold Cufflinks",
price: "$110",
variant: "Gold",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-fashion-stylish-hipster-businessman-model-dressed-elegant-brown-suit-sunglasses_158538-11345.jpg",
},
{
id: "b3",
name: "Leather Wallet",
price: "$95",
variant: "Classic",
imageSrc: "http://img.b2bpic.net/free-photo/close-up-image-redhead-bearded-male-holds-cup-coffee-grey-background_613910-10244.jpg",
},
{
id: "b4",
name: "Silver Bracelet",
price: "$135",
variant: "Premium",
imageSrc: "http://img.b2bpic.net/free-photo/bearded-hipster-amateur-photographer-with-tattoos-arms-dressed-fleece-shirt-holds-compact-dslr-camera-grey-background_613910-15180.jpg",
},
{
id: "b5",
name: "Aviator Shades",
price: "$160",
variant: "Classic",
imageSrc: "http://img.b2bpic.net/free-photo/still-life-office-worker-s-personal-items_23-2149371255.jpg",
},
{
id: "b6",
name: "Gift Set Bundle",
price: "$399",
variant: "Ultimate",
imageSrc: "http://img.b2bpic.net/free-photo/men-accessories-black-blue-elegant_1357-109.jpg?_wi=1",
},
{ id: "b1", name: "Signature Watch", price: "$299", variant: "Luxury", imageSrc: "http://img.b2bpic.net/free-photo/fashion-portrait-young-businessman-handsome-model-man-casual-cloth-suit-with-accesories-hands_158538-9460.jpg" },
{ id: "b2", name: "Gold Cufflinks", price: "$110", variant: "Gold", imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-fashion-stylish-hipster-businessman-model-dressed-elegant-brown-suit-sunglasses_158538-11345.jpg" },
{ id: "b3", name: "Leather Wallet", price: "$95", variant: "Classic", imageSrc: "http://img.b2bpic.net/free-photo/close-up-image-redhead-bearded-male-holds-cup-coffee-grey-background_613910-10244.jpg" },
{ id: "b4", name: "Silver Bracelet", price: "$135", variant: "Premium", imageSrc: "http://img.b2bpic.net/free-photo/bearded-hipster-amateur-photographer-with-tattoos-arms-dressed-fleece-shirt-holds-compact-dslr-camera-grey-background_613910-15180.jpg" },
{ id: "b5", name: "Aviator Shades", price: "$160", variant: "Classic", imageSrc: "http://img.b2bpic.net/free-photo/still-life-office-worker-s-personal-items_23-2149371255.jpg" },
{ id: "b6", name: "Gift Set Bundle", price: "$399", variant: "Ultimate", imageSrc: "http://img.b2bpic.net/free-photo/men-accessories-black-blue-elegant_1357-109.jpg" },
]}
title="Bestsellers"
description="Our most popular pieces."
@@ -251,34 +128,13 @@ export default function LandingPage() {
animationType="slide-up"
textboxLayout="split"
useInvertedBackground={true}
features={[
{
title: "Birthday Essentials",
description: "Hand-picked pieces he'll love.",
bentoComponent: "reveal-icon",
icon: Gift,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-fashion-stylish-hipster-businessman-model-dressed-elegant-brown-suit-sitting-near-dark_158538-11269.jpg",
imageAlt: "portrait of handsome fashion stylish hipster businessman model dressed in elegant brown suit sitting near dark",
},
{
title: "Anniversary Sets",
description: "Timeless gifts for milestones.",
bentoComponent: "reveal-icon",
icon: Heart,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-fashion-stylish-hipster-businessman-model-dressed-elegant-brown-suit-sitting-near-dark_158538-11270.jpg?_wi=2",
imageAlt: "portrait of handsome fashion stylish hipster businessman model dressed in elegant brown suit sitting near dark",
},
{
title: "Just Because",
description: "Small details, big impact.",
bentoComponent: "reveal-icon",
icon: Sparkles,
imageSrc: "http://img.b2bpic.net/free-photo/men-accessories-black-blue-elegant_1357-109.jpg?_wi=2",
imageAlt: "portrait of handsome fashion stylish hipster businessman model dressed in elegant brown suit sitting near dark",
},
]}
title="The Perfect Gift, Every Time."
description="Whether it’s a birthday, anniversary, or “just because”—give him something he’ll actually use."
features={[
{ title: "Birthday Essentials", description: "Hand-picked pieces he'll love.", bentoComponent: "reveal-icon", icon: Gift },
{ title: "Anniversary Sets", description: "Timeless gifts for milestones.", bentoComponent: "reveal-icon", icon: Heart },
{ title: "Just Because", description: "Small details, big impact.", bentoComponent: "reveal-icon", icon: Sparkles },
]}
/>
</div>
@@ -287,61 +143,11 @@ export default function LandingPage() {
textboxLayout="default"
useInvertedBackground={true}
testimonials={[
{
id: "1",
name: "Sarah Johnson",
date: "12 Jan",
title: "Wife",
quote: "You’ll never have to worry about what to gift a guy again.",
tag: "Gift",
avatarSrc: "http://img.b2bpic.net/free-photo/smiley-business-man-outdoor_23-2148479594.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-fashion-stylish-hipster-businessman-model-dressed-elegant-brown-suit-sitting-near-dark_158538-11270.jpg?_wi=3",
imageAlt: "portrait successful modern man",
},
{
id: "2",
name: "Michael Chen",
date: "15 Feb",
title: "Customer",
quote: "Amazing accessories for men. Truly timeless.",
tag: "Style",
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-bearded-male-elegant-suit-cylinder-hat-looking-camera-dark-background_613910-3863.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/men-accessories-black-blue-elegant_1357-109.jpg?_wi=3",
imageAlt: "portrait successful modern man",
},
{
id: "3",
name: "Emily R.",
date: "05 Mar",
title: "Wife",
quote: "Their collection is amazing and the quality is top-tier.",
tag: "Gift",
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-sexy-handsome-fashion-male-model-man-dressed-elegant-suit-black-studio-lights-background_158538-9659.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/man-listening-music_1157-5.jpg?_wi=2",
imageAlt: "portrait successful modern man",
},
{
id: "4",
name: "David Kim",
date: "20 Mar",
title: "Customer",
quote: "Subtle, refined, and perfect for the modern gentleman.",
tag: "Style",
avatarSrc: "http://img.b2bpic.net/free-photo/studio-portrait-serious-bearded-male-dressed-suit_613910-14795.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-stylish-blond-male-dressed-blue-suit_613910-12748.jpg",
imageAlt: "portrait successful modern man",
},
{
id: "5",
name: "Alex B.",
date: "22 Apr",
title: "Customer",
quote: "Worth every penny for the quality and presence.",
tag: "Style",
avatarSrc: "http://img.b2bpic.net/free-photo/fashion-portrait-young-businessman-handsome-model-man-dressed-elegant-brown-suit-with-accessories_158538-11206.jpg",
imageSrc: "http://img.b2bpic.net/free-photo/picture-elegant-young-fashion-man_158595-529.jpg?_wi=2",
imageAlt: "portrait successful modern man",
},
{ id: "1", name: "Sarah Johnson", date: "12 Jan", title: "Wife", quote: "You’ll never have to worry about what to gift a guy again.", tag: "Gift", avatarSrc: "http://img.b2bpic.net/free-photo/smiley-business-man-outdoor_23-2148479594.jpg" },
{ id: "2", name: "Michael Chen", date: "15 Feb", title: "Customer", quote: "Amazing accessories for men. Truly timeless.", tag: "Style", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-stylish-bearded-male-elegant-suit-cylinder-hat-looking-camera-dark-background_613910-3863.jpg" },
{ id: "3", name: "Emily R.", date: "05 Mar", title: "Wife", quote: "Their collection is amazing and the quality is top-tier.", tag: "Gift", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-sexy-handsome-fashion-male-model-man-dressed-elegant-suit-black-studio-lights-background_158538-9659.jpg" },
{ id: "4", name: "David Kim", date: "20 Mar", title: "Customer", quote: "Subtle, refined, and perfect for the modern gentleman.", tag: "Style", avatarSrc: "http://img.b2bpic.net/free-photo/studio-portrait-serious-bearded-male-dressed-suit_613910-14795.jpg" },
{ id: "5", name: "Alex B.", date: "22 Apr", title: "Customer", quote: "Worth every penny for the quality and presence.", tag: "Style", avatarSrc: "http://img.b2bpic.net/free-photo/fashion-portrait-young-businessman-handsome-model-man-dressed-elegant-brown-suit-with-accessories_158538-11206.jpg" },
]}
title="Loved by Gentlemen"
description="What our customers are saying."
@@ -351,9 +157,7 @@ export default function LandingPage() {
<div id="story" data-section="story">
<ContactSplit
useInvertedBackground={false}
background={{
variant: "plain",
}}
background={{ variant: "plain" }}
tag="Brand Story"
title="Built For The Modern Gentleman"
description="The Imperialist Club was created for men who understand that presence is power. Style isn't about excess—it's about precision. We design to elevate confidence."
@@ -367,9 +171,7 @@ export default function LandingPage() {
<div id="closer" data-section="closer">
<ContactSplit
useInvertedBackground={false}
background={{
variant: "plain",
}}
background={{ variant: "plain" }}
tag="Final Call"
title="Upgrade His Style Today."
description="Join the club and get 10% off your first order."
@@ -385,61 +187,13 @@ export default function LandingPage() {
<FooterBaseReveal
logoText="The Imperialist Club"
columns={[
{
title: "Shop",
items: [
{
label: "Watches",
href: "#",
},
{
label: "Bracelets",
href: "#",
},
{
label: "Wallets",
href: "#",
},
],
},
{
title: "Company",
items: [
{
label: "About Us",
href: "#",
},
{
label: "Contact",
href: "#",
},
{
label: "Shipping",
href: "#",
},
],
},
{
title: "Social",
items: [
{
label: "Instagram",
href: "#",
},
{
label: "Facebook",
href: "#",
},
{
label: "Twitter",
href: "#",
},
],
},
{ title: "Shop", items: [{ label: "Watches", href: "#" }, { label: "Bracelets", href: "#" }, { label: "Wallets", href: "#" }] },
{ title: "Company", items: [{ label: "About Us", href: "#" }, { label: "Contact", href: "#" }, { label: "Shipping", href: "#" }] },
{ title: "Social", items: [{ label: "Instagram", href: "#" }, { label: "Facebook", href: "#" }, { label: "Twitter", href: "#" }] },
]}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}
}