Files
38ca2293-434f-433d-882b-40c…/src/app/page.tsx
2026-04-26 13:52:25 +00:00

296 lines
15 KiB
TypeScript

"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
export default function LandingPage() {
return (
<ThemeProvider
defaultButtonVariant="expand-hover"
defaultTextAnimation="background-highlight"
borderRadius="soft"
contentWidth="small"
sizing="mediumSizeLargeTitles"
background="circleGradient"
cardStyle="glass-depth"
primaryButtonStyle="primary-glow"
secondaryButtonStyle="glass"
headingFontWeight="light"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={[
{
name: "Home", id: "hero"},
{
name: "Services", id: "services"},
{
name: "Portfolio", id: "portfolio"},
{
name: "Contact", id: "contact"},
]}
brandName="Mapulana Glass"
/>
</div>
<div id="hero" data-section="hero">
<HeroSplitDoubleCarousel
background={{
variant: "gradient-bars"}}
title="Precision Glass & Aluminium. Built for Modern Living."
description="Custom aluminium windows, doors, and roofing solutions crafted for durability, security, and style."
leftCarouselItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/serious-young-blonde-lady-walking-outdoors_171337-19439.jpg", imageAlt: "Luxury home aluminium windows"},
{
imageSrc: "http://img.b2bpic.net/free-photo/service-maintenance-worker-repairing_23-2149176709.jpg", imageAlt: "Glass installation project"},
{
imageSrc: "http://img.b2bpic.net/free-photo/windows-apartment-building-city_23-2148798614.jpg", imageAlt: "Modern home exterior"},
{
imageSrc: "http://img.b2bpic.net/free-photo/closeup-young-handyman-applying-some-sealant-door-with-sealing-gun_662251-2740.jpg", imageAlt: "Custom aluminium frame"},
{
imageSrc: "http://img.b2bpic.net/free-photo/blending-futuristic-building-seamlessly-into-desert-landscape_23-2151248396.jpg", imageAlt: "Roofing services work"},
]}
rightCarouselItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/casual-male-posing-with-electric-scooter_23-2148779878.jpg", imageAlt: "Modern aluminium door"},
{
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-view-blue-lake-captured-from-inside-villa_181624-10734.jpg", imageAlt: "Tiling finish details"},
{
imageSrc: "http://img.b2bpic.net/free-photo/young-businessman-standing-near-corporate-building_23-2147941460.jpg", imageAlt: "Ceiling renovation work"},
{
imageSrc: "http://img.b2bpic.net/free-photo/industrial-park-factory-building-warehouse_1417-1916.jpg", imageAlt: "Sturdy aluminium framing"},
{
imageSrc: "http://img.b2bpic.net/free-photo/happy-family-with-kids-looking-balcony-smiling_74855-9990.jpg", imageAlt: "Precision glass project"},
]}
buttons={[
{
text: "Get a Free Quote", href: "#contact"},
{
text: "View Our Work", href: "#portfolio"},
]}
avatars={[
{
src: "http://img.b2bpic.net/free-photo/service-maintenance-worker-repairing_23-2149176712.jpg", alt: "Client A"},
{
src: "http://img.b2bpic.net/free-photo/close-up-men-working-together_23-2148752025.jpg", alt: "Client B"},
{
src: "http://img.b2bpic.net/free-photo/focused-inspection-expert-with-safety-helmet-checking-quality-windows-walls-construction-site_662251-400.jpg", alt: "Client C"},
{
src: "http://img.b2bpic.net/free-photo/abstract-city-building-shadows_23-2149283266.jpg", alt: "Client D"},
{
src: "http://img.b2bpic.net/free-photo/hipster-african-american-girl-wearing-jeans-shirt-with-leopard-sleeves-posing-street-against-modern-office-building-with-blue-windows_627829-7123.jpg", alt: "Client E"},
]}
marqueeItems={[
{
type: "text", text: "Quality Assured"},
{
type: "text", text: "Tembisa Trusted"},
{
type: "text", text: "Custom Designs"},
{
type: "text", text: "Weather Resistant"},
{
type: "text", text: "Expert Teams"},
]}
/>
</div>
<div id="trust-strip" data-section="trust-strip">
<MetricCardSeven
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
metrics={[
{
id: "m1", value: "Professional", title: "Installation Quality", items: [
"Expert teams", "ISO standards", "Certified"],
},
{
id: "m2", value: "Durable", title: "Weather Proofing", items: [
"Storm resistant", "High quality", "Guaranteed"],
},
{
id: "m3", value: "Custom", title: "Bespoke Design", items: [
"Client vision", "Custom fit", "Precision"],
},
{
id: "m4", value: "Local", title: "Tembisa Experts", items: [
"Joburg based", "Reliable", "On-time"],
},
]}
title="Why Mapulana Leads"
description="Excellence in every installation."
/>
</div>
<div id="about" data-section="about">
<MetricSplitMediaAbout
useInvertedBackground={false}
title="Built on Craftsmanship. Trusted in Tembisa."
description="Mapulana Glass & Aluminium is a locally trusted company delivering high-quality aluminium and glass solutions. From modern homes to renovations, we bring precision, durability, and clean finishes to every project."
metrics={[
{
value: "10+", title: "Years Experience"},
{
value: "500+", title: "Projects Completed"},
]}
imageSrc="http://img.b2bpic.net/free-photo/woman-with-back-camera-opening-door-man_259150-58306.jpg"
imageAlt="Craftsman at work"
mediaAnimation="slide-up"
metricsAnimation="slide-up"
/>
</div>
<div id="services" data-section="services">
<FeatureCardOne
animationType="slide-up"
textboxLayout="split"
gridVariant="two-items-per-row"
useInvertedBackground={false}
features={[
{
title: "Aluminium Windows & Doors", description: "Custom-built frames designed for durability and modern aesthetics.", imageSrc: "http://img.b2bpic.net/free-photo/girl-with-sunglasses-talking-her-phone_1157-1810.jpg", imageAlt: "Aluminium windows"},
{
title: "Glass Installation", description: "Clean, strong, and professionally installed glass solutions.", imageSrc: "http://img.b2bpic.net/free-photo/man-servant-washing-windows_23-2149530810.jpg", imageAlt: "Glass installation"},
{
title: "Roofing Services", description: "Installation and repairs including storm and wind damage.", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-men-working-roof_23-2149343671.jpg", imageAlt: "Roofing services"},
{
title: "Building, Tiling & Ceilings", description: "Complete finishing solutions for homes and renovations.", imageSrc: "http://img.b2bpic.net/free-photo/handyman-uses-jackhammer-installation_169016-5286.jpg", imageAlt: "Tiling & Ceilings"},
]}
title="Premium Construction Services"
description="Comprehensive finishing and installation solutions for modern homes."
/>
</div>
<div id="portfolio" data-section="portfolio">
<ProductCardFour
animationType="slide-up"
textboxLayout="default"
gridVariant="one-large-left-three-stacked-right"
useInvertedBackground={false}
products={[
{
id: "p1", name: "Modern Glass Door", price: "See Installation Details", variant: "Premium Aluminium", imageSrc: "http://img.b2bpic.net/free-photo/close-up-beaujtiful-woman-luxury-travcel-house_23-2149140860.jpg"},
{
id: "p2", name: "Kitchen Renovation", price: "See Installation Details", variant: "Tiling Service", imageSrc: "http://img.b2bpic.net/free-photo/construction-worker-assembly-suspended-ceiling-with-drywall-fixing-drywall-ceiling-metal-frame-with-screwdriver_166373-1913.jpg"},
{
id: "p3", name: "Storm-proof Roof", price: "See Installation Details", variant: "Installation", imageSrc: "http://img.b2bpic.net/free-photo/construction-worker-doing-his-job-with-belt_23-2149343658.jpg"},
{
id: "p4", name: "Office Aluminium Window", price: "See Installation Details", variant: "Bespoke", imageSrc: "http://img.b2bpic.net/free-photo/bike-shop-with-shop-assistant_23-2148138793.jpg"},
{
id: "p5", name: "Ceiling Finish", price: "See Installation Details", variant: "Modern", imageSrc: "http://img.b2bpic.net/free-photo/suspended-ceiling-with-halogen-spots-lamps-drywall-construction-room_632498-1082.jpg"},
{
id: "p6", name: "Custom Glass Facade", price: "See Installation Details", variant: "Premium", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-luxury-vacation_23-2149204472.jpg"},
]}
title="Project Gallery"
description="A showcase of our recent high-end installations."
/>
</div>
<div id="why-choose-us" data-section="why-choose-us">
<SocialProofOne
textboxLayout="default"
useInvertedBackground={false}
names={[
"High-quality Materials", "Skilled Craftsmanship", "Affordable Pricing", "Fast Turnaround", "Local & Reliable", "Same-day Response", "Free Johannesburg Quotes"]}
title="Why We Are The Best"
description="Industry-leading standards and service."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={false}
testimonials={[
{
id: "t1", name: "Sarah Dlamini", role: "Homeowner", company: "Tembisa Resident", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-young-woman-standing-balcony-holding-white-coffee-cup_23-2148161153.jpg"},
{
id: "t2", name: "Michael Khoza", role: "Business Owner", company: "Local Client", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/older-woman-with-thumb-up_1149-1162.jpg"},
{
id: "t3", name: "Thandi Nkosi", role: "Client", company: "Renovation Project", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-smiley-man-woman-home_23-2148899724.jpg"},
{
id: "t4", name: "David Mokoena", role: "Homeowner", company: "Tembisa Resident", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-cute-family-repairs-room_1157-24899.jpg"},
{
id: "t5", name: "Linda Sithole", role: "Client", company: "Home Repair", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/cute-couple-holding-lamp_23-2147782380.jpg"},
]}
title="Client Feedback"
description="What our satisfied clients in Tembisa say."
/>
</div>
<div id="contact" data-section="contact">
<ContactSplit
useInvertedBackground={false}
background={{
variant: "rotated-rays-animated"}}
tag="Get A Quote"
title="Ready to Upgrade Your Home?"
description="Visit our workshop at 216 Brian Mazibuko Dr, Tembisa. We are open for consultations Monday through Friday from 7:30 AM to 5:00 PM and Saturdays from 8:00 AM to 1:00 PM. Call us today at 082 628 4120 to schedule your site visit."
mediaPosition="right"
inputPlaceholder="Enter your WhatsApp number"
buttonText="Request Quote"
imageSrc="http://img.b2bpic.net/free-photo/electrician-builder-work-installation-lamps-height-professional-overalls-with-drill-repair-site_169016-8625.jpg"
imageAlt="Professional electrical and structural installer at work"
mediaAnimation="slide-up"
/>
</div>
<div id="footer" data-section="footer">
<FooterBaseCard
logoText="Mapulana Glass"
columns={[
{
title: "Services", items: [
{
label: "Windows & Doors", href: "#services"},
{
label: "Glass Installation", href: "#services"},
{
label: "Roofing", href: "#services"},
],
},
{
title: "Company", items: [
{
label: "About Us", href: "#about"},
{
label: "Portfolio", href: "#portfolio"},
{
label: "Testimonials", href: "#testimonials"},
],
},
{
title: "Contact", items: [
{
label: "082 628 4120", href: "tel:0826284120"},
{
label: "Tembisa, Johannesburg", href: "#"},
],
},
]}
/>
</div>
</ReactLenis>
</ThemeProvider>
);
}