235 lines
20 KiB
TypeScript
235 lines
20 KiB
TypeScript
"use client";
|
||
|
||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
|
||
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
|
||
import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
|
||
import ProductCardFour from '@/components/sections/product/ProductCardFour';
|
||
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
|
||
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
|
||
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
|
||
import FaqBase from '@/components/sections/faq/FaqBase';
|
||
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
|
||
import FooterSimple from '@/components/sections/footer/FooterSimple';
|
||
import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';
|
||
import { SquareActivity, RefreshCw, Brush, TreeDeciduous, LayoutGrid, Layers, Trophy, CheckCircle, Users } from 'lucide-react';
|
||
|
||
export default function LandingPage() {
|
||
|
||
const assetMap = [
|
||
{"id":"hero-flooring","url":"http://img.b2bpic.net/free-photo/still-life-putting-up-decorative-vinyls_23-2149683466.jpg","alt":"modern home interior wood flooring London"},
|
||
{"id":"service-installation","url":"http://img.b2bpic.net/free-photo/high-angle-tape-measure-wood_23-2148384481.jpg","alt":"professional flooring installation tools"},
|
||
{"id":"service-repair","url":"http://img.b2bpic.net/free-photo/close-up-dancer-s-hand-floor_23-2148004017.jpg","alt":"parquet floor repair wood restoration"},
|
||
{"id":"service-consultation","url":"http://img.b2bpic.net/free-photo/scenery-designers-work_23-2149741823.jpg","alt":"flooring consultant customer discussion"},
|
||
{"id":"service-hardwood","url":"http://img.b2bpic.net/free-photo/minimalist-interior-with-wooden-accents-natural-light_23-2152016397.jpg","alt":"beautiful hardwood floor interior design"},
|
||
{"id":"service-carpet","url":"http://img.b2bpic.net/free-photo/young-beautiful-woman-sitting-home-working-laptop-earphones_1303-20509.jpg","alt":"plush carpet living room comfortable"},
|
||
{"id":"service-vinyl","url":"http://img.b2bpic.net/free-photo/bathtub_1203-3717.jpg","alt":"modern vinyl flooring kitchen"},
|
||
{"id":"product-wood-flooring","url":"http://img.b2bpic.net/free-photo/frame-with-wooden-boards_1162-124.jpg","alt":"samples of hardwood flooring elegant"},
|
||
{"id":"product-laminate-flooring","url":"http://img.b2bpic.net/free-photo/wooden-texture_1194-6226.jpg","alt":"laminate flooring texture modern"},
|
||
{"id":"product-carpet-fitting","url":"http://img.b2bpic.net/free-photo/carpets-market-morocco_23-2148129919.jpg","alt":"luxurious carpet samples texture"},
|
||
{"id":"product-tile-installation","url":"http://img.b2bpic.net/free-photo/abstract-bright-green-square-pixel-tile-mosaic-wall-background-texture_1258-72183.jpg","alt":"ceramic tile samples bathroom"},
|
||
{"id":"product-vinyl-solutions","url":"http://img.b2bpic.net/free-photo/texture-background_1404-73.jpg","alt":"vinyl plank flooring collection"},
|
||
{"id":"product-lvt","url":"http://img.b2bpic.net/free-photo/laptop-near-helmet-blueprints_23-2147785562.jpg","alt":"luxury vinyl tile wood look"},
|
||
{"id":"testimonial-1","url":"http://img.b2bpic.net/free-photo/portrait-tender-young-smiling-woman-feeling-cozy-home-sitting-kitchen-chair-with-smartphone_1258-187159.jpg","alt":"happy woman homeowner smiling portrait"},
|
||
{"id":"testimonial-2","url":"http://img.b2bpic.net/free-photo/woman-taking-photo-influencer-entrance-public-subway_23-2149284411.jpg","alt":"male business owner professional headshot"},
|
||
{"id":"testimonial-3","url":"http://img.b2bpic.net/free-photo/young-man-holding-house-model-orange-t-shirt-looking-happy-front-view_176474-93526.jpg","alt":"young couple happy home renovation"},
|
||
{"id":"testimonial-4","url":"http://img.b2bpic.net/free-photo/smiling-mature-lady-holding-cup-coffee_171337-13685.jpg","alt":"senior woman elegant home smiling"},
|
||
{"id":"testimonial-5","url":"http://img.b2bpic.net/free-photo/portrait-successful-grey-haired-female-ceo-smiling-content-experienced-beautiful-businesswoman-posing-office-room-business-company-appearance-expression-concept_74855-11905.jpg","alt":"man working at office desk smiling"},
|
||
{"id":"testimonial-6","url":"http://img.b2bpic.net/free-photo/beautiful-family-spend-time-bedroom_1157-27594.jpg","alt":"happy family in renovated home"},
|
||
{"id":"logo-1","url":"http://img.b2bpic.net/free-vector/city-stamps-collection-flat-style_23-2147764056.jpg","alt":"modern abstract company logo blue"},
|
||
{"id":"logo-2","url":"http://img.b2bpic.net/free-vector/hexagon-play-button-logo-ideas-inspiration-logo-design-template-vector-illustration-isolated-white-background_384344-2065.jpg","alt":"geometric shapes firm logo green"},
|
||
{"id":"logo-3","url":"http://img.b2bpic.net/free-photo/isolated-white-house-silhouette-minimal-black-landscape_1194-641505.jpg","alt":"sleek design studio logo grey"},
|
||
{"id":"logo-4","url":"http://img.b2bpic.net/free-vector/pack-blue-orange-logotypes-geometric-style_23-2147595809.jpg","alt":"dynamic tech solutions logo red"},
|
||
{"id":"logo-5","url":"https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=t32ysk","alt":"elegant property group logo gold"},
|
||
{"id":"logo-6","url":"http://img.b2bpic.net/free-vector/school-building-logo-design-vector_474888-2134.jpg","alt":"abstract construction company logo"},
|
||
{"id":"logo-7","url":"http://img.b2bpic.net/free-photo/eco-friendly-recycling-concept_23-2148737657.jpg","alt":"sustainable business logo green leaf"},
|
||
{"id":"contact-office-interior","url":"http://img.b2bpic.net/free-photo/urban-scene-skyline-morning-view-metropolis-concept_53876-23186.jpg","alt":"modern office interior reception desk"}
|
||
];
|
||
|
||
const getAssetUrl = (id) => assetMap.find(asset => asset.id === id)?.url || 'https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg';
|
||
const getAssetAlt = (id, defaultAlt) => assetMap.find(asset => asset.id === id)?.alt || defaultAlt;
|
||
|
||
return (
|
||
<ThemeProvider
|
||
defaultButtonVariant={"hover-bubble"}
|
||
defaultTextAnimation={"background-highlight"}
|
||
borderRadius={"soft"}
|
||
contentWidth={"small"}
|
||
sizing={"mediumLargeSizeLargeTitles"}
|
||
background={"circleGradient"}
|
||
cardStyle={"gradient-bordered"}
|
||
primaryButtonStyle={"diagonal-gradient"}
|
||
secondaryButtonStyle={"layered"}
|
||
headingFontWeight={"bold"}
|
||
>
|
||
<div id="nav" data-section="nav">
|
||
<NavbarLayoutFloatingInline
|
||
brandName={"London Flooring Experts"}
|
||
navItems={[
|
||
{ name: "Home", id: "#hero" },
|
||
{ name: "Services", id: "#services" },
|
||
{ name: "Our Work", id: "#products" },
|
||
{ name: "Why Choose Us", id: "#metrics" },
|
||
{ name: "Testimonials", id: "#testimonials" },
|
||
{ name: "FAQ", id: "#faq" },
|
||
{ name: "Contact", id: "#contact" }
|
||
]}
|
||
button={{
|
||
text: "Get Your Free Quote Today", href: "#contact"
|
||
}}
|
||
animateOnLoad={true}
|
||
/>
|
||
</div>
|
||
<div id="hero" data-section="hero">
|
||
<HeroOverlay
|
||
title={"London Flooring Experts You Can Trust"}
|
||
description={"From installation to restoration, we deliver premium flooring solutions for homes and businesses across London. Transparent pricing, expert craftsmanship, guaranteed satisfaction."}
|
||
buttons={[
|
||
{ text: "Get Your Free Quote Today", href: "#contact" }
|
||
]}
|
||
imageSrc={getAssetUrl("hero-flooring")}
|
||
imageAlt={getAssetAlt("hero-flooring", "Modern home interior with newly installed flooring in London")}
|
||
showBlur={true}
|
||
textPosition={"bottom"}
|
||
/>
|
||
</div>
|
||
<div id="about" data-section="about">
|
||
<TextSplitAbout
|
||
title={"Your Trusted Local Flooring Partner"}
|
||
description={[
|
||
"At London Flooring Pros, we've built our reputation on a foundation of trust, quality, and unparalleled local expertise. For over two decades, we've served homeowners, property managers, and businesses across the capital, transforming spaces with beautiful, durable flooring solutions.", "Our commitment goes beyond installation. We believe in transparent communication, meticulous craftsmanship, and a customer-first approach that ensures every project, big or small, is completed to the highest standards. Experience the difference that true dedication makes."
|
||
]}
|
||
useInvertedBackground={true}
|
||
/>
|
||
</div>
|
||
<div id="services" data-section="services">
|
||
<FeatureHoverPattern
|
||
title={"Comprehensive Flooring Services for London"}
|
||
description={"Whether you're refreshing a single room or outfitting an entire commercial property, our expert team offers a full spectrum of services tailored to your needs."}
|
||
features={[
|
||
{ icon: SquareActivity, title: "Expert Installation", description: "Flawless fitting of all flooring types, ensuring durability and a perfect finish every time." },
|
||
{ icon: RefreshCw, title: "Repair & Restoration", description: "Bring your worn or damaged floors back to life with our specialist repair and restoration services." },
|
||
{ icon: Brush, title: "Consultation & Design", description: "Personalized advice and design guidance to help you choose the ideal flooring for your space." },
|
||
{ icon: TreeDeciduous, title: "Hardwood Flooring", description: "Timeless elegance and lasting quality with our premium hardwood installation and finishing." },
|
||
{ icon: LayoutGrid, title: "Carpet & Rugs", description: "From plush residential carpets to hard-wearing commercial options, we've got you covered." },
|
||
{ icon: Layers, title: "Vinyl & Laminate Solutions", description: "Durable, versatile, and stylish choices for both modern and traditional interiors." }
|
||
]}
|
||
animationType={"slide-up"}
|
||
textboxLayout={"default"}
|
||
useInvertedBackground={false}
|
||
/>
|
||
</div>
|
||
<div id="products" data-section="products">
|
||
<ProductCardFour
|
||
title={"Explore Our Premium Flooring Options"}
|
||
description={"Discover the perfect flooring to elevate your space. We source high-quality materials and offer a diverse range of styles to suit every aesthetic and budget."}
|
||
products={[
|
||
{ id: "1", name: "Solid Wood Flooring", price: "From £45/sqm", variant: "Oak, Walnut, Maple", imageSrc: getAssetUrl("product-wood-flooring"), imageAlt: getAssetAlt("product-wood-flooring", "Samples of solid wood flooring") },
|
||
{ id: "2", name: "Laminate Flooring", price: "From £15/sqm", variant: "Various Finishes", imageSrc: getAssetUrl("product-laminate-flooring"), imageAlt: getAssetAlt("product-laminate-flooring", "Laminate flooring texture") },
|
||
{ id: "3", name: "Luxury Carpet Fitting", price: "From £20/sqm", variant: "Wool, Synthetic, Blends", imageSrc: getAssetUrl("product-carpet-fitting"), imageAlt: getAssetAlt("product-carpet-fitting", "Luxurious carpet samples") },
|
||
{ id: "4", name: "Ceramic & Porcelain Tiles", price: "From £25/sqm", variant: "Kitchen, Bathroom, Hallway", imageSrc: getAssetUrl("product-tile-installation"), imageAlt: getAssetAlt("product-tile-installation", "Ceramic and porcelain tile samples") },
|
||
{ id: "5", name: "Vinyl Flooring Solutions", price: "From £18/sqm", variant: "Sheet, Plank, Tile", imageSrc: getAssetUrl("product-vinyl-solutions"), imageAlt: getAssetAlt("product-vinyl-solutions", "Vinyl plank flooring collection") },
|
||
{ id: "6", name: "Luxury Vinyl Tile (LVT)", price: "From £30/sqm", variant: "Wood & Stone Effect", imageSrc: getAssetUrl("product-lvt"), imageAlt: getAssetAlt("product-lvt", "Luxury Vinyl Tile samples") }
|
||
]}
|
||
gridVariant={"three-columns-all-equal-width"}
|
||
animationType={"slide-up"}
|
||
textboxLayout={"default"}
|
||
useInvertedBackground={true}
|
||
/>
|
||
</div>
|
||
<div id="metrics" data-section="metrics">
|
||
<MetricCardOne
|
||
title={"Experience the Difference: Our Commitment to Excellence"}
|
||
description={"We're proud of the measurable impact we've made on properties across London, delivering satisfaction through hard work and a dedication to superior results."}
|
||
metrics={[
|
||
{ id: "m1", value: "20+", title: "Years in Business", description: "Decades of trusted service across London.", icon: Trophy },
|
||
{ id: "m2", value: "5000+", title: "Projects Completed", description: "Transforming homes and businesses.", icon: CheckCircle },
|
||
{ id: "m3", value: "98%", title: "Client Satisfaction", description: "Our dedication to happy customers.", icon: Users }
|
||
]}
|
||
gridVariant={"uniform-all-items-equal"}
|
||
animationType={"slide-up"}
|
||
textboxLayout={"default"}
|
||
useInvertedBackground={false}
|
||
/>
|
||
</div>
|
||
<div id="testimonials" data-section="testimonials">
|
||
<TestimonialCardThirteen
|
||
title={"What Our London Clients Say"}
|
||
description={"Don't just take our word for it – hear directly from the homeowners and businesses across London who trust us with their flooring projects."}
|
||
testimonials={[
|
||
{ id: "t1", name: "Sarah J.", handle: "@HomeownerSW19", testimonial: "London Flooring Experts transformed our living room with beautiful new hardwood. The team was professional, efficient, and the finish is simply stunning. Highly recommend!", rating: 5, imageSrc: getAssetUrl("testimonial-1"), imageAlt: getAssetAlt("testimonial-1", "Happy homeowner Sarah J.") },
|
||
{ id: "t2", name: "Mark R.", handle: "@PropertyMgmtE1", testimonial: "As a property manager in East London, I need reliable contractors. London Flooring Pros always deliver on time and within budget. Their commercial work is top-notch.", rating: 5, imageSrc: getAssetUrl("testimonial-2"), imageAlt: getAssetAlt("testimonial-2", "Property Manager Mark R.") },
|
||
{ id: "t3", name: "Emily C.", handle: "@RenovateNW3", testimonial: "We were so impressed with the attention to detail. Our old parquet floor was restored beautifully, it looks brand new! Thank you to the whole team.", rating: 5, imageSrc: getAssetUrl("testimonial-3"), imageAlt: getAssetAlt("testimonial-3", "Home renovator Emily C.") },
|
||
{ id: "t4", name: "David K.", handle: "@OfficeFitoutsSE1", testimonial: "The new office carpet was installed seamlessly over a weekend, minimizing disruption. Excellent communication and a perfectly laid carpet. Fantastic service!", rating: 5, imageSrc: getAssetUrl("testimonial-4"), imageAlt: getAssetAlt("testimonial-4", "Office fitout client David K.") },
|
||
{ id: "t5", name: "Jessica L.", handle: "@LondonHomesW2", testimonial: "From initial consultation to final installation, the experience was smooth and stress-free. Our new vinyl flooring is perfect for our busy family home.", rating: 5, imageSrc: getAssetUrl("testimonial-5"), imageAlt: getAssetAlt("testimonial-5", "London homeowner Jessica L.") },
|
||
{ id: "t6", name: "Tom H.", handle: "@RestaurantOwnerEC1", testimonial: "Had my restaurant kitchen floor tiled by this team. Quick, clean, and durable results. It stands up to heavy traffic brilliantly. Couldn't be happier.", rating: 5, imageSrc: getAssetUrl("testimonial-6"), imageAlt: getAssetAlt("testimonial-6", "Restaurant owner Tom H.") }
|
||
]}
|
||
showRating={true}
|
||
animationType={"slide-up"}
|
||
textboxLayout={"default"}
|
||
useInvertedBackground={true}
|
||
/>
|
||
</div>
|
||
<div id="partners" data-section="partners">
|
||
<SocialProofOne
|
||
title={"Trusted by Leading London Businesses & Property Managers"}
|
||
description={"Our expertise extends to commercial projects, partnering with diverse organizations to provide reliable, high-quality flooring solutions."}
|
||
names={[
|
||
"London Property Group", "City Developments PLC", "Thameside Homes", "Regal Estates", "Urban Innovations Ltd.", "Metropolitan Offices", "The Kensington Collection"
|
||
]}
|
||
textboxLayout={"default"}
|
||
useInvertedBackground={false}
|
||
/>
|
||
</div>
|
||
<div id="faq" data-section="faq">
|
||
<FaqBase
|
||
title={"Frequently Asked Questions"}
|
||
description={"Find quick answers to common questions about our services, pricing, process, and what to expect when you choose us for your flooring project."}
|
||
faqs={[
|
||
{ id: "faq1", title: "How do I get a free quote?", content: "Simply fill out our contact form or give us a call! We'll arrange a convenient time for a site visit to assess your needs and provide a detailed, no-obligation estimate." },
|
||
{ id: "faq2", title: "What types of flooring do you specialize in?", content: "We specialize in a wide range of flooring, including hardwood, laminate, carpet, vinyl, luxury vinyl tile (LVT), and ceramic & porcelain tiles. Our experts can advise on the best option for your specific requirements." },
|
||
{ id: "faq3", title: "Do you offer a warranty on your installations?", content: "Yes, we stand by the quality of our work. All our installations come with a comprehensive warranty for your peace of mind. Specifics will be provided with your quote." }
|
||
]}
|
||
faqsAnimation={"slide-up"}
|
||
textboxLayout={"default"}
|
||
useInvertedBackground={true}
|
||
/>
|
||
</div>
|
||
<div id="contact" data-section="contact">
|
||
<ContactSplitForm
|
||
title={"Get Your Free, No-Obligation Quote Today"}
|
||
description={"Ready to transform your floors? Fill out the form below, and one of our London flooring specialists will get back to you promptly to discuss your project and provide a detailed estimate."}
|
||
inputs={[
|
||
{ name: "name", type: "text", placeholder: "Your Name", required: true },
|
||
{ name: "email", type: "email", placeholder: "Your Email", required: true },
|
||
{ name: "phone", type: "tel", placeholder: "Your Phone Number" }
|
||
]}
|
||
multiSelect={{
|
||
name: "serviceType", label: "I'm interested in...", options: ["New Installation", "Repair & Restoration", "Consultation", "Commercial Project", "Other"]
|
||
}}
|
||
textarea={{
|
||
name: "message", placeholder: "Tell us about your flooring project...", rows: 4
|
||
}}
|
||
useInvertedBackground={false}
|
||
imageSrc={getAssetUrl("contact-office-interior")}
|
||
imageAlt={getAssetAlt("contact-office-interior", "Modern office interior with clean flooring")}
|
||
mediaAnimation={"slide-up"}
|
||
mediaPosition={"right"}
|
||
buttonText={"Request Quote"}
|
||
/>
|
||
</div>
|
||
<div id="footer" data-section="footer">
|
||
<FooterSimple
|
||
columns={[
|
||
{ title: "Services", items: [{ label: "Home", href: "#hero" }, { label: "Our Services", href: "#services" }, { label: "Flooring Options", href: "#products" }, { label: "Testimonials", href: "#testimonials" }] },
|
||
{ title: "Company", items: [{ label: "About Us", href: "#about" }, { label: "FAQ", href: "#faq" }, { label: "Contact Us", href: "#contact" }] },
|
||
{ title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] }
|
||
]}
|
||
bottomLeftText={"© 2024 London Flooring Experts. All rights reserved."}
|
||
bottomRightText={"Proudly serving London"}
|
||
/>
|
||
</div>
|
||
</ThemeProvider>
|
||
);
|
||
}
|