Merge version_1 into main #3
436
src/app/page.tsx
436
src/app/page.tsx
@@ -29,270 +29,196 @@ export default function LandingPage() {
|
||||
headingFontWeight="light"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{
|
||||
name: "Home", id: "hero"},
|
||||
{
|
||||
name: "Services", id: "services"},
|
||||
{
|
||||
name: "Portfolio", id: "portfolio"},
|
||||
{
|
||||
name: "Contact", id: "contact"},
|
||||
]}
|
||||
brandName="HT Floors"
|
||||
button={{
|
||||
text: "Get a Quote", href: "#contact"}}
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
navItems={[
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "Portfolio", id: "portfolio" },
|
||||
{ name: "Contact", id: "contact" }
|
||||
]}
|
||||
brandName="HT Floors"
|
||||
button={{ text: "Get a Quote", href: "#contact" }}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardRotatedCarousel
|
||||
background={{
|
||||
variant: "rotated-rays-static"}}
|
||||
title="Transform Your Home with Precision"
|
||||
description="Expert flooring installation and full-service remodeling to bring your vision to life with quality craftsmanship."
|
||||
buttons={[
|
||||
{
|
||||
text: "Start Your Project", href: "#contact"},
|
||||
]}
|
||||
carouselItems={[
|
||||
{
|
||||
id: "h1", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-interior-shot-modern-house-with-white-relaxing-walls-furniture-technology_181624-2077.jpg"},
|
||||
{
|
||||
id: "h2", imageSrc: "http://img.b2bpic.net/free-photo/young-worker-lining-floor-with-laminated-flooring-boards_231208-4214.jpg"},
|
||||
{
|
||||
id: "h3", imageSrc: "http://img.b2bpic.net/free-photo/attic-minimal-kitchen-blue-fronts-bright-marble_169016-69269.jpg"},
|
||||
{
|
||||
id: "h4", imageSrc: "http://img.b2bpic.net/free-photo/worker-processing-floor-with-laminated-flooring-boards_231208-4211.jpg"},
|
||||
{
|
||||
id: "h5", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-girl-with-smartphone-sits-home-does-homework-watches-smth-mobile-phone-app_1258-199920.jpg"},
|
||||
{
|
||||
id: "h6", imageSrc: "http://img.b2bpic.net/free-photo/top-view-man-tiling-floor_23-2149344001.jpg"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardRotatedCarousel
|
||||
background={{ variant: "rotated-rays-static" }}
|
||||
title="Transform Your Home with Precision"
|
||||
description="Expert flooring installation and full-service remodeling to bring your vision to life with quality craftsmanship."
|
||||
buttons={[{ text: "Start Your Project", href: "#contact" }]}
|
||||
carouselItems={[
|
||||
{ id: "h1", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-interior-shot-modern-house-with-white-relaxing-walls-furniture-technology_181624-2077.jpg" },
|
||||
{ id: "h2", imageSrc: "http://img.b2bpic.net/free-photo/young-worker-lining-floor-with-laminated-flooring-boards_231208-4214.jpg" },
|
||||
{ id: "h3", imageSrc: "http://img.b2bpic.net/free-photo/attic-minimal-kitchen-blue-fronts-bright-marble_169016-69269.jpg" },
|
||||
{ id: "h4", imageSrc: "http://img.b2bpic.net/free-photo/worker-processing-floor-with-laminated-flooring-boards_231208-4211.jpg" },
|
||||
{ id: "h5", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-girl-with-smartphone-sits-home-does-homework-watches-smth-mobile-phone-app_1258-199920.jpg" },
|
||||
{ id: "h6", imageSrc: "http://img.b2bpic.net/free-photo/top-view-man-tiling-floor_23-2149344001.jpg" }
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTen
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Hardwood Flooring", description: "Beautiful, durable hardwood solutions installed with care.", items: [
|
||||
{
|
||||
icon: Hammer,
|
||||
text: "Solid Wood"},
|
||||
{
|
||||
icon: Ruler,
|
||||
text: "Engineered Wood"},
|
||||
{
|
||||
icon: Check,
|
||||
text: "Refinishing"},
|
||||
],
|
||||
reverse: false,
|
||||
media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-white-minimal-kitchen-with-wood-decoration_105762-2211.jpg", imageAlt: "luxury hardwood floor renovation interior"},
|
||||
},
|
||||
{
|
||||
title: "Full Remodels", description: "Complete transformation of your kitchen, bathroom, or living area.", items: [
|
||||
{
|
||||
icon: Home,
|
||||
text: "Kitchens"},
|
||||
{
|
||||
icon: Droplets,
|
||||
text: "Bathrooms"},
|
||||
{
|
||||
icon: Zap,
|
||||
text: "Full Layouts"},
|
||||
],
|
||||
reverse: true,
|
||||
media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/tired-young-couple-are-sitting-floor-with-paint-brush-bucket-while-doing-repair-home_496169-751.jpg", imageAlt: "luxury hardwood floor renovation interior"},
|
||||
},
|
||||
{
|
||||
title: "Tile & Stone", description: "Expert tile installation for floors, walls, and backsplashes.", items: [
|
||||
{
|
||||
icon: Grid,
|
||||
text: "Custom Patterns"},
|
||||
{
|
||||
icon: Layers,
|
||||
text: "Mosaic Design"},
|
||||
{
|
||||
icon: Award,
|
||||
text: "Precision Cut"},
|
||||
],
|
||||
reverse: false,
|
||||
media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/creative-workers-standing-near-work-table-being-happy-finish-their-work_273609-14159.jpg", imageAlt: "luxury hardwood floor renovation interior"},
|
||||
},
|
||||
]}
|
||||
title="Professional Services"
|
||||
description="From custom flooring to full home remodels, we provide expert solutions for every room."
|
||||
/>
|
||||
</div>
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTen
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "Hardwood Flooring", description: "Beautiful, durable hardwood solutions installed with care.", items: [
|
||||
{ icon: Home, text: "Solid Wood" },
|
||||
{ icon: Ruler, text: "Engineered Wood" },
|
||||
{ icon: Check, text: "Refinishing" }
|
||||
],
|
||||
reverse: false,
|
||||
media: { imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-white-minimal-kitchen-with-wood-decoration_105762-2211.jpg", imageAlt: "luxury hardwood floor renovation interior" }
|
||||
},
|
||||
{
|
||||
title: "Full Remodels", description: "Complete transformation of your kitchen, bathroom, or living area.", items: [
|
||||
{ icon: Home, text: "Kitchens" },
|
||||
{ icon: Droplets, text: "Bathrooms" },
|
||||
{ icon: Zap, text: "Full Layouts" }
|
||||
],
|
||||
reverse: true,
|
||||
media: { imageSrc: "http://img.b2bpic.net/free-photo/tired-young-couple-are-sitting-floor-with-paint-brush-bucket-while-doing-repair-home_496169-751.jpg", imageAlt: "luxury hardwood floor renovation interior" }
|
||||
},
|
||||
{
|
||||
title: "Tile & Stone", description: "Expert tile installation for floors, walls, and backsplashes.", items: [
|
||||
{ icon: Grid, text: "Custom Patterns" },
|
||||
{ icon: Layers, text: "Mosaic Design" },
|
||||
{ icon: Award, text: "Precision Cut" }
|
||||
],
|
||||
reverse: false,
|
||||
media: { imageSrc: "http://img.b2bpic.net/free-photo/creative-workers-standing-near-work-table-being-happy-finish-their-work_273609-14159.jpg", imageAlt: "luxury hardwood floor renovation interior" }
|
||||
}
|
||||
]}
|
||||
title="Professional Services"
|
||||
description="From custom flooring to full home remodels, we provide expert solutions for every room."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
title="Craftsmanship You Can Trust"
|
||||
description="At HT Floors, we combine decades of remodeling experience with modern design sensibilities to deliver spaces that truly reflect your style."
|
||||
bulletPoints={[
|
||||
{
|
||||
title: "Certified Experts", description: "Licensed and insured craftsmen."},
|
||||
{
|
||||
title: "Quality Materials", description: "Only the finest materials for every project."},
|
||||
{
|
||||
title: "On-Time Delivery", description: "Respecting your schedule and your home."},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/carpenter-marking-wooden-desk-with-measuring-tape_74855-5662.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
title="Craftsmanship You Can Trust"
|
||||
description="At HT Floors, we combine decades of remodeling experience with modern design sensibilities to deliver spaces that truly reflect your style."
|
||||
bulletPoints={[
|
||||
{ title: "Certified Experts", description: "Licensed and insured craftsmen." },
|
||||
{ title: "Quality Materials", description: "Only the finest materials for every project." },
|
||||
{ title: "On-Time Delivery", description: "Respecting your schedule and your home." }
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/carpenter-marking-wooden-desk-with-measuring-tape_74855-5662.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="portfolio" data-section="portfolio">
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1", name: "Modern Hardwood", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-classic-warm-living-room-with-piano-armchair_105762-2249.jpg"},
|
||||
{
|
||||
id: "p2", name: "Kitchen Renovation", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/modern-minimalist-living-room-interior_23-2152016396.jpg"},
|
||||
{
|
||||
id: "p3", name: "Bathroom Tile", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/minimalist-white-kitchen-dining-area_23-2151983253.jpg"},
|
||||
{
|
||||
id: "p4", name: "Custom Backsplash", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/top-view-man-using-sand-paper-carpentry-workshop-concept_23-2148640281.jpg"},
|
||||
{
|
||||
id: "p5", name: "Open Concept Floor", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/corner-kitchen-open-drawers-cooking-zone_169016-69130.jpg"},
|
||||
{
|
||||
id: "p6", name: "Luxury Vinyl Plank", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/carpenter-checking-dimensions-wooden-plank_329181-3746.jpg"},
|
||||
]}
|
||||
title="Recent Projects"
|
||||
description="Explore our portfolio of recent flooring and remodeling transformations."
|
||||
/>
|
||||
</div>
|
||||
<div id="portfolio" data-section="portfolio">
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "p1", name: "Modern Hardwood", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-classic-warm-living-room-with-piano-armchair_105762-2249.jpg" },
|
||||
{ id: "p2", name: "Kitchen Renovation", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/modern-minimalist-living-room-interior_23-2152016396.jpg" },
|
||||
{ id: "p3", name: "Bathroom Tile", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/minimalist-white-kitchen-dining-area_23-2151983253.jpg" },
|
||||
{ id: "p4", name: "Custom Backsplash", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/top-view-man-using-sand-paper-carpentry-workshop-concept_23-2148640281.jpg" },
|
||||
{ id: "p5", name: "Open Concept Floor", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/corner-kitchen-open-drawers-cooking-zone_169016-69130.jpg" },
|
||||
{ id: "p6", name: "Luxury Vinyl Plank", price: "Custom", imageSrc: "http://img.b2bpic.net/free-photo/carpenter-checking-dimensions-wooden-plank_329181-3746.jpg" }
|
||||
]}
|
||||
title="Recent Projects"
|
||||
description="Explore our portfolio of recent flooring and remodeling transformations."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardSeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1", value: "500+", title: "Projects Completed", items: [
|
||||
"Residential", "Commercial"],
|
||||
},
|
||||
{
|
||||
id: "m2", value: "15+", title: "Years Experience", items: [
|
||||
"Expertise", "Craftsmanship"],
|
||||
},
|
||||
{
|
||||
id: "m3", value: "100%", title: "Client Satisfaction", items: [
|
||||
"Quality", "Reliability"],
|
||||
},
|
||||
]}
|
||||
title="Our Impact"
|
||||
description="Numbers speak to our reliability and dedication to quality."
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardSeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
metrics={[
|
||||
{ id: "m1", value: "500+", title: "Projects Completed", items: ["Residential", "Commercial"] },
|
||||
{ id: "m2", value: "15+", title: "Years Experience", items: ["Expertise", "Craftsmanship"] },
|
||||
{ id: "m3", value: "100%", title: "Client Satisfaction", items: ["Quality", "Reliability"] }
|
||||
]}
|
||||
title="Our Impact"
|
||||
description="Numbers speak to our reliability and dedication to quality."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwelve
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "t1", name: "Alice Johnson", imageSrc: "http://img.b2bpic.net/free-photo/tired-young-couple-are-sitting-floor-with-paint-brush-bucket-while-doing-repair-home_496169-751.jpg"},
|
||||
{
|
||||
id: "t2", name: "Bob Smith", imageSrc: "http://img.b2bpic.net/free-photo/creative-workers-standing-near-work-table-being-happy-finish-their-work_273609-14159.jpg"},
|
||||
{
|
||||
id: "t3", name: "Charlie Davis", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-home-with-heater_23-2149339547.jpg"},
|
||||
{
|
||||
id: "t4", name: "Dana White", imageSrc: "http://img.b2bpic.net/free-photo/lower-angle-portrait-young-strong-man-with-muscles-tries-close-his-suitcase-full-clothes-pressing-bag-with-effort_1258-314717.jpg"},
|
||||
{
|
||||
id: "t5", name: "Edward Brown", imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-man-posing_23-2148563421.jpg"},
|
||||
]}
|
||||
cardTitle="What Our Clients Say"
|
||||
cardTag="Testimonials"
|
||||
cardAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardTwelve
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{ id: "t1", name: "Alice Johnson", imageSrc: "http://img.b2bpic.net/free-photo/tired-young-couple-are-sitting-floor-with-paint-brush-bucket-while-doing-repair-home_496169-751.jpg" },
|
||||
{ id: "t2", name: "Bob Smith", imageSrc: "http://img.b2bpic.net/free-photo/creative-workers-standing-near-work-table-being-happy-finish-their-work_273609-14159.jpg" },
|
||||
{ id: "t3", name: "Charlie Davis", imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-home-with-heater_23-2149339547.jpg" },
|
||||
{ id: "t4", name: "Dana White", imageSrc: "http://img.b2bpic.net/free-photo/lower-angle-portrait-young-strong-man-with-muscles-tries-close-his-suitcase-full-clothes-pressing-bag-with-effort_1258-314717.jpg" },
|
||||
{ id: "t5", name: "Edward Brown", imageSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-man-posing_23-2148563421.jpg" }
|
||||
]}
|
||||
cardTitle="What Our Clients Say"
|
||||
cardTag="Testimonials"
|
||||
cardAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1", title: "Do you provide estimates?", content: "Yes, we offer free estimates for all our services."},
|
||||
{
|
||||
id: "f2", title: "Are you insured?", content: "Absolutely, we are fully licensed and insured."},
|
||||
{
|
||||
id: "f3", title: "How long does a remodel take?", content: "It depends on the project size; we will provide a timeline upon assessment."},
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Have questions about our remodeling services? Find answers here."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{ id: "f1", title: "Do you provide estimates?", content: "Yes, we offer free estimates for all our services." },
|
||||
{ id: "f2", title: "Are you insured?", content: "Absolutely, we are fully licensed and insured." },
|
||||
{ id: "f3", title: "How long does a remodel take?", content: "It depends on the project size; we will provide a timeline upon assessment." }
|
||||
]}
|
||||
title="Frequently Asked Questions"
|
||||
description="Have questions about our remodeling services? Find answers here."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain"}}
|
||||
tag="Contact Us"
|
||||
title="Ready to Start Your Project?"
|
||||
description="Reach out today for a consultation or to schedule an estimate for your next remodeling or flooring project."
|
||||
buttons={[
|
||||
{
|
||||
text: "Contact Us Now", href: "mailto:info@htfloors.com"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "plain" }}
|
||||
tag="Contact Us"
|
||||
title="Ready to Start Your Project?"
|
||||
description="Reach out today for a consultation or to schedule an estimate for your next remodeling or flooring project."
|
||||
buttons={[{ text: "Contact Us Now", href: "mailto:info@htfloors.com" }]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Services", items: [
|
||||
{
|
||||
label: "Hardwood Flooring", href: "#services"},
|
||||
{
|
||||
label: "Full Remodels", href: "#services"},
|
||||
{
|
||||
label: "Tile & Stone", href: "#services"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{
|
||||
label: "About Us", href: "#about"},
|
||||
{
|
||||
label: "Portfolio", href: "#portfolio"},
|
||||
{
|
||||
label: "Contact", href: "#contact"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support", items: [
|
||||
{
|
||||
label: "FAQ", href: "#faq"},
|
||||
{
|
||||
label: "Privacy Policy", href: "#"},
|
||||
],
|
||||
},
|
||||
]}
|
||||
bottomLeftText="© 2024 HT Floors & Remodel."
|
||||
bottomRightText="All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Services", items: [
|
||||
{ label: "Hardwood Flooring", href: "#services" },
|
||||
{ label: "Full Remodels", href: "#services" },
|
||||
{ label: "Tile & Stone", href: "#services" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "#about" },
|
||||
{ label: "Portfolio", href: "#portfolio" },
|
||||
{ label: "Contact", href: "#contact" }
|
||||
]
|
||||
},
|
||||
{
|
||||
title: "Support", items: [
|
||||
{ label: "FAQ", href: "#faq" },
|
||||
{ label: "Privacy Policy", href: "#" }
|
||||
]
|
||||
}
|
||||
]}
|
||||
bottomLeftText="© 2024 HT Floors & Remodel."
|
||||
bottomRightText="All rights reserved."
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user