Update src/app/page.tsx

This commit is contained in:
2026-05-09 22:27:20 +00:00
parent 39bd8ac571
commit 7fb63aa213

View File

@@ -28,348 +28,150 @@ export default function LandingPage() {
headingFontWeight="semibold"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{
name: "Home",
id: "home",
},
{
name: "Our Story",
id: "about",
},
{
name: "Selection",
id: "products",
},
{
name: "Contact",
id: "contact",
},
]}
brandName="TB Import"
/>
</div>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{ name: "Home", id: "home" },
{ name: "Our Story", id: "about" },
{ name: "Selection", id: "products" },
{ name: "Contact", id: "contact" }
]}
brandName="TB Import"
/>
</div>
<div id="home" data-section="home">
<HeroBillboard
background={{
variant: "gradient-bars",
}}
title="TB Import"
description="Excellence from French Vineyards to Norwegian Tables. Discover our handpicked selection of exceptional wines."
buttons={[
{
text: "Explore Collection",
href: "#products",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/glass-white-wine-bottle-wooden-box-cherries-blue-surface_114579-34169.jpg"
mediaAnimation="slide-up"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/still-life-new-year-s-decoration_23-2151842244.jpg",
alt: "Wine sommelier 1",
},
{
src: "http://img.b2bpic.net/free-photo/valentine-s-day-arrangement-with-copy-space_23-2148392036.jpg",
alt: "Wine sommelier 2",
},
{
src: "http://img.b2bpic.net/free-photo/bottle-with-champagne-glasses-tray_23-2148356495.jpg",
alt: "Wine sommelier 3",
},
{
src: "http://img.b2bpic.net/free-photo/empty-bottle-glass-with-withered-flower-marble-surface_114579-21547.jpg",
alt: "Wine sommelier 4",
},
{
src: "http://img.b2bpic.net/free-photo/restaurant-blur-background_1385-176.jpg",
alt: "Wine sommelier 5",
},
]}
avatarText="Trusted by 50+ sommeliers"
marqueeItems={[
{
type: "text",
text: "Bordeaux",
},
{
type: "text",
text: "Burgundy",
},
{
type: "text",
text: "Champagne",
},
{
type: "text",
text: "Rhône",
},
{
type: "text",
text: "Loire",
},
]}
/>
</div>
<div id="home" data-section="home">
<HeroBillboard
background={{ variant: "gradient-bars" }}
title="TB Import"
description="Excellence from French Vineyards to Norwegian Tables. Discover our handpicked selection of exceptional wines."
buttons={[{ text: "Explore Collection", href: "#products" }]}
imageSrc="http://img.b2bpic.net/free-photo/glass-white-wine-bottle-wooden-box-cherries-blue-surface_114579-34169.jpg"
mediaAnimation="slide-up"
avatars={[
{ src: "http://img.b2bpic.net/free-photo/still-life-new-year-s-decoration_23-2151842244.jpg", alt: "Wine sommelier 1" },
{ src: "http://img.b2bpic.net/free-photo/valentine-s-day-arrangement-with-copy-space_23-2148392036.jpg", alt: "Wine sommelier 2" },
{ src: "http://img.b2bpic.net/free-photo/bottle-with-champagne-glasses-tray_23-2148356495.jpg", alt: "Wine sommelier 3" },
{ src: "http://img.b2bpic.net/free-photo/empty-bottle-glass-with-withered-flower-marble-surface_114579-21547.jpg", alt: "Wine sommelier 4" },
{ src: "http://img.b2bpic.net/free-photo/restaurant-blur-background_1385-176.jpg", alt: "Wine sommelier 5" }
]}
avatarText="Trusted by 50+ sommeliers"
marqueeItems={[
{ type: "text", text: "Bordeaux" },
{ type: "text", text: "Burgundy" },
{ type: "text", text: "Champagne" },
{ type: "text", text: "Rhône" },
{ type: "text", text: "Loire" }
]}
/>
</div>
<div id="about" data-section="about">
<MetricSplitMediaAbout
useInvertedBackground={true}
title="Bridging Cultures through Terroir"
description="At TB Import, we cultivate direct relationships with historic French vineyards to curate the finest selection for the Norwegian market."
metrics={[
{
value: "15+",
title: "Partner Vineyards",
},
{
value: "50+",
title: "Premium Wines",
},
{
value: "100%",
title: "Direct Import",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/cellar-with-bottles_1136-132.jpg"
mediaAnimation="blur-reveal"
metricsAnimation="slide-up"
/>
</div>
<div id="about" data-section="about">
<MetricSplitMediaAbout
useInvertedBackground={true}
title="Bridging Cultures through Terroir"
description="At TB Import, we cultivate direct relationships with historic French vineyards to curate the finest selection for the Norwegian market."
metrics={[
{ value: "15+", title: "Partner Vineyards" },
{ value: "50+", title: "Premium Wines" },
{ value: "100%", title: "Direct Import" }
]}
imageSrc="http://img.b2bpic.net/free-photo/cellar-with-bottles_1136-132.jpg"
mediaAnimation="blur-reveal"
metricsAnimation="slide-up"
/>
</div>
<div id="features" data-section="features">
<FeatureCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
features={[
{
title: "Direct Source",
description: "From French soil directly to our cellar.",
imageSrc: "http://img.b2bpic.net/free-photo/glass-wine-with-bottle-white-background-high-quality-photo_114579-68917.jpg",
imageAlt: "Vineyard",
},
{
title: "Quality Assured",
description: "Strict temperature and transit controls.",
imageSrc: "http://img.b2bpic.net/free-photo/dry-thorns-cactus_23-2147811151.jpg",
imageAlt: "Cellar",
},
{
title: "Tailored Selection",
description: "Curated for the Norwegian palate.",
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-people-wine-cellar_23-2149428763.jpg",
imageAlt: "Tasting",
},
]}
title="Our Standards"
description="Precision in logistics, passion for provenance."
/>
</div>
<div id="features" data-section="features">
<FeatureCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
features={[
{ title: "Direct Source", description: "From French soil directly to our cellar.", imageSrc: "http://img.b2bpic.net/free-photo/glass-wine-with-bottle-white-background-high-quality-photo_114579-68917.jpg", imageAlt: "Vineyard" },
{ title: "Quality Assured", description: "Strict temperature and transit controls.", imageSrc: "http://img.b2bpic.net/free-photo/dry-thorns-cactus_23-2147811151.jpg", imageAlt: "Cellar" },
{ title: "Tailored Selection", description: "Curated for the Norwegian palate.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-people-wine-cellar_23-2149428763.jpg", imageAlt: "Tasting" }
]}
title="Our Standards"
description="Precision in logistics, passion for provenance."
/>
</div>
<div id="products" data-section="products">
<ProductCardTwo
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={true}
products={[
{
id: "p1",
brand: "Chateau A",
name: "Grand Cru",
price: "450 kr",
rating: 5,
reviewCount: "12",
imageSrc: "http://img.b2bpic.net/free-photo/side-view-hand-pouring-wine-carafe_23-2149746486.jpg",
},
{
id: "p2",
brand: "Domaine B",
name: "Reserve Rouge",
price: "320 kr",
rating: 5,
reviewCount: "8",
imageSrc: "http://img.b2bpic.net/free-photo/two-glasses-sparkling-wine_53876-42363.jpg",
},
{
id: "p3",
brand: "Vignoble C",
name: "Blanc d'Hiver",
price: "290 kr",
rating: 4,
reviewCount: "15",
imageSrc: "http://img.b2bpic.net/free-photo/glass-wine-with-lavender-bush_1182-1012.jpg",
},
{
id: "p4",
brand: "Estate D",
name: "Classic Rose",
price: "250 kr",
rating: 5,
reviewCount: "5",
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-opening-wine-bottle_23-2149428788.jpg",
},
{
id: "p5",
brand: "Cave E",
name: "Cuvée Spéciale",
price: "550 kr",
rating: 5,
reviewCount: "3",
imageSrc: "http://img.b2bpic.net/free-photo/side-view-green-grapes-with-glass-wine-grunge-piece-sack-background-vertical_176474-64003.jpg",
},
{
id: "p6",
brand: "Clos F",
name: "Signature Terroir",
price: "600 kr",
rating: 5,
reviewCount: "9",
imageSrc: "http://img.b2bpic.net/free-photo/winery-view_181624-14964.jpg",
},
]}
title="Selected Vintages"
description="Explore our limited availability collection."
/>
</div>
<div id="products" data-section="products">
<ProductCardTwo
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
useInvertedBackground={true}
products={[
{ id: "p1", brand: "Chateau A", name: "Grand Cru", price: "450 kr", rating: 5, reviewCount: "12", imageSrc: "http://img.b2bpic.net/free-photo/side-view-hand-pouring-wine-carafe_23-2149746486.jpg" },
{ id: "p2", brand: "Domaine B", name: "Reserve Rouge", price: "320 kr", rating: 5, reviewCount: "8", imageSrc: "http://img.b2bpic.net/free-photo/two-glasses-sparkling-wine_53876-42363.jpg" },
{ id: "p3", brand: "Vignoble C", name: "Blanc d'Hiver", price: "290 kr", rating: 4, reviewCount: "15", imageSrc: "http://img.b2bpic.net/free-photo/glass-wine-with-lavender-bush_1182-1012.jpg" },
{ id: "p4", brand: "Estate D", name: "Classic Rose", price: "250 kr", rating: 5, reviewCount: "5", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-opening-wine-bottle_23-2149428788.jpg" },
{ id: "p5", brand: "Cave E", name: "Cuvée Spéciale", price: "550 kr", rating: 5, reviewCount: "3", imageSrc: "http://img.b2bpic.net/free-photo/side-view-green-grapes-with-glass-wine-grunge-piece-sack-background-vertical_176474-64003.jpg" },
{ id: "p6", brand: "Clos F", name: "Signature Terroir", price: "600 kr", rating: 5, reviewCount: "9", imageSrc: "http://img.b2bpic.net/free-photo/winery-view_181624-14964.jpg" }
]}
title="Selected Vintages"
description="Explore our limited availability collection."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardThree
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
metrics={[
{
id: "m1",
icon: Award,
title: "Vineyards Sourced",
value: "15",
},
{
id: "m2",
icon: CheckCircle,
title: "Satisfied Partners",
value: "200",
},
{
id: "m3",
icon: Star,
title: "Customer Rating",
value: "4.9",
},
]}
title="Our Impact"
description="Tracking growth and excellence in fine imports."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardThree
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
metrics={[
{ id: "m1", icon: Award, title: "Vineyards Sourced", value: "15" },
{ id: "m2", icon: CheckCircle, title: "Satisfied Partners", value: "200" },
{ id: "m3", icon: Star, title: "Customer Rating", value: "4.9" }
]}
title="Our Impact"
description="Tracking growth and excellence in fine imports."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwelve
useInvertedBackground={true}
testimonials={[
{
id: "t1",
name: "Jonas Berg",
imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-tasting-old-wine_23-2149428790.jpg",
},
{
id: "t2",
name: "Elena Holm",
imageSrc: "http://img.b2bpic.net/free-photo/man-filling-glass-by-wine-from-bottle-near-cheerful-woman-kitchen_23-2148024623.jpg",
},
{
id: "t3",
name: "Marc Svendsen",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-bearded-man-earphones_171337-4772.jpg",
},
{
id: "t4",
name: "Ingrid Sol",
imageSrc: "http://img.b2bpic.net/free-photo/best-friends-celebrating-new-year-s-eve-together_23-2149144048.jpg",
},
{
id: "t5",
name: "Erik Larsen",
imageSrc: "http://img.b2bpic.net/free-photo/happy-cheerful-young-bearded-man-stylish-headwear-having-coffee-sitting-wooden-table-modern-cafe-interior-waiting-his-girlfriend-planning-propose-her-this-sunny-day_273609-1932.jpg",
},
]}
cardTitle="Client Voices"
cardTag="Provenance Matters"
cardAnimation="blur-reveal"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardTwelve
useInvertedBackground={true}
cardAnimation="blur-reveal"
cardTitle="Client Voices"
cardTag="Provenance Matters"
testimonials={[
{ id: "t1", name: "Jonas Berg", imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-tasting-old-wine_23-2149428790.jpg" },
{ id: "t2", name: "Elena Holm", imageSrc: "http://img.b2bpic.net/free-photo/man-filling-glass-by-wine-from-bottle-near-cheerful-woman-kitchen_23-2148024623.jpg" },
{ id: "t3", name: "Marc Svendsen", imageSrc: "http://img.b2bpic.net/free-photo/portrait-happy-bearded-man-earphones_171337-4772.jpg" },
{ id: "t4", name: "Ingrid Sol", imageSrc: "http://img.b2bpic.net/free-photo/best-friends-celebrating-new-year-s-eve-together_23-2149144048.jpg" },
{ id: "t5", name: "Erik Larsen", imageSrc: "http://img.b2bpic.net/free-photo/happy-cheerful-young-bearded-man-stylish-headwear-having-coffee-sitting-wooden-table-modern-cafe-interior-waiting-his-girlfriend-planning-propose-her-this-sunny-day_273609-1932.jpg" }
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
useInvertedBackground={false}
title="Get in Touch"
description="Interested in our portfolio? Reach out for partnership inquiries or catalog requests."
inputs={[
{
name: "fullName",
type: "text",
placeholder: "Full Name",
required: true,
},
{
name: "email",
type: "email",
placeholder: "Email Address",
required: true,
},
{
name: "company",
type: "text",
placeholder: "Company/Restaurant",
},
]}
textarea={{
name: "message",
placeholder: "How can we help?",
rows: 4,
required: true,
}}
imageSrc="http://img.b2bpic.net/free-photo/beautiful-couple-drink-red-wine-kitchen_1157-30457.jpg"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
useInvertedBackground={false}
title="Get in Touch"
description="Interested in our portfolio? Reach out for partnership inquiries or catalog requests."
inputs={[
{ name: "fullName", type: "text", placeholder: "Full Name", required: true },
{ name: "email", type: "email", placeholder: "Email Address", required: true },
{ name: "company", type: "text", placeholder: "Company/Restaurant" }
]}
textarea={{ name: "message", placeholder: "How can we help?", rows: 4, required: true }}
imageSrc="http://img.b2bpic.net/free-photo/beautiful-couple-drink-red-wine-kitchen_1157-30457.jpg"
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="TB Import"
columns={[
{
title: "Company",
items: [
{
label: "About Us",
href: "#about",
},
{
label: "Portfolio",
href: "#products",
},
],
},
{
title: "Legal",
items: [
{
label: "Privacy Policy",
href: "#",
},
{
label: "Terms of Service",
href: "#",
},
],
},
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="TB Import"
columns={[
{ title: "Company", items: [{ label: "About Us", href: "#about" }, { label: "Portfolio", href: "#products" }] },
{ title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] }
]}
/>
</div>
</ReactLenis>
</ThemeProvider>
);