229 lines
9.9 KiB
TypeScript
229 lines
9.9 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
|
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
|
|
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
|
|
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
|
|
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
|
|
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
|
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
|
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
|
|
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
|
|
import { Zap } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="shift-hover"
|
|
defaultTextAnimation="entrance-slide"
|
|
borderRadius="soft"
|
|
contentWidth="compact"
|
|
sizing="largeSmallSizeMediumTitles"
|
|
background="blurBottom"
|
|
cardStyle="glass-elevated"
|
|
primaryButtonStyle="flat"
|
|
secondaryButtonStyle="solid"
|
|
headingFontWeight="light"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarLayoutFloatingInline
|
|
navItems={[
|
|
{
|
|
name: "Collection", id: "#products"},
|
|
{
|
|
name: "About", id: "#about"},
|
|
{
|
|
name: "Contact", id: "#contact"},
|
|
]}
|
|
brandName="Oroh"
|
|
button={{ text: "Get Started", href: "#contact" }}
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroLogoBillboard
|
|
background={{
|
|
variant: "canvas-reveal"}}
|
|
logoText="Step Into Motion, Own Your Story"
|
|
description="Discover Orohs revolutionary shoe designs through immersive 3D experiences. Each scroll reveals craftsmanship, innovation, and style engineered for the modern mover."
|
|
buttons={[
|
|
{
|
|
text: "Explore the Collection", href: "#products"},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/close-up-futuristic-sneakers_23-2151005661.jpg"
|
|
imageAlt="luxury sneaker product photography 3d"
|
|
mediaAnimation="slide-up"
|
|
/>
|
|
</div>
|
|
|
|
<div id="about" data-section="about">
|
|
<TestimonialAboutCard
|
|
useInvertedBackground={false}
|
|
tag="Craftsmanship"
|
|
title="Engineered for the Modern Mover"
|
|
description="At Oroh, we blend high-performance ergonomics with high-fashion silhouettes."
|
|
subdescription="Every design is born from the desire to break the boundaries between utility and art."
|
|
imageSrc="http://img.b2bpic.net/free-photo/black-fabric-closeup_53876-41999.jpg"
|
|
mediaAnimation="slide-up"
|
|
icon={Zap}
|
|
imageAlt="shoe craftsmanship detail macro"
|
|
/>
|
|
</div>
|
|
|
|
<div id="features" data-section="features">
|
|
<FeatureCardTwentyFour
|
|
animationType="slide-up"
|
|
textboxLayout="split"
|
|
useInvertedBackground={true}
|
|
features={[
|
|
{
|
|
id: "f1", title: "Precision Motion", author: "Engineering", description: "Dynamic sole architecture for peak efficiency.", tags: [
|
|
"Performance", "Tech"],
|
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-futuristic-sneakers_23-2151005649.jpg"},
|
|
{
|
|
id: "f2", title: "Aerodynamic Build", author: "Innovation", description: "Weightless construction for total agility.", tags: [
|
|
"Lightweight", "Design"],
|
|
imageSrc: "http://img.b2bpic.net/free-photo/colorful-sneaker-is-being-spray-painted-with-purple-spray-paint_123827-23438.jpg"},
|
|
{
|
|
id: "f3", title: "Sustainable Craft", author: "Artistry", description: "Ethically sourced premium materials.", tags: [
|
|
"Sustainability", "Eco"],
|
|
imageSrc: "http://img.b2bpic.net/free-photo/bottom-shoes-isolated-black-background_169016-52262.jpg"},
|
|
]}
|
|
title="Why Oroh?"
|
|
description="Innovative solutions for every step you take."
|
|
/>
|
|
</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: "Oroh Flux Black", price: "$180", imageSrc: "http://img.b2bpic.net/free-photo/close-up-futuristic-sneakers_23-2151005656.jpg"},
|
|
{
|
|
id: "p2", name: "Oroh Void Blue", price: "$195", imageSrc: "http://img.b2bpic.net/free-photo/ice-skates-studio-still-life_23-2150558979.jpg"},
|
|
{
|
|
id: "p3", name: "Oroh Terra Sand", price: "$175", imageSrc: "http://img.b2bpic.net/free-photo/amazing-young-woman-posing-bricked-wall-outdoor-shot-brunette-woman-wears-white-sneakers_197531-14529.jpg"},
|
|
{
|
|
id: "p4", name: "Oroh Drift Slate", price: "$210", imageSrc: "http://img.b2bpic.net/free-photo/woman-walking-down-stairs_53876-101877.jpg"},
|
|
{
|
|
id: "p5", name: "Oroh Zenith White", price: "$190", imageSrc: "http://img.b2bpic.net/free-photo/white-flowers-boot_23-2148069342.jpg"},
|
|
{
|
|
id: "p6", name: "Oroh Aero Chrome", price: "$225", imageSrc: "http://img.b2bpic.net/free-photo/muscular-male-legs-sportswear_23-2147775560.jpg"},
|
|
]}
|
|
title="Our Collection"
|
|
description="Statement pieces for the design-forward."
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardSeven
|
|
animationType="depth-3d"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
metrics={[
|
|
{
|
|
id: "m1", value: "15K+", title: "Happy Movers", items: [
|
|
"Global community", "Design enthusiasts"],
|
|
},
|
|
{
|
|
id: "m2", value: "20+", title: "Iterations", items: [
|
|
"Refining design", "Perfect ergonomics"],
|
|
},
|
|
{
|
|
id: "m3", value: "3", title: "Awards", items: [
|
|
"Design excellence", "Sustainability"],
|
|
},
|
|
]}
|
|
title="Innovation by Numbers"
|
|
description="Impact, design, and performance."
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardThirteen
|
|
animationType="slide-up"
|
|
textboxLayout="default"
|
|
useInvertedBackground={false}
|
|
testimonials={[
|
|
{
|
|
id: "t1", name: "Sarah J.", handle: "@sarah_j", testimonial: "The design is unlike anything I've owned. Feels like art for my feet.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-young-man-posing-spotlight_23-2151916002.jpg"},
|
|
{
|
|
id: "t2", name: "Mark L.", handle: "@mark_l", testimonial: "Incredible ergonomics, stylish enough for the boardroom.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/teenager-light-movie-projector_23-2149377404.jpg"},
|
|
{
|
|
id: "t3", name: "Elena R.", handle: "@elena_r", testimonial: "I love the attention to material quality and durability.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-woman-beach-with-roller-skates-80-s-aesthetic_23-2150835760.jpg"},
|
|
{
|
|
id: "t4", name: "David K.", handle: "@david_k", testimonial: "A true statement piece that doesn't compromise on comfort.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-blonde-schoolgirl-skater-posing-with-skateboard-while-leaning-guardrail-against-sky_613910-4637.jpg"},
|
|
{
|
|
id: "t5", name: "Julia M.", handle: "@julia_m", testimonial: "Oroh is redefining modern footwear aesthetics completely.", rating: 5,
|
|
imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-drag-queen-talking-phone_23-2149556835.jpg"},
|
|
]}
|
|
showRating={true}
|
|
title="Voices of Oroh"
|
|
description="Hear from our community of creators."
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactSplitForm
|
|
useInvertedBackground={true}
|
|
title="Stay in the Know"
|
|
description="Join our journey and get early access to our latest releases."
|
|
inputs={[
|
|
{
|
|
name: "name", type: "text", placeholder: "Your name", required: true,
|
|
},
|
|
{
|
|
name: "email", type: "email", placeholder: "Your email", required: true,
|
|
},
|
|
]}
|
|
imageSrc="http://img.b2bpic.net/free-photo/sustainability-concept-with-blank-geometric-forms-growing-plant_23-2148994245.jpg"
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterBaseReveal
|
|
logoText="OROH"
|
|
columns={[
|
|
{
|
|
title: "Brand", items: [
|
|
{
|
|
label: "About", href: "#about"},
|
|
{
|
|
label: "Philosophy", href: "#"},
|
|
],
|
|
},
|
|
{
|
|
title: "Collection", items: [
|
|
{
|
|
label: "Shop All", href: "#products"},
|
|
{
|
|
label: "New Arrivals", href: "#"},
|
|
],
|
|
},
|
|
{
|
|
title: "Support", items: [
|
|
{
|
|
label: "Contact Us", href: "#contact"},
|
|
{
|
|
label: "Privacy Policy", href: "#"},
|
|
],
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
}
|