Update src/app/page.tsx

This commit is contained in:
2026-04-28 20:14:03 +00:00
parent 6a22aae4b9
commit 649e7b4941

View File

@@ -12,7 +12,7 @@ import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatin
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import SplitAbout from '@/components/sections/about/SplitAbout';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import { Award, Building, Home, LayoutDashboard, Star, ThumbsUp } from "lucide-react";
import { Award, Building, Home, LayoutDashboard, Star, ThumbsUp, Hammer, PaintBucket, Cpu } from "lucide-react";
export default function LandingPage() {
return (
@@ -20,427 +20,192 @@ export default function LandingPage() {
defaultButtonVariant="icon-arrow"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="medium"
sizing="medium"
background="circleGradient"
cardStyle="glass-elevated"
primaryButtonStyle="gradient"
secondaryButtonStyle="glass"
headingFontWeight="normal"
>
<ReactLenis root>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{
name: "Home",
id: "#hero",
},
{
name: "About",
id: "#about",
},
{
name: "Features",
id: "#features",
},
{
name: "Contact",
id: "#contact",
},
]}
brandName="UK Home Redesign"
/>
</div>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingOverlay
navItems={[
{ name: "Home", id: "#hero" },
{ name: "About", id: "#about" },
{ name: "Features", id: "#features" },
{ name: "Contact", id: "#contact" },
]}
brandName="UK Home Redesign"
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardGallery
background={{
variant: "gradient-bars",
}}
title="Bringing Your Dream Home to Life."
description="Professional UK-based home redesign and construction services. Let's transform your living space into something extraordinary today."
buttons={[
{
text: "Book an Appointment",
href: "#contact",
},
]}
mediaItems={[
{
imageSrc: "http://img.b2bpic.net/free-photo/woman-using-laptop-minimal-decorated-room_23-2150407638.jpg?_wi=1",
imageAlt: "luxury modern home interior renovation",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/horizontal-shot-construction-site-with-scaffolding-clear-blue-sky_181624-27944.jpg?_wi=1",
imageAlt: "architectural home renovation project uk",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-materials-working-plan_23-2148384550.jpg?_wi=1",
imageAlt: "home exterior modern renovation construction",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/woman-using-laptop-minimal-decorated-room_23-2150407607.jpg",
imageAlt: "Woman using laptop in minimal decorated room",
},
{
imageSrc: "http://img.b2bpic.net/free-photo/woman-using-laptop-minimal-decorated-room_23-2150407608.jpg",
imageAlt: "Woman using laptop in minimal decorated room",
},
]}
mediaAnimation="slide-up"
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardGallery
background={{ variant: "gradient-bars" }}
title="Bringing Your Dream Home to Life."
description="Professional UK-based home redesign and construction services. Let's transform your living space into something extraordinary today."
buttons={[{ text: "Book an Appointment", href: "#contact" }]}
mediaItems={[
{ imageSrc: "http://img.b2bpic.net/free-photo/woman-using-laptop-minimal-decorated-room_23-2150407638.jpg", imageAlt: "luxury modern home interior renovation" },
{ imageSrc: "http://img.b2bpic.net/free-photo/horizontal-shot-construction-site-with-scaffolding-clear-blue-sky_181624-27944.jpg", imageAlt: "architectural home renovation project uk" },
{ imageSrc: "http://img.b2bpic.net/free-photo/high-angle-materials-working-plan_23-2148384550.jpg", imageAlt: "home exterior modern renovation construction" },
{ imageSrc: "http://img.b2bpic.net/free-photo/woman-using-laptop-minimal-decorated-room_23-2150407607.jpg", imageAlt: "Woman using laptop in minimal decorated room" },
{ imageSrc: "http://img.b2bpic.net/free-photo/woman-using-laptop-minimal-decorated-room_23-2150407608.jpg", imageAlt: "Woman using laptop in minimal decorated room" },
]}
mediaAnimation="slide-up"
/>
</div>
<div id="about" data-section="about">
<SplitAbout
textboxLayout="split"
useInvertedBackground={true}
title="Excellence in Every Detail."
description="With years of experience across the UK, we specialize in high-quality home renovations and bespoke redesigns that meet your unique vision and lifestyle needs."
bulletPoints={[
{
title: "Quality Craftsmanship",
description: "We use only premium materials and skilled tradespeople for every project.",
},
{
title: "Bespoke Design",
description: "Tailored solutions designed to fit your unique style and home architecture.",
},
{
title: "Transparent Process",
description: "Clear communication and project updates from start to finish.",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/close-up-young-business-team-working_23-2149153848.jpg?_wi=1"
imageAlt="construction professional home redesign uk"
mediaAnimation="slide-up"
/>
</div>
<div id="about" data-section="about">
<SplitAbout
textboxLayout="split"
useInvertedBackground={true}
title="Excellence in Every Detail."
description="With years of experience across the UK, we specialize in high-quality home renovations and bespoke redesigns that meet your unique vision and lifestyle needs."
bulletPoints={[
{ title: "Quality Craftsmanship", description: "We use only premium materials and skilled tradespeople for every project." },
{ title: "Bespoke Design", description: "Tailored solutions designed to fit your unique style and home architecture." },
{ title: "Transparent Process", description: "Clear communication and project updates from start to finish." },
]}
imageSrc="http://img.b2bpic.net/free-photo/close-up-young-business-team-working_23-2149153848.jpg"
imageAlt="construction professional home redesign uk"
mediaAnimation="slide-up"
/>
</div>
<div id="features" data-section="features">
<FeatureCardTen
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
features={[
{
title: "Interior Remodelling",
description: "Full-scale interior transformations including wall removals and space planning.",
media: {
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-people-working-as-team_23-2149366653.jpg",
imageAlt: "modern home renovation icon",
},
items: [
{
icon: Hammer,
text: "Structural work",
},
{
icon: PaintBucket,
text: "Finishing touches",
},
],
reverse: false,
imageSrc: "http://img.b2bpic.net/free-photo/woman-using-laptop-minimal-decorated-room_23-2150407638.jpg?_wi=2",
imageAlt: "modern home renovation icon",
},
{
title: "Extensions & Conversions",
description: "Expand your living footprint with seamless structural extensions.",
media: {
imageSrc: "http://img.b2bpic.net/free-photo/house-sign-amidst-drafting-tools_23-2147785573.jpg",
imageAlt: "architectural renovation blueprints house",
},
items: [
{
icon: LayoutDashboard,
text: "Planning permits",
},
{
icon: Building,
text: "Structural design",
},
],
reverse: true,
imageSrc: "http://img.b2bpic.net/free-photo/horizontal-shot-construction-site-with-scaffolding-clear-blue-sky_181624-27944.jpg?_wi=2",
imageAlt: "modern home renovation icon",
},
{
title: "Bespoke Joinery",
description: "Custom cabinetry and woodworking to elevate your home aesthetics.",
media: {
imageSrc: "http://img.b2bpic.net/free-photo/diverse-team-working-storehouse-inventory_482257-108883.jpg",
imageAlt: "custom home design renovation",
},
items: [
{
icon: Cpu,
text: "Precision cutting",
},
{
icon: Star,
text: "Custom finishes",
},
],
reverse: false,
imageSrc: "http://img.b2bpic.net/free-photo/high-angle-materials-working-plan_23-2148384550.jpg?_wi=2",
imageAlt: "modern home renovation icon",
},
]}
title="Services You Can Rely On"
description="We handle every aspect of home improvement with precision and dedication."
/>
</div>
<div id="features" data-section="features">
<FeatureCardTen
animationType="slide-up"
textboxLayout="default"
useInvertedBackground={false}
title="Services You Can Rely On"
description="We handle every aspect of home improvement with precision and dedication."
features={[
{
title: "Interior Remodelling", description: "Full-scale interior transformations including wall removals and space planning.", media: { imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-people-working-as-team_23-2149366653.jpg", imageAlt: "modern home renovation icon" },
items: [
{ icon: Hammer, text: "Structural work" },
{ icon: PaintBucket, text: "Finishing touches" },
],
reverse: false
},
{
title: "Extensions & Conversions", description: "Expand your living footprint with seamless structural extensions.", media: { imageSrc: "http://img.b2bpic.net/free-photo/house-sign-amidst-drafting-tools_23-2147785573.jpg", imageAlt: "architectural renovation blueprints house" },
items: [
{ icon: LayoutDashboard, text: "Planning permits" },
{ icon: Building, text: "Structural design" },
],
reverse: true
},
{
title: "Bespoke Joinery", description: "Custom cabinetry and woodworking to elevate your home aesthetics.", media: { imageSrc: "http://img.b2bpic.net/free-photo/diverse-team-working-storehouse-inventory_482257-108883.jpg", imageAlt: "custom home design renovation" },
items: [
{ icon: Cpu, text: "Precision cutting" },
{ icon: Star, text: "Custom finishes" },
],
reverse: false
},
]}
/>
</div>
<div id="products" data-section="products">
<ProductCardFour
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={true}
products={[
{
id: "1",
name: "Kitchen Redesign",
price: "Contact for quote",
variant: "Premium",
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-kitchen-interior-design_23-2150976527.jpg",
imageAlt: "modern luxury kitchen home renovation",
},
{
id: "2",
name: "Bathroom Suite",
price: "Contact for quote",
variant: "Standard",
imageSrc: "http://img.b2bpic.net/free-photo/modern-bathroom-with-bathtub-double-sink-vanity-smart-home-technology_9975-33078.jpg",
imageAlt: "modern bathroom renovation home remodel",
},
{
id: "3",
name: "Living Room Refresh",
price: "Contact for quote",
variant: "Custom",
imageSrc: "http://img.b2bpic.net/free-photo/woman-doing-daily-activities-minimal-decorated-room_23-2150407642.jpg",
imageAlt: "living room interior design renovation",
},
{
id: "4",
name: "Bedroom Transformation",
price: "Contact for quote",
variant: "Standard",
imageSrc: "http://img.b2bpic.net/free-photo/aged-smiling-woman-man-with-pillows-having-fun-bed_23-2148033689.jpg",
imageAlt: "home bedroom interior design renovation",
},
{
id: "5",
name: "Home Office Build",
price: "Contact for quote",
variant: "Custom",
imageSrc: "http://img.b2bpic.net/free-photo/tiler-working-renovation-apartment_23-2149278558.jpg",
imageAlt: "home office interior redesign construction",
},
{
id: "6",
name: "Garden Extension",
price: "Contact for quote",
variant: "Premium",
imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-using-laptop-outdoors_23-2150747666.jpg",
imageAlt: "home extension project building construction",
},
]}
title="Transform Every Room"
description="Explore our specialized redesign services for every part of your home."
/>
</div>
<div id="products" data-section="products">
<ProductCardFour
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={true}
title="Transform Every Room"
description="Explore our specialized redesign services for every part of your home."
products={[
{ id: "1", name: "Kitchen Redesign", price: "Contact for quote", variant: "Premium", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-kitchen-interior-design_23-2150976527.jpg", imageAlt: "modern luxury kitchen home renovation" },
{ id: "2", name: "Bathroom Suite", price: "Contact for quote", variant: "Standard", imageSrc: "http://img.b2bpic.net/free-photo/modern-bathroom-with-bathtub-double-sink-vanity-smart-home-technology_9975-33078.jpg", imageAlt: "modern bathroom renovation home remodel" },
{ id: "3", name: "Living Room Refresh", price: "Contact for quote", variant: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/woman-doing-daily-activities-minimal-decorated-room_23-2150407642.jpg", imageAlt: "living room interior design renovation" },
{ id: "4", name: "Bedroom Transformation", price: "Contact for quote", variant: "Standard", imageSrc: "http://img.b2bpic.net/free-photo/aged-smiling-woman-man-with-pillows-having-fun-bed_23-2148033689.jpg", imageAlt: "home bedroom interior design renovation" },
{ id: "5", name: "Home Office Build", price: "Contact for quote", variant: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/tiler-working-renovation-apartment_23-2149278558.jpg", imageAlt: "home office interior redesign construction" },
{ id: "6", name: "Garden Extension", price: "Contact for quote", variant: "Premium", imageSrc: "http://img.b2bpic.net/free-photo/full-shot-man-using-laptop-outdoors_23-2150747666.jpg", imageAlt: "home extension project building construction" },
]}
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
metrics={[
{
id: "m1",
value: "150+",
title: "Homes Transformed",
description: "Projects successfully completed.",
icon: Home,
},
{
id: "m2",
value: "98%",
title: "Client Satisfaction",
description: "Consistently happy customers.",
icon: ThumbsUp,
},
{
id: "m3",
value: "10+",
title: "Years Experience",
description: "Expertise in the industry.",
icon: Award,
},
]}
title="Built on Proven Results"
description="We are proud of our commitment to excellence and high-quality home building across the UK."
/>
</div>
<div id="metrics" data-section="metrics">
<MetricCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
useInvertedBackground={false}
title="Built on Proven Results"
description="We are proud of our commitment to excellence and high-quality home building across the UK."
metrics={[
{ id: "m1", value: "150+", title: "Homes Transformed", description: "Projects successfully completed.", icon: Home },
{ id: "m2", value: "98%", title: "Client Satisfaction", description: "Consistently happy customers.", icon: ThumbsUp },
{ id: "m3", value: "10+", title: "Years Experience", description: "Expertise in the industry.", icon: Award },
]}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={true}
testimonials={[
{
id: "t1",
name: "Sarah Miller",
role: "Homeowner",
company: "London",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/couple-handling-carpet-together-their-new-home_23-2149086838.jpg",
imageAlt: "happy client residential renovation home",
},
{
id: "t2",
name: "James & Emma",
role: "Homeowners",
company: "Manchester",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-working-as-plumber_23-2150746309.jpg",
imageAlt: "happy customer bathroom renovation project",
},
{
id: "t3",
name: "David Thorne",
role: "Client",
company: "Birmingham",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/carpenter-working-house_329181-9435.jpg",
imageAlt: "client home improvement renovation success",
},
{
id: "t4",
name: "Linda Wright",
role: "Homeowner",
company: "Leeds",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/colleagues-work-having-lunch_23-2148894055.jpg",
imageAlt: "happy residential project client home",
},
{
id: "t5",
name: "Tom Baker",
role: "Homeowner",
company: "Bristol",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/creative-tailor-working-workshop_23-2148970729.jpg",
imageAlt: "happy house extension project client",
},
]}
title="Trusted by Homeowners"
description="See what our clients in the UK have to say about their redesigned homes."
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardOne
animationType="slide-up"
textboxLayout="default"
gridVariant="three-columns-all-equal-width"
useInvertedBackground={true}
title="Trusted by Homeowners"
description="See what our clients in the UK have to say about their redesigned homes."
testimonials={[
{ id: "t1", name: "Sarah Miller", role: "Homeowner", company: "London", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/couple-handling-carpet-together-their-new-home_23-2149086838.jpg", imageAlt: "happy client residential renovation home" },
{ id: "t2", name: "James & Emma", role: "Homeowners", company: "Manchester", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-working-as-plumber_23-2150746309.jpg", imageAlt: "happy customer bathroom renovation project" },
{ id: "t3", name: "David Thorne", role: "Client", company: "Birmingham", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/carpenter-working-house_329181-9435.jpg", imageAlt: "client home improvement renovation success" },
{ id: "t4", name: "Linda Wright", role: "Homeowner", company: "Leeds", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/colleagues-work-having-lunch_23-2148894055.jpg", imageAlt: "happy residential project client home" },
{ id: "t5", name: "Tom Baker", role: "Homeowner", company: "Bristol", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/creative-tailor-working-workshop_23-2148970729.jpg", imageAlt: "happy house extension project client" },
]}
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitText
useInvertedBackground={false}
faqs={[
{
id: "f1",
title: "How do I book an appointment?",
content: "Simply call us at 07904868440 or fill out our contact form.",
},
{
id: "f2",
title: "Where do you operate?",
content: "We proudly serve homeowners across the entire UK.",
},
{
id: "f3",
title: "Are quotes free?",
content: "Yes, we offer complimentary consultation and quotes for all our services.",
},
]}
sideTitle="Frequently Asked Questions"
sideDescription="Everything you need to know about our home redesign services."
faqsAnimation="slide-up"
/>
</div>
<div id="faq" data-section="faq">
<FaqSplitText
useInvertedBackground={false}
sideTitle="Frequently Asked Questions"
sideDescription="Everything you need to know about our home redesign services."
faqsAnimation="slide-up"
faqs={[
{ id: "f1", title: "How do I book an appointment?", content: "Simply call us at 07904868440 or fill out our contact form." },
{ id: "f2", title: "Where do you operate?", content: "We proudly serve homeowners across the entire UK." },
{ id: "f3", title: "Are quotes free?", content: "Yes, we offer complimentary consultation and quotes for all our services." },
]}
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
useInvertedBackground={true}
title="Start Your Home Transformation"
description="Call us at 07904868440 or send us a message below to book your appointment."
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",
required: true,
},
]}
textarea={{
name: "message",
placeholder: "Tell us about your home redesign ideas...",
rows: 4,
required: true,
}}
imageSrc="http://img.b2bpic.net/free-photo/close-up-young-business-team-working_23-2149153848.jpg?_wi=2"
imageAlt="construction professional home redesign uk"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
useInvertedBackground={true}
title="Start Your Home Transformation"
description="Call us at 07904868440 or send us a message below to book your appointment."
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", required: true },
]}
textarea={{ name: "message", placeholder: "Tell us about your home redesign ideas...", rows: 4, required: true }}
imageSrc="http://img.b2bpic.net/free-photo/close-up-young-business-team-working_23-2149153848.jpg"
imageAlt="construction professional home redesign uk"
/>
</div>
<div id="footer" data-section="footer">
<FooterMedia
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ofn33s"
logoText="UK Home Redesign"
columns={[
{
title: "Quick Links",
items: [
{
label: "About Us",
href: "#about",
},
{
label: "Services",
href: "#features",
},
{
label: "Contact",
href: "#contact",
},
],
},
{
title: "Support",
items: [
{
label: "Privacy Policy",
href: "#",
},
{
label: "FAQs",
href: "#faq",
},
],
},
]}
copyrightText="© 2025 | UK Home Redesign Services"
imageAlt="construction company logo residential"
/>
</div>
<div id="footer" data-section="footer">
<FooterMedia
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=ofn33s"
logoText="UK Home Redesign"
columns={[
{ title: "Quick Links", items: [{ label: "About Us", href: "#about" }, { label: "Services", href: "#features" }, { label: "Contact", href: "#contact" }] },
{ title: "Support", items: [{ label: "Privacy Policy", href: "#" }, { label: "FAQs", href: "#faq" }] },
]}
copyrightText="© 2025 | UK Home Redesign Services"
imageAlt="construction company logo residential"
/>
</div>
</ReactLenis>
</ThemeProvider>
);