178 lines
8.0 KiB
TypeScript
178 lines
8.0 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import ReactLenis from "lenis/react";
|
|
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
|
import FooterCard from '@/components/sections/footer/FooterCard';
|
|
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
|
|
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
|
|
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
|
|
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
|
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
|
|
import { Instagram, Twitter } from "lucide-react";
|
|
|
|
export default function LandingPage() {
|
|
return (
|
|
<ThemeProvider
|
|
defaultButtonVariant="text-stagger"
|
|
defaultTextAnimation="reveal-blur"
|
|
borderRadius="rounded"
|
|
contentWidth="mediumSmall"
|
|
sizing="medium"
|
|
background="fluid"
|
|
cardStyle="glass-elevated"
|
|
primaryButtonStyle="primary-glow"
|
|
secondaryButtonStyle="glass"
|
|
headingFontWeight="bold"
|
|
>
|
|
<ReactLenis root>
|
|
<div id="nav" data-section="nav">
|
|
<NavbarStyleCentered
|
|
navItems={[
|
|
{
|
|
name: "Home", id: "hero"},
|
|
{
|
|
name: "Products", id: "products"},
|
|
{
|
|
name: "Trust", id: "metrics"},
|
|
{
|
|
name: "Reviews", id: "testimonials"},
|
|
]}
|
|
brandName="MBROT"
|
|
/>
|
|
</div>
|
|
|
|
<div id="hero" data-section="hero">
|
|
<HeroCarouselLogo
|
|
logoText="URBAN ESSENTIALS"
|
|
description="Redefining the modern wardrobe for the conscious individual. Premium quality, timeless design."
|
|
buttons={[
|
|
{
|
|
text: "Shop Now", href: "#products"},
|
|
{
|
|
text: "View Lookbook", href: "#"},
|
|
]}
|
|
slides={[
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-portrait-teenager-woman_23-2149453348.jpg", imageAlt: "Streetwear Model"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-posing-with-black-outfit_23-2151044540.jpg", imageAlt: "Front view woman posing with black outfit"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/interested-african-man-chilling-stairs-inspired-guy-black-attire-sitting-steps-thinking-about-something_197531-22075.jpg", imageAlt: "Interested african man chilling on stairs"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/front-view-couple-posing-black-white_23-2149735213.jpg", imageAlt: "Front view couple posing black and white"},
|
|
{
|
|
imageSrc: "http://img.b2bpic.net/free-photo/young-woman-standing-universe-texture-projection_23-2149512085.jpg", imageAlt: "Young woman standing in universe texture projection"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="products" data-section="products">
|
|
<ProductCardThree
|
|
animationType="blur-reveal"
|
|
textboxLayout="default"
|
|
gridVariant="three-columns-all-equal-width"
|
|
useInvertedBackground={true}
|
|
products={[
|
|
{
|
|
id: "p1", name: "Heavyweight Hoodie", price: "£120", imageSrc: "http://img.b2bpic.net/free-photo/woman-s-hands-holding-plant-with-dark-curtain_23-2149640628.jpg"},
|
|
{
|
|
id: "p2", name: "Oversized Tee", price: "£45", imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-creating-vision-board_23-2150061907.jpg"},
|
|
{
|
|
id: "p3", name: "Cargo Trousers", price: "£145", imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-fashion-boutique-template_23-2150632564.jpg"},
|
|
{
|
|
id: "p4", name: "Technical Jacket", price: "£280", imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-woman-with-earphones_23-2149429040.jpg"},
|
|
{
|
|
id: "p5", name: "Leather Chelsea Boots", price: "£320", imageSrc: "http://img.b2bpic.net/free-photo/portrait-woman-representing-virgo-zodiac-sign_23-2151006272.jpg"},
|
|
{
|
|
id: "p6", name: "Minimalist Cap", price: "£35", imageSrc: "http://img.b2bpic.net/free-vector/elegant-photographer-instagram-story-template-pack_742173-7697.jpg"},
|
|
]}
|
|
title="Featured Collections"
|
|
description="Discover our latest seasonal staples, designed for durability and refined style."
|
|
/>
|
|
</div>
|
|
|
|
<div id="metrics" data-section="metrics">
|
|
<MetricCardFourteen
|
|
useInvertedBackground={true}
|
|
title="Our Standards"
|
|
tag="Quality Assured"
|
|
metrics={[
|
|
{
|
|
id: "m1", value: "100%", description: "Ethically Sourced Fabric"},
|
|
{
|
|
id: "m2", value: "24h", description: "Priority Dispatch UK"},
|
|
{
|
|
id: "m3", value: "12mo", description: "Extended Product Guarantee"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="testimonials" data-section="testimonials">
|
|
<TestimonialCardSixteen
|
|
animationType="blur-reveal"
|
|
textboxLayout="default"
|
|
useInvertedBackground={true}
|
|
testimonials={[
|
|
{
|
|
id: "t1", name: "Alex Rivers", role: "Creative Lead", company: "Studio X", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ChaeSUOuXuI6UCWCky1Y9Qm6Im/uploaded-1776840651842-9ydyrzhj.jpg?_wi=1"},
|
|
{
|
|
id: "t2", name: "Sarah Jenkins", role: "Director", company: "Brand Co", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ChaeSUOuXuI6UCWCky1Y9Qm6Im/uploaded-1776840651842-9ydyrzhj.jpg?_wi=2"},
|
|
{
|
|
id: "t3", name: "Mark Owen", role: "Freelancer", company: "Self", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ChaeSUOuXuI6UCWCky1Y9Qm6Im/uploaded-1776840651842-9ydyrzhj.jpg?_wi=3"},
|
|
{
|
|
id: "t4", name: "Elena Voss", role: "Designer", company: "Agency Ltd", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ChaeSUOuXuI6UCWCky1Y9Qm6Im/uploaded-1776840651842-9ydyrzhj.jpg?_wi=4"},
|
|
{
|
|
id: "t5", name: "Tom Baker", role: "Architect", company: "Firm One", rating: 5,
|
|
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3ChaeSUOuXuI6UCWCky1Y9Qm6Im/uploaded-1776840651842-9ydyrzhj.jpg?_wi=5"},
|
|
]}
|
|
kpiItems={[
|
|
{
|
|
value: "4.9/5", label: "Customer Rating"},
|
|
{
|
|
value: "10k+", label: "Happy Clients"},
|
|
{
|
|
value: "Global", label: "Shipping"},
|
|
]}
|
|
title="Community Voices"
|
|
description="We take pride in our commitment to quality, reflected in the stories of our community members who value excellence and sustainable fashion choices."
|
|
/>
|
|
</div>
|
|
|
|
<div id="contact" data-section="contact">
|
|
<ContactCTA
|
|
useInvertedBackground={true}
|
|
background={{
|
|
variant: "sparkles-gradient"}}
|
|
tag="Support"
|
|
title="Direct Access to Our Team"
|
|
description="Whether you need advice on your next fit or have questions about order logistics, our premium support team is available 24/7 to provide personalized assistance."
|
|
buttons={[
|
|
{
|
|
text: "Get in Touch", href: "mailto:hello@mbrot.com"},
|
|
]}
|
|
/>
|
|
</div>
|
|
|
|
<div id="footer" data-section="footer">
|
|
<FooterCard
|
|
logoText="MBROT"
|
|
copyrightText="© 2025 | MBROT Premium Collective"
|
|
socialLinks={[
|
|
{
|
|
icon: Instagram,
|
|
href: "#", ariaLabel: "Instagram"},
|
|
{
|
|
icon: Twitter,
|
|
href: "#", ariaLabel: "Twitter"},
|
|
]}
|
|
/>
|
|
</div>
|
|
</ReactLenis>
|
|
</ThemeProvider>
|
|
);
|
|
} |