Compare commits
10 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 5616dbfe02 | |||
| 2df593a06a | |||
| b587eafa75 | |||
| cf229da9ea | |||
| ef584091d9 | |||
| a96cfa0b59 | |||
| a693c0c847 | |||
| 1ae65dc221 | |||
| 1a8d6dac5e | |||
| 164a602284 |
161
src/app/page.tsx
161
src/app/page.tsx
@@ -11,7 +11,7 @@ import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
|
|||||||
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
||||||
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
|
||||||
import TextAbout from '@/components/sections/about/TextAbout';
|
import TextAbout from '@/components/sections/about/TextAbout';
|
||||||
import { Droplet, Palette, ShoppingBag } from "lucide-react";
|
import { Droplet, Palette, ShoppingBag, Sparkles } from "lucide-react";
|
||||||
|
|
||||||
export default function LandingPage() {
|
export default function LandingPage() {
|
||||||
return (
|
return (
|
||||||
@@ -31,16 +31,11 @@ export default function LandingPage() {
|
|||||||
<div id="nav" data-section="nav">
|
<div id="nav" data-section="nav">
|
||||||
<NavbarStyleCentered
|
<NavbarStyleCentered
|
||||||
navItems={[
|
navItems={[
|
||||||
{
|
{ name: "Home", id: "hero" },
|
||||||
name: "Home", id: "hero"},
|
{ name: "Services", id: "about" },
|
||||||
{
|
{ name: "Products", id: "products" },
|
||||||
name: "Services", id: "about"},
|
{ name: "Pricing", id: "pricing" },
|
||||||
{
|
{ name: "Contact", id: "contact" },
|
||||||
name: "Products", id: "products"},
|
|
||||||
{
|
|
||||||
name: "Pricing", id: "pricing"},
|
|
||||||
{
|
|
||||||
name: "Contact", id: "contact"},
|
|
||||||
]}
|
]}
|
||||||
brandName="Spray on Shift"
|
brandName="Spray on Shift"
|
||||||
/>
|
/>
|
||||||
@@ -48,41 +43,27 @@ export default function LandingPage() {
|
|||||||
|
|
||||||
<div id="hero" data-section="hero">
|
<div id="hero" data-section="hero">
|
||||||
<HeroSplit
|
<HeroSplit
|
||||||
background={{
|
background={{ variant: "gradient-bars" }}
|
||||||
variant: "gradient-bars"}}
|
|
||||||
title="Custom Skateboards. Raw Art. Urban Culture."
|
title="Custom Skateboards. Raw Art. Urban Culture."
|
||||||
description="Transform your ride with one-of-a-kind art crafted by street artists. From custom decks to apparel, we breathe life into the skate culture."
|
description="Transform your ride with one-of-a-kind art crafted by street artists. From custom decks to apparel, we breathe life into the skate culture."
|
||||||
buttons={[
|
buttons={[{ text: "Shop Custom Decks", href: "#products" }]}
|
||||||
{
|
|
||||||
text: "Shop Custom Decks", href: "#products"},
|
|
||||||
]}
|
|
||||||
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DUWrtQyuyooxCATUVEf5CXNmtR/uploaded-1778337761429-xbhw7mnx.jpg?_wi=1"
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DUWrtQyuyooxCATUVEf5CXNmtR/uploaded-1778337761429-xbhw7mnx.jpg?_wi=1"
|
||||||
imageAlt="Spray on Shift Brand Logo"
|
imageAlt="Spray on Shift Brand Logo"
|
||||||
mediaAnimation="slide-up"
|
mediaAnimation="slide-up"
|
||||||
avatars={[
|
avatars={[
|
||||||
{
|
{ src: "http://img.b2bpic.net/free-photo/side-view-teen-doing-tricks-skateboard_23-2149633145.jpg", alt: "Side view teen doing tricks on skateboard" },
|
||||||
src: "http://img.b2bpic.net/free-photo/side-view-teen-doing-tricks-skateboard_23-2149633145.jpg", alt: "Side view teen doing tricks on skateboard"},
|
{ src: "http://img.b2bpic.net/free-photo/lifestyle-portrait-handsome-man-posing-street-city-with-graffiti-wall_627829-7239.jpg", alt: "Lifestyle portrait of handsome man posing on the street" },
|
||||||
{
|
{ src: "http://img.b2bpic.net/free-photo/beard-man-standing-front-colorful-graffiti-wall_23-2147827515.jpg", alt: "Beard man standing in front of colorful graffiti wall" },
|
||||||
src: "http://img.b2bpic.net/free-photo/lifestyle-portrait-handsome-man-posing-street-city-with-graffiti-wall_627829-7239.jpg", alt: "Lifestyle portrait of handsome man posing on the street"},
|
{ src: "http://img.b2bpic.net/free-photo/young-male-model-posing-with-skateboard_23-2147995971.jpg", alt: "Young male model posing with skateboard" },
|
||||||
{
|
{ src: "http://img.b2bpic.net/free-photo/side-view-young-woman-with-skateboard_23-2148435981.jpg", alt: "Side view young woman with skateboard" },
|
||||||
src: "http://img.b2bpic.net/free-photo/beard-man-standing-front-colorful-graffiti-wall_23-2147827515.jpg", alt: "Beard man standing in front of colorful graffiti wall"},
|
|
||||||
{
|
|
||||||
src: "http://img.b2bpic.net/free-photo/young-male-model-posing-with-skateboard_23-2147995971.jpg", alt: "Young male model posing with skateboard"},
|
|
||||||
{
|
|
||||||
src: "http://img.b2bpic.net/free-photo/side-view-young-woman-with-skateboard_23-2148435981.jpg", alt: "Side view young woman with skateboard"},
|
|
||||||
]}
|
]}
|
||||||
avatarText="Join our growing skate community"
|
avatarText="Join our growing skate community"
|
||||||
marqueeItems={[
|
marqueeItems={[
|
||||||
{
|
{ type: "text", text: "100% Hand-Painted" },
|
||||||
type: "text", text: "100% Hand-Painted"},
|
{ type: "text", text: "Street Culture Roots" },
|
||||||
{
|
{ type: "text", text: "Global Shipping" },
|
||||||
type: "text", text: "Street Culture Roots"},
|
{ type: "text", text: "Custom Commissions" },
|
||||||
{
|
{ type: "text", text: "Urban Tested" },
|
||||||
type: "text", text: "Global Shipping"},
|
|
||||||
{
|
|
||||||
type: "text", text: "Custom Commissions"},
|
|
||||||
{
|
|
||||||
type: "text", text: "Urban Tested"},
|
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@@ -91,10 +72,7 @@ export default function LandingPage() {
|
|||||||
<TextAbout
|
<TextAbout
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
title="Born in the Streets. Crafted for the Concrete."
|
title="Born in the Streets. Crafted for the Concrete."
|
||||||
buttons={[
|
buttons={[{ text: "See Our Vision" }]}
|
||||||
{
|
|
||||||
text: "See Our Vision"},
|
|
||||||
]}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -104,15 +82,9 @@ export default function LandingPage() {
|
|||||||
textboxLayout="split"
|
textboxLayout="split"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
features={[
|
features={[
|
||||||
{
|
{ icon: Palette, title: "Custom Deck Art", description: "Fully bespoke hand-painted skateboard designs." },
|
||||||
icon: Palette,
|
{ icon: Droplet, title: "Custom Grip Tape", description: "High-performance grip tape with unique graphic patterns." },
|
||||||
title: "Custom Deck Art", description: "Fully bespoke hand-painted skateboard designs."},
|
{ icon: ShoppingBag, title: "Streetwear Apparel", description: "Exclusive graphic tees, hoodies, and skate gear." },
|
||||||
{
|
|
||||||
icon: Droplet,
|
|
||||||
title: "Custom Grip Tape", description: "High-performance grip tape with unique graphic patterns."},
|
|
||||||
{
|
|
||||||
icon: ShoppingBag,
|
|
||||||
title: "Streetwear Apparel", description: "Exclusive graphic tees, hoodies, and skate gear."},
|
|
||||||
]}
|
]}
|
||||||
title="What We Do Best"
|
title="What We Do Best"
|
||||||
description="Elevate your aesthetic with premium custom design services."
|
description="Elevate your aesthetic with premium custom design services."
|
||||||
@@ -126,18 +98,12 @@ export default function LandingPage() {
|
|||||||
gridVariant="four-items-2x2-equal-grid"
|
gridVariant="four-items-2x2-equal-grid"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
products={[
|
products={[
|
||||||
{
|
{ id: "p1", name: "custom skate deck ", price: "$65", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DUWrtQyuyooxCATUVEf5CXNmtR/uploaded-1778339468342-orr4grkv.jpg" },
|
||||||
id: "p1", name: "Graffiti Master Deck", price: "$120", imageSrc: "http://img.b2bpic.net/free-photo/cool-woman-with-longboard_53876-64866.jpg?_wi=1"},
|
{ id: "p2", name: "grip tape ", price: "$10", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DUWrtQyuyooxCATUVEf5CXNmtR/uploaded-1778340617573-g2166edx.jpg" },
|
||||||
{
|
{ id: "p3", name: "custom beanies ", price: "$30", imageSrc: "http://img.b2bpic.net/free-photo/view-person-using-skateboard-with-wheels-outdoors_23-2150407544.jpg?_wi=1" },
|
||||||
id: "p2", name: "Urban Vibe Tee", price: "$45", imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-checking-skateboard-wheels_23-2148436033.jpg?_wi=1"},
|
{ id: "p4", name: "custom hoodies", price: "$35", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DUWrtQyuyooxCATUVEf5CXNmtR/uploaded-1778340310615-2ip1httg.jpg" },
|
||||||
{
|
{ id: "p5", name: "custom shirts", price: "$45", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DUWrtQyuyooxCATUVEf5CXNmtR/uploaded-1778340344057-og5d3c6l.jpg" },
|
||||||
id: "p3", name: "Neon Shred Grip", price: "$25", imageSrc: "http://img.b2bpic.net/free-photo/view-person-using-skateboard-with-wheels-outdoors_23-2150407544.jpg?_wi=1"},
|
{ id: "p6", name: "Acid Wash Cap", price: "$30", imageSrc: "http://img.b2bpic.net/free-photo/skate-parkteens-skate-park_23-2149836861.jpg" },
|
||||||
{
|
|
||||||
id: "p4", name: "Classic Street Hoodie", price: "$85", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-holding-skateboard_23-2149241697.jpg"},
|
|
||||||
{
|
|
||||||
id: "p5", name: "Concrete Legend Deck", price: "$135", imageSrc: "http://img.b2bpic.net/free-photo/skater-wearing-trucker-hat_23-2149431174.jpg"},
|
|
||||||
{
|
|
||||||
id: "p6", name: "Acid Wash Cap", price: "$30", imageSrc: "http://img.b2bpic.net/free-photo/skate-parkteens-skate-park_23-2149836861.jpg"},
|
|
||||||
]}
|
]}
|
||||||
title="Featured Drops"
|
title="Featured Drops"
|
||||||
description="Hand-picked gear for the modern skater."
|
description="Hand-picked gear for the modern skater."
|
||||||
@@ -150,30 +116,9 @@ export default function LandingPage() {
|
|||||||
textboxLayout="split"
|
textboxLayout="split"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
plans={[
|
plans={[
|
||||||
{
|
{ id: "tape", badge: "Essential", price: "$25", subtitle: "Custom Grip Tape Design", buttons: [{ text: "Order Now" }], features: ["Durable grit", "Unique spray art"] },
|
||||||
id: "tape", badge: "Essential", price: "$25", subtitle: "Custom Grip Tape Design", buttons: [
|
{ id: "deck", badge: "Popular", badgeIcon: Sparkles, price: "$65", subtitle: "Fully Hand-Painted Decks", buttons: [{ text: "Collaborate with an Artist" }], features: ["Premium maple", "1-on-1 Artist collaboration"] },
|
||||||
{
|
{ id: "apparel", badge: "Gear", price: "$40 ", subtitle: "Apparel & Accessories", buttons: [{ text: "Shop Gear" }], features: ["Heavyweight cotton", "Direct-to-garment art"] },
|
||||||
text: "Order Now"},
|
|
||||||
],
|
|
||||||
features: [
|
|
||||||
"Durable grit", "Unique spray art"],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "deck", badge: "Popular", price: "$120+", subtitle: "Fully Hand-Painted Decks", buttons: [
|
|
||||||
{
|
|
||||||
text: "Start Design"},
|
|
||||||
],
|
|
||||||
features: [
|
|
||||||
"Premium maple", "1-on-1 Artist collaboration"],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "apparel", badge: "Gear", price: "$40+", subtitle: "Apparel & Accessories", buttons: [
|
|
||||||
{
|
|
||||||
text: "Shop Gear"},
|
|
||||||
],
|
|
||||||
features: [
|
|
||||||
"Heavyweight cotton", "Direct-to-garment art"],
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
title="Commission Your Vibe"
|
title="Commission Your Vibe"
|
||||||
description="Direct pricing for custom commissions and essentials."
|
description="Direct pricing for custom commissions and essentials."
|
||||||
@@ -185,16 +130,11 @@ export default function LandingPage() {
|
|||||||
textboxLayout="split"
|
textboxLayout="split"
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
testimonials={[
|
testimonials={[
|
||||||
{
|
{ id: "1", name: "Alex K.", date: "Oct 2024", title: "Skater", quote: "The board art is legendary, holding up perfectly at the park.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/high-angle-teen-holding-skateboard_23-2149633142.jpg", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DUWrtQyuyooxCATUVEf5CXNmtR/uploaded-1778337761429-xbhw7mnx.jpg?_wi=2", imageAlt: "portrait urban skater boy graffiti background" },
|
||||||
id: "1", name: "Alex K.", date: "Oct 2024", title: "Skater", quote: "The board art is legendary, holding up perfectly at the park.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/high-angle-teen-holding-skateboard_23-2149633142.jpg", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DUWrtQyuyooxCATUVEf5CXNmtR/uploaded-1778337761429-xbhw7mnx.jpg?_wi=2", imageAlt: "portrait urban skater boy graffiti background"},
|
{ id: "2", name: "Jordan P.", date: "Nov 2024", title: "Artist", quote: "Best grip tape design I've ever owned. Total eye-catcher.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/beautiful-cute-smiling-blond-teenager-model-without-makeup-summer-hipster-white-clothes-with-pink-penny-skateboard-posing-street-background_158538-12929.jpg", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DUWrtQyuyooxCATUVEf5CXNmtR/uploaded-1778340981976-j1nkr31f.jpg", imageAlt: "portrait urban skater boy graffiti background" },
|
||||||
{
|
{ id: "3", name: "Sam R.", date: "Dec 2024", title: "Street Style Enthusiast", quote: "The clothing drops are fire. Keep it coming!", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/high-angle-teen-holding-skateboard-outdoors_23-2149854322.jpg", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DUWrtQyuyooxCATUVEf5CXNmtR/uploaded-1778341094082-g36renh8.jpg", imageAlt: "portrait urban skater boy graffiti background" },
|
||||||
id: "2", name: "Jordan P.", date: "Nov 2024", title: "Artist", quote: "Best grip tape design I've ever owned. Total eye-catcher.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/beautiful-cute-smiling-blond-teenager-model-without-makeup-summer-hipster-white-clothes-with-pink-penny-skateboard-posing-street-background_158538-12929.jpg", imageSrc: "http://img.b2bpic.net/free-photo/cool-woman-with-longboard_53876-64866.jpg?_wi=2", imageAlt: "portrait urban skater boy graffiti background"},
|
{ id: "4", name: "Chris B.", date: "Jan 2025", title: "Skater", quote: "Professional work, quick turnaround. Highly recommend.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/young-people-london-streets_23-2149377210.jpg", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DUWrtQyuyooxCATUVEf5CXNmtR/uploaded-1778340998164-0ge0ora4.jpg", imageAlt: "portrait urban skater boy graffiti background" },
|
||||||
{
|
{ id: "5", name: "Taylor J.", date: "Feb 2025", title: "Skater", quote: "Custom deck looks even better in person. Sick art.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-young-artist-with-spray-bottle_23-2147839391.jpg", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DUWrtQyuyooxCATUVEf5CXNmtR/uploaded-1778340950948-v48wv5yp.jpg", imageAlt: "portrait urban skater boy graffiti background" },
|
||||||
id: "3", name: "Sam R.", date: "Dec 2024", title: "Street Style Enthusiast", quote: "The clothing drops are fire. Keep it coming!", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/high-angle-teen-holding-skateboard-outdoors_23-2149854322.jpg", imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-checking-skateboard-wheels_23-2148436033.jpg?_wi=2", imageAlt: "portrait urban skater boy graffiti background"},
|
|
||||||
{
|
|
||||||
id: "4", name: "Chris B.", date: "Jan 2025", title: "Skater", quote: "Professional work, quick turnaround. Highly recommend.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/young-people-london-streets_23-2149377210.jpg", imageSrc: "http://img.b2bpic.net/free-photo/view-person-using-skateboard-with-wheels-outdoors_23-2150407544.jpg?_wi=2", imageAlt: "portrait urban skater boy graffiti background"},
|
|
||||||
{
|
|
||||||
id: "5", name: "Taylor J.", date: "Feb 2025", title: "Skater", quote: "Custom deck looks even better in person. Sick art.", tag: "Verified", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-young-artist-with-spray-bottle_23-2147839391.jpg", imageSrc: "http://img.b2bpic.net/free-photo/hackers-using-phishing-technique_482257-85720.jpg?_wi=1", imageAlt: "portrait urban skater boy graffiti background"},
|
|
||||||
]}
|
]}
|
||||||
title="Street-Tested Reviews"
|
title="Street-Tested Reviews"
|
||||||
description="Real skaters, real feedback."
|
description="Real skaters, real feedback."
|
||||||
@@ -204,43 +144,26 @@ export default function LandingPage() {
|
|||||||
<div id="contact" data-section="contact">
|
<div id="contact" data-section="contact">
|
||||||
<ContactSplit
|
<ContactSplit
|
||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
background={{
|
background={{ variant: "rotated-rays-static" }}
|
||||||
variant: "rotated-rays-static"}}
|
|
||||||
tag="Let's Talk"
|
tag="Let's Talk"
|
||||||
title="Start Your Commission"
|
title="Start Your Commission"
|
||||||
description="Have an idea for a custom board? Reach out and we'll bring it to life."
|
description="Have an idea for a custom board? Reach out and we'll bring it to life."
|
||||||
imageSrc="http://img.b2bpic.net/free-photo/overhead-view-handwritten-spring-text-colorful-holi-powder_23-2148054413.jpg"
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DUWrtQyuyooxCATUVEf5CXNmtR/uploaded-1778340925693-8rtpk1xg.jpg"
|
||||||
mediaAnimation="slide-up"
|
mediaAnimation="slide-up"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="footer" data-section="footer">
|
<div id="footer" data-section="footer">
|
||||||
<FooterMedia
|
<FooterMedia
|
||||||
imageSrc="http://img.b2bpic.net/free-photo/hackers-using-phishing-technique_482257-85720.jpg?_wi=2"
|
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DUWrtQyuyooxCATUVEf5CXNmtR/uploaded-1778340871510-z1k4i180.jpg"
|
||||||
logoText="Spray on Shift"
|
logoText="Spray on Shift"
|
||||||
columns={[
|
columns={[
|
||||||
{
|
{ title: "Shop", items: [{ label: "Decks", href: "#products" }, { label: "Apparel", href: "#products" }, { label: "Custom Art", href: "#pricing" }] },
|
||||||
title: "Shop", items: [
|
{ title: "Company", items: [{ label: "About", href: "#about" }, { label: "Contact", href: "#contact" }] },
|
||||||
{
|
|
||||||
label: "Decks", href: "#products"},
|
|
||||||
{
|
|
||||||
label: "Apparel", href: "#products"},
|
|
||||||
{
|
|
||||||
label: "Custom Art", href: "#pricing"},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "Company", items: [
|
|
||||||
{
|
|
||||||
label: "About", href: "#about"},
|
|
||||||
{
|
|
||||||
label: "Contact", href: "#contact"},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</ReactLenis>
|
</ReactLenis>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
Reference in New Issue
Block a user