Merge version_2 into main #2
274
src/app/page.tsx
274
src/app/page.tsx
@@ -33,21 +33,13 @@ export default function LandingPage() {
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
name: "Home", id: "hero"},
|
||||
{
|
||||
name: "About",
|
||||
id: "about",
|
||||
},
|
||||
name: "About", id: "about"},
|
||||
{
|
||||
name: "Products",
|
||||
id: "products",
|
||||
},
|
||||
name: "Products", id: "products"},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
name: "Contact", id: "contact"},
|
||||
]}
|
||||
brandName="Blue Sea "
|
||||
/>
|
||||
@@ -56,43 +48,28 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCentered
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
variant: "gradient-bars"}}
|
||||
title="Sunshine Coast 90s Surf Roots"
|
||||
description="Earthy winters and golden summers. Vintage surf threads for the soul."
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/travel-landscape-dreamy-aesthetic_23-2151445704.jpg",
|
||||
alt: "Travel landscape in dreamy aesthetic",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/travel-landscape-dreamy-aesthetic_23-2151445704.jpg", alt: "Travel landscape in dreamy aesthetic"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-man-holding-surf-board-water_23-2148021712.jpg",
|
||||
alt: "Young man holding surf board in water ",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/young-man-holding-surf-board-water_23-2148021712.jpg", alt: "Young man holding surf board in water "},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/photo-retro-style-with-volleyball-net-beach-palms-blue-summer-sky_158538-13689.jpg",
|
||||
alt: "Photo in retro style with volleyball net on beach and palms behind blue summer sky",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/photo-retro-style-with-volleyball-net-beach-palms-blue-summer-sky_158538-13689.jpg", alt: "Photo in retro style with volleyball net on beach and palms behind blue summer sky"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/young-man-sitting-surfboard-blue-water_23-2148022399.jpg",
|
||||
alt: "Young man sitting on surfboard in blue water",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/young-man-sitting-surfboard-blue-water_23-2148022399.jpg", alt: "Young man sitting on surfboard in blue water"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/woman-with-longboard-man-with-bicycle_23-2147764090.jpg",
|
||||
alt: "Woman with longboard and man with bicycle",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/woman-with-longboard-man-with-bicycle_23-2147764090.jpg", alt: "Woman with longboard and man with bicycle"},
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
avatarText="Join 5,000+ surf enthusiasts"
|
||||
buttons={[
|
||||
{
|
||||
text: "Shop Winter Collection",
|
||||
href: "#products",
|
||||
},
|
||||
text: "Shop Winter Collection", href: "#products"},
|
||||
{
|
||||
text: "Explore History",
|
||||
href: "#about",
|
||||
},
|
||||
text: "Explore History", href: "#about"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -100,15 +77,13 @@ export default function LandingPage() {
|
||||
<div id="about" data-section="about">
|
||||
<MediaAbout
|
||||
useInvertedBackground={false}
|
||||
title="Born in the 90s"
|
||||
description="Inspired by the raw, unrefined energy of the Sunshine Coast. We craft wooly, earth-toned winter wear and vibrant, sun-drenched boardshorts that stand the test of time."
|
||||
title="Our Story"
|
||||
description="Born in the early 2000s from a vision by former professional surfer Michael Hoe. Driven by a desire to build something unique to share with others, his dream was for this clothing brand to continue the legacy of surfing, creating a lifestyle that surfers wear to feel connected to the golden era of pro surfing."
|
||||
imageSrc="http://img.b2bpic.net/free-photo/young-male-sitting-beach-admiring-sea_181624-22221.jpg"
|
||||
imageAlt="wooly textured winter sweater"
|
||||
buttons={[
|
||||
{
|
||||
text: "Our Story",
|
||||
href: "#",
|
||||
},
|
||||
text: "Our Story", href: "#"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -120,23 +95,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Wooly Winters",
|
||||
description: "Ethically sourced earthy wools.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-standing-green-car_23-2148774637.jpg",
|
||||
imageAlt: "cozy wool winter cardigan",
|
||||
},
|
||||
title: "Wooly Winters", description: "Ethically sourced earthy wools.", imageSrc: "http://img.b2bpic.net/free-photo/young-woman-standing-green-car_23-2148774637.jpg", imageAlt: "cozy wool winter cardigan"},
|
||||
{
|
||||
title: "Retro Shorts",
|
||||
description: "Warm, vibrant summer boardshorts.",
|
||||
imageSrc: "https://img.b2bpic.net/premium-photo/painting-man-standing-beach-with-surfboard-generative-ai_958108-51814.jpg?id=84977024",
|
||||
imageAlt: "vibrant retro boardshorts",
|
||||
},
|
||||
title: "Retro Shorts", description: "Warm, vibrant summer boardshorts.", imageSrc: "https://img.b2bpic.net/premium-photo/painting-man-standing-beach-with-surfboard-generative-ai_958108-51814.jpg?id=84977024", imageAlt: "vibrant retro boardshorts"},
|
||||
{
|
||||
title: "Timeless Style",
|
||||
description: "90s silhouettes reimagined.",
|
||||
imageSrc: "https://img.b2bpic.net/premium-photo/young-happy-couple-with-skateboards-enjoy-longboarding-skatepark_179755-22306.jpg?id=83240557",
|
||||
imageAlt: "surf apparel winter layers",
|
||||
},
|
||||
title: "Timeless Style", description: "90s silhouettes reimagined.", imageSrc: "https://img.b2bpic.net/premium-photo/young-happy-couple-with-skateboards-enjoy-longboarding-skatepark_179755-22306.jpg?id=83240557", imageAlt: "surf apparel winter layers"},
|
||||
]}
|
||||
title="Why SunCoast Gear"
|
||||
description="Authentic surf heritage meets modern durability."
|
||||
@@ -151,53 +114,17 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
name: "Earth Knits Sweater",
|
||||
price: "$129",
|
||||
variant: "Winter",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-girl-with-hat-gloves-posing_23-2148350091.jpg",
|
||||
imageAlt: "brown wool sweater surf",
|
||||
},
|
||||
id: "p1", name: "Earth Knits Sweater", price: "$129", variant: "Winter", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-girl-with-hat-gloves-posing_23-2148350091.jpg", imageAlt: "brown wool sweater surf"},
|
||||
{
|
||||
id: "p2",
|
||||
name: "Retro Boardies - Sunset",
|
||||
price: "$69",
|
||||
variant: "Summer",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-with-dark-long-hair-beige-dress-posing-summer-beach_158538-10375.jpg",
|
||||
imageAlt: "bright orange surf shorts",
|
||||
},
|
||||
id: "p2", name: "Retro Boardies - Sunset", price: "$69", variant: "Summer", imageSrc: "http://img.b2bpic.net/free-photo/woman-with-dark-long-hair-beige-dress-posing-summer-beach_158538-10375.jpg", imageAlt: "bright orange surf shorts"},
|
||||
{
|
||||
id: "p3",
|
||||
name: "Wool Beanie - Sand",
|
||||
price: "$39",
|
||||
variant: "Winter",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-funny-beautiful-fair-haired-woman-knited-hats-sweater-smiling-blue_176420-7673.jpg",
|
||||
imageAlt: "earthy knit beanie winter",
|
||||
},
|
||||
id: "p3", name: "Wool Beanie - Sand", price: "$39", variant: "Winter", imageSrc: "http://img.b2bpic.net/free-photo/young-funny-beautiful-fair-haired-woman-knited-hats-sweater-smiling-blue_176420-7673.jpg", imageAlt: "earthy knit beanie winter"},
|
||||
{
|
||||
id: "p4",
|
||||
name: "Retro Boardies - Gold",
|
||||
price: "$69",
|
||||
variant: "Summer",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-sexy-smiling-hipster-woman-sunglasses-trendy-girl-summer-knitted-cardigan-topic-shorts-positive-female-going-crazy-with-pink-penny-skateboard-isolated-beige-wall-two-hor_158538-5908.jpg",
|
||||
imageAlt: "retro graphic boardshorts orange",
|
||||
},
|
||||
id: "p4", name: "Retro Boardies - Gold", price: "$69", variant: "Summer", imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-sexy-smiling-hipster-woman-sunglasses-trendy-girl-summer-knitted-cardigan-topic-shorts-positive-female-going-crazy-with-pink-penny-skateboard-isolated-beige-wall-two-hor_158538-5908.jpg", imageAlt: "retro graphic boardshorts orange"},
|
||||
{
|
||||
id: "p5",
|
||||
name: "Thick Wool Jumper",
|
||||
price: "$149",
|
||||
variant: "Winter",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-by-tree-spring-forest-with-drink-thermos_1157-32851.jpg",
|
||||
imageAlt: "textured brown wool jumper",
|
||||
},
|
||||
id: "p5", name: "Thick Wool Jumper", price: "$149", variant: "Winter", imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-by-tree-spring-forest-with-drink-thermos_1157-32851.jpg", imageAlt: "textured brown wool jumper"},
|
||||
{
|
||||
id: "p6",
|
||||
name: "Retro Boardies - Neon",
|
||||
price: "$79",
|
||||
variant: "Summer",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-taking-shower-beach_23-2149736519.jpg",
|
||||
imageAlt: "bright yellow surf shorts",
|
||||
},
|
||||
id: "p6", name: "Retro Boardies - Neon", price: "$79", variant: "Summer", imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-taking-shower-beach_23-2149736519.jpg", imageAlt: "bright yellow surf shorts"},
|
||||
]}
|
||||
title="The Surf Collection"
|
||||
description="Winter warmth and summer heat."
|
||||
@@ -211,34 +138,16 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
plans={[
|
||||
{
|
||||
id: "winter",
|
||||
tag: "Essential",
|
||||
price: "$180",
|
||||
period: "bundle",
|
||||
description: "Winter survival pack.",
|
||||
button: {
|
||||
text: "Get Winter Gear",
|
||||
},
|
||||
featuresTitle: "Includes",
|
||||
features: [
|
||||
"Wool Sweater",
|
||||
"Beanie",
|
||||
],
|
||||
id: "winter", tag: "Essential", price: "$180", period: "bundle", description: "Winter survival pack.", button: {
|
||||
text: "Get Winter Gear"},
|
||||
featuresTitle: "Includes", features: [
|
||||
"Wool Sweater", "Beanie"],
|
||||
},
|
||||
{
|
||||
id: "summer",
|
||||
tag: "Vibrant",
|
||||
price: "$110",
|
||||
period: "bundle",
|
||||
description: "Summer vibe bundle.",
|
||||
button: {
|
||||
text: "Get Summer Gear",
|
||||
},
|
||||
featuresTitle: "Includes",
|
||||
features: [
|
||||
"Boardshorts",
|
||||
"Cap",
|
||||
],
|
||||
id: "summer", tag: "Vibrant", price: "$110", period: "bundle", description: "Summer vibe bundle.", button: {
|
||||
text: "Get Summer Gear"},
|
||||
featuresTitle: "Includes", features: [
|
||||
"Boardshorts", "Cap"],
|
||||
},
|
||||
]}
|
||||
title="Surf Kits"
|
||||
@@ -254,20 +163,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "15+",
|
||||
description: "Years in the surf",
|
||||
},
|
||||
id: "m1", value: "15+", description: "Years in the surf"},
|
||||
{
|
||||
id: "m2",
|
||||
value: "22k+",
|
||||
description: "Items sold",
|
||||
},
|
||||
id: "m2", value: "22k+", description: "Items sold"},
|
||||
{
|
||||
id: "m3",
|
||||
value: "89%",
|
||||
description: "Organic Australian materials ",
|
||||
},
|
||||
id: "m3", value: "89%", description: "Organic Australian materials "},
|
||||
]}
|
||||
title="Surf Stats"
|
||||
description="Quality defined."
|
||||
@@ -281,64 +181,28 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1",
|
||||
name: "John Doe",
|
||||
role: "Local Surfer",
|
||||
company: "Sunshine Coast",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-posing-beach-with-surfboard-woman-surfer-ocean-waves_1296-762.jpg",
|
||||
imageAlt: "happy surf customer beach",
|
||||
},
|
||||
id: "t1", name: "John Doe", role: "Local Surfer", company: "Sunshine Coast", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-girl-posing-beach-with-surfboard-woman-surfer-ocean-waves_1296-762.jpg", imageAlt: "happy surf customer beach"},
|
||||
{
|
||||
id: "t2",
|
||||
name: "Jane Smith",
|
||||
role: "Surf Instructor",
|
||||
company: "Noosa Heads",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-charming-young-lady-with-short-wavy-hair-embroidery-pretty-girl-sitting-chair-bright-blue-screen-indoor-background-looking-up_639032-142.jpg",
|
||||
imageAlt: "stylish surf apparel customer",
|
||||
},
|
||||
id: "t2", name: "Jane Smith", role: "Surf Instructor", company: "Noosa Heads", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-charming-young-lady-with-short-wavy-hair-embroidery-pretty-girl-sitting-chair-bright-blue-screen-indoor-background-looking-up_639032-142.jpg", imageAlt: "stylish surf apparel customer"},
|
||||
{
|
||||
id: "t3",
|
||||
name: "Mick Brown",
|
||||
role: "Photographer",
|
||||
company: "Maroochydore",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/landscape-with-plane-flying-sky_23-2149520419.jpg",
|
||||
imageAlt: "customer portrait suncoast surf",
|
||||
},
|
||||
id: "t3", name: "Mick Brown", role: "Photographer", company: "Maroochydore", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/landscape-with-plane-flying-sky_23-2149520419.jpg", imageAlt: "customer portrait suncoast surf"},
|
||||
{
|
||||
id: "t4",
|
||||
name: "Sarah Lee",
|
||||
role: "Designer",
|
||||
company: "Coolum",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/traveller-london-city-with-atumn-vibes_23-2149104645.jpg",
|
||||
imageAlt: "surf enthusiast portrait beach",
|
||||
},
|
||||
id: "t4", name: "Sarah Lee", role: "Designer", company: "Coolum", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/traveller-london-city-with-atumn-vibes_23-2149104645.jpg", imageAlt: "surf enthusiast portrait beach"},
|
||||
{
|
||||
id: "t5",
|
||||
name: "Tom Baker",
|
||||
role: "Beach Bum",
|
||||
company: "Mooloolaba",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-people-going-thrifting_23-2150082934.jpg",
|
||||
imageAlt: "surf lifestyle apparel customer",
|
||||
},
|
||||
id: "t5", name: "Tom Baker", role: "Beach Bum", company: "Mooloolaba", rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-people-going-thrifting_23-2150082934.jpg", imageAlt: "surf lifestyle apparel customer"},
|
||||
]}
|
||||
kpiItems={[
|
||||
{
|
||||
value: "",
|
||||
label: "",
|
||||
},
|
||||
value: "", label: ""},
|
||||
{
|
||||
value: "4.7",
|
||||
label: "average rating with thousands of positive reviews",
|
||||
},
|
||||
value: "4.7", label: "average rating with thousands of positive reviews"},
|
||||
{
|
||||
value: "",
|
||||
label: "",
|
||||
},
|
||||
value: "", label: ""},
|
||||
]}
|
||||
title="Community Love"
|
||||
description="What our local surf community says."
|
||||
@@ -351,20 +215,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "Are your wool products sustainable?",
|
||||
content: "Yes, we focus on eco-friendly, durable wool sources.",
|
||||
},
|
||||
id: "f1", title: "Are your wool products sustainable?", content: "Yes, we focus on eco-friendly, durable wool sources."},
|
||||
{
|
||||
id: "f2",
|
||||
title: "Do you ship across Australia?",
|
||||
content: "We ship everywhere in Australia.",
|
||||
},
|
||||
id: "f2", title: "Do you ship across Australia?", content: "We ship everywhere in Australia."},
|
||||
{
|
||||
id: "f3",
|
||||
title: "How do I choose the right fit?",
|
||||
content: "Check our size guide on each product page.",
|
||||
},
|
||||
id: "f3", title: "How do I choose the right fit?", content: "Check our size guide on each product page."},
|
||||
]}
|
||||
title="Common Questions"
|
||||
description="Get answers about our threads."
|
||||
@@ -376,8 +231,7 @@ export default function LandingPage() {
|
||||
<ContactCenter
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
variant: "plain"}}
|
||||
tag="Newsletter"
|
||||
title="Join the Crew"
|
||||
description="Get vintage surf vibes and exclusive winter drops."
|
||||
@@ -389,29 +243,19 @@ export default function LandingPage() {
|
||||
logoText="Blue sea "
|
||||
columns={[
|
||||
{
|
||||
title: "Shop",
|
||||
items: [
|
||||
title: "Shop", items: [
|
||||
{
|
||||
label: "Winter Attire",
|
||||
href: "#products",
|
||||
},
|
||||
label: "Winter Attire", href: "#products"},
|
||||
{
|
||||
label: "Boardshorts",
|
||||
href: "#products",
|
||||
},
|
||||
label: "Boardshorts", href: "#products"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "About",
|
||||
items: [
|
||||
title: "About", items: [
|
||||
{
|
||||
label: "Our History",
|
||||
href: "#about",
|
||||
},
|
||||
label: "Our History", href: "#about"},
|
||||
{
|
||||
label: "Privacy",
|
||||
href: "#",
|
||||
},
|
||||
label: "Privacy", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
@@ -420,4 +264,4 @@ export default function LandingPage() {
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user