Update src/app/page.tsx
This commit is contained in:
177
src/app/page.tsx
177
src/app/page.tsx
@@ -9,15 +9,15 @@ import ProductCardTwo from "@/components/sections/product/ProductCardTwo";
|
||||
import MetricCardSeven from "@/components/sections/metrics/MetricCardSeven";
|
||||
import TestimonialCardSix from "@/components/sections/testimonial/TestimonialCardSix";
|
||||
import FooterCard from "@/components/sections/footer/FooterCard";
|
||||
import { Award, CheckCircle, Zap, Wrench, Package, TrendingUp, Star, HelpCircle, Facebook, Instagram, Linkedin, Zap as ZapBadge, Shield, Award as AwardBadge } from "lucide-react";
|
||||
import { Award, CheckCircle, Zap, Wrench, Package, TrendingUp, Star, HelpCircle, Facebook, Instagram, Linkedin, Zap as ZapBadge, Shield, Award as AwardBadge, Droplet, Sun, Hammer, MapPin, Phone, Mail } from "lucide-react";
|
||||
import Link from "next/link";
|
||||
|
||||
export default function HomePage() {
|
||||
const navItems = [
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Services", id: "/services" },
|
||||
{ name: "Products", id: "/products" },
|
||||
{ name: "About", id: "/about" },
|
||||
{ name: "Pools", id: "#pools" },
|
||||
{ name: "Solar", id: "#solar" },
|
||||
{ name: "Landscaping", id: "#landscaping" },
|
||||
{ name: "Contact", id: "/contact" },
|
||||
];
|
||||
|
||||
@@ -40,15 +40,16 @@ export default function HomePage() {
|
||||
navItems={navItems}
|
||||
brandName="Blue Pools"
|
||||
button={{
|
||||
text: "Get Quote", href: "#contact"}}
|
||||
text: "Get a Free Quote", href: "/contact"
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Hero Section */}
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardScroll
|
||||
title="Premium Pools & Solar Solutions"
|
||||
description="Transform your outdoor space with custom pool construction and harness the power of solar energy. Blue Pools delivers excellence in design, installation, and maintenance across South Africa."
|
||||
title="Your Dream Pool & Sustainable Solar Solutions Start Here"
|
||||
description="Blue Pools delivers professional pool construction, maintenance, and solar installations across South Africa."
|
||||
tag="Expert Craftsmanship Since 2010"
|
||||
tagIcon={Zap}
|
||||
tagAnimation="slide-up"
|
||||
@@ -56,8 +57,8 @@ export default function HomePage() {
|
||||
imageSrc="http://img.b2bpic.net/free-photo/stylish-young-beautiful-fit-slim-blonde-woman-summer-blue-top-short-skirt_343596-3080.jpg"
|
||||
imageAlt="Luxurious swimming pool with modern design"
|
||||
buttons={[
|
||||
{ text: "Schedule Consultation", href: "/contact" },
|
||||
{ text: "View Portfolio", href: "/services" },
|
||||
{ text: "Get a Free Quote", href: "/contact" },
|
||||
{ text: "View Services", href: "#services" },
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
/>
|
||||
@@ -69,7 +70,7 @@ export default function HomePage() {
|
||||
tag="About Blue Pools"
|
||||
tagIcon={Award}
|
||||
title="South Africa's Trusted Pool & Solar Experts"
|
||||
description="Blue Pools has been transforming outdoor spaces across South Africa for over a decade. Our team combines decades of expertise in pool construction, solar energy integration, and maintenance services. We're committed to delivering sustainable, beautiful, and durable solutions that enhance your lifestyle while reducing your environmental footprint."
|
||||
description="Blue Pools has been transforming outdoor spaces across South Africa for over a decade. Our team combines decades of expertise in pool construction, solar energy integration, and maintenance services. We're committed to delivering sustainable, beautiful, and durable solutions that enhance your lifestyle while reducing your environmental footprint. Quality craftsmanship, speed of delivery, and sustainability are at the heart of everything we do."
|
||||
metrics={[
|
||||
{ value: "2000+", title: "Pools Installed" },
|
||||
{ value: "15+", title: "Years of Excellence" },
|
||||
@@ -82,7 +83,7 @@ export default function HomePage() {
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Features/Services Section */}
|
||||
{/* Services Section */}
|
||||
<div id="services" data-section="services">
|
||||
<FeatureCardTen
|
||||
title="Our Core Services"
|
||||
@@ -95,45 +96,63 @@ export default function HomePage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "1", title: "Pool Construction", description: "Custom-designed pools tailored to your space and budget. From fibreglass to concrete, we handle every detail with precision and care.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-balancing-skateboard_23-2147678275.jpg?_wi=2"},
|
||||
id: "1", title: "Pool Construction", description: "Custom-designed pools tailored to your space and budget. From fibreglass to concrete, we handle every detail with precision and care. Our expert team ensures quality materials, professional installation, and attention to every design element for pools that last.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/man-balancing-skateboard_23-2147678275.jpg?_wi=2"
|
||||
},
|
||||
items: [
|
||||
{ icon: CheckCircle, text: "Custom designs" },
|
||||
{ icon: CheckCircle, text: "Professional installation" },
|
||||
{ icon: CheckCircle, text: "Quality materials" },
|
||||
{ icon: CheckCircle, text: "5-year warranty" },
|
||||
],
|
||||
reverse: false,
|
||||
},
|
||||
{
|
||||
id: "2", title: "Solar Energy Solutions", description: "Reduce energy costs with our solar heating and power systems. Perfect for pool heating and powering your home sustainably.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/lots-solar-panels-field-generating-electricity_23-2148895413.jpg"},
|
||||
items: [
|
||||
{ icon: CheckCircle, text: "System design & installation" },
|
||||
{ icon: CheckCircle, text: "Energy efficiency" },
|
||||
{ icon: CheckCircle, text: "Long-term savings" },
|
||||
],
|
||||
reverse: true,
|
||||
},
|
||||
{
|
||||
id: "3", title: "Pool Maintenance", description: "Keep your pool in pristine condition year-round with our comprehensive maintenance packages and emergency repair services.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/legs-skateboarder-preparing-ride_23-2147678296.jpg?_wi=1"},
|
||||
id: "2", title: "Pool Renovation & Maintenance", description: "Keep your pool in pristine condition year-round with our comprehensive maintenance packages and emergency repair services. From routine cleaning to equipment repair and water treatment, we ensure your pool stays safe and beautiful.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/legs-skateboarder-preparing-ride_23-2147678296.jpg?_wi=1"
|
||||
},
|
||||
items: [
|
||||
{ icon: CheckCircle, text: "Regular servicing" },
|
||||
{ icon: CheckCircle, text: "Equipment repair" },
|
||||
{ icon: CheckCircle, text: "Water treatment" },
|
||||
{ icon: CheckCircle, text: "Emergency support" },
|
||||
],
|
||||
reverse: true,
|
||||
},
|
||||
{
|
||||
id: "3", title: "Solar Water Heating Systems", description: "Reduce energy costs with our solar heating and power systems. Perfect for pool heating and powering your home sustainably. Our solar solutions are designed for maximum efficiency and long-term savings with professional installation and support.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/lots-solar-panels-field-generating-electricity_23-2148895413.jpg"
|
||||
},
|
||||
items: [
|
||||
{ icon: CheckCircle, text: "System design & installation" },
|
||||
{ icon: CheckCircle, text: "Energy efficiency" },
|
||||
{ icon: CheckCircle, text: "Long-term savings" },
|
||||
{ icon: CheckCircle, text: "10-year warranty" },
|
||||
],
|
||||
reverse: false,
|
||||
},
|
||||
{
|
||||
id: "4", title: "Outdoor Landscaping & Decking", description: "Complete your outdoor oasis with professional landscaping and decking solutions. We design and build beautiful outdoor spaces that complement your pool and enhance your property's value and appeal.", media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-outdoor-swimming-pool-with-bed-deck-chair-umbrella-resort-travel-vacation_74190-7923.jpg?_wi=1"
|
||||
},
|
||||
items: [
|
||||
{ icon: CheckCircle, text: "Landscape design" },
|
||||
{ icon: CheckCircle, text: "Decking installation" },
|
||||
{ icon: CheckCircle, text: "Hardscaping" },
|
||||
{ icon: CheckCircle, text: "Maintenance plans" },
|
||||
],
|
||||
reverse: true,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Products Section */}
|
||||
<div id="products" data-section="products">
|
||||
{/* Gallery Section - displayed through Products */}
|
||||
<div id="gallery" data-section="gallery">
|
||||
<ProductCardTwo
|
||||
title="Quality Pool & Solar Products"
|
||||
description="We supply and install premium equipment from trusted manufacturers across South Africa."
|
||||
tag="Products"
|
||||
title="Gallery - Before & After Projects"
|
||||
description="View our portfolio of completed pool and solar projects across South Africa."
|
||||
tag="Portfolio"
|
||||
tagIcon={Package}
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
@@ -142,14 +161,63 @@ export default function HomePage() {
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
products={[
|
||||
{
|
||||
id: "1", brand: "AquaPro", name: "Variable Speed Pool Pump", price: "R4,500", rating: 5,
|
||||
reviewCount: "342", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-outdoor-swimming-pool-with-bed-deck-chair-umbrella-resort-travel-vacation_74190-7923.jpg?_wi=1", imageAlt: "AquaPro variable speed pool pump - Energy Efficient, 5-Year Warranty"},
|
||||
id: "1", brand: "Cape Town Residence", name: "Resort-Style Pool & Deck", price: "Completed 2024", rating: 5,
|
||||
reviewCount: "Before & After", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-outdoor-swimming-pool-with-bed-deck-chair-umbrella-resort-travel-vacation_74190-7923.jpg?_wi=1", imageAlt: "Resort-style pool with timber decking and landscaping"
|
||||
},
|
||||
{
|
||||
id: "2", brand: "SolarTech", name: "Solar Water Heater System", price: "R12,800", rating: 5,
|
||||
reviewCount: "156", imageSrc: "http://img.b2bpic.net/free-photo/view-water-tank-storage_23-2151748235.jpg", imageAlt: "SolarTech solar water heater - Energy Efficient, 10-Year Warranty"},
|
||||
id: "2", brand: "Johannesburg Estate", name: "Solar Heating & Pool Renovation", price: "Completed 2024", rating: 5,
|
||||
reviewCount: "Before & After", imageSrc: "http://img.b2bpic.net/free-photo/view-water-tank-storage_23-2151748235.jpg", imageAlt: "Modern solar water heating system installation"
|
||||
},
|
||||
{
|
||||
id: "3", brand: "ClearFlow", name: "Multi-Stage Filtration Unit", price: "R3,200", rating: 5,
|
||||
reviewCount: "289", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-outdoor-swimming-pool-with-bed-deck-chair-umbrella-resort-travel-vacation_74190-7923.jpg?_wi=2", imageAlt: "ClearFlow multi-stage filtration system - Durable Build, Lifetime Support"},
|
||||
id: "3", brand: "Durban Beachfront", name: "Contemporary Design Pool", price: "Completed 2023", rating: 5,
|
||||
reviewCount: "Before & After", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-outdoor-swimming-pool-with-bed-deck-chair-umbrella-resort-travel-vacation_74190-7923.jpg?_wi=2", imageAlt: "Contemporary style pool with waterfall feature"
|
||||
},
|
||||
{
|
||||
id: "4", brand: "Pretoria Residence", name: "Family Pool & Solar System", price: "Completed 2023", rating: 5,
|
||||
reviewCount: "Before & After", imageSrc: "http://img.b2bpic.net/free-photo/stylish-young-beautiful-fit-slim-blonde-woman-summer-blue-top-short-skirt_343596-3080.jpg", imageAlt: "Family-sized pool with solar heating installation"
|
||||
},
|
||||
{
|
||||
id: "5", brand: "Stellenbosch Garden", name: "Landscaping & Decking Project", price: "Completed 2024", rating: 5,
|
||||
reviewCount: "Before & After", imageSrc: "http://img.b2bpic.net/free-photo/man-balancing-skateboard_23-2147678275.jpg?_wi=2", imageAlt: "Professional landscaping with stone decking and gardens"
|
||||
},
|
||||
{
|
||||
id: "6", brand: "Sandton Commercial", name: "Corporate Pool Complex", price: "Completed 2023", rating: 5,
|
||||
reviewCount: "Before & After", imageSrc: "http://img.b2bpic.net/free-photo/legs-skateboarder-preparing-ride_23-2147678296.jpg?_wi=1", imageAlt: "Commercial pool installation with maintenance systems"
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Testimonials Section */}
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSix
|
||||
title="What Our Clients Say"
|
||||
description="Hear from homeowners and businesses who've transformed their spaces with Blue Pools."
|
||||
tag="Testimonials"
|
||||
tagIcon={Star}
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Johan Pieterse", handle: "Cape Town, WC", testimonial: "Blue Pools transformed our backyard into a resort-like oasis. Their professionalism and attention to detail exceeded all expectations. Highly recommended!", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=1", imageAlt: "Johan Pieterse"
|
||||
},
|
||||
{
|
||||
id: "2", name: "Michelle van Dyk", handle: "Johannesburg, GP", testimonial: "The solar solution Blue Pools installed has cut our energy costs by 40%. Best investment we've made for our home and the environment.", imageSrc: "http://img.b2bpic.net/free-photo/successful-businesswoman-ready-challenges_1163-4336.jpg?_wi=1", imageAlt: "Michelle van Dyk"
|
||||
},
|
||||
{
|
||||
id: "3", name: "David Nkosi", handle: "Durban, KZN", testimonial: "Their maintenance service keeps our pool in perfect condition year-round. Reliable, affordable, and professional every time.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=2", imageAlt: "David Nkosi"
|
||||
},
|
||||
{
|
||||
id: "4", name: "Sarah Thompson", handle: "Pretoria, GP", testimonial: "From consultation to installation, Blue Pools made the entire process seamless. Our family loves our new pool and solar system!", imageSrc: "http://img.b2bpic.net/free-photo/successful-businesswoman-ready-challenges_1163-4336.jpg?_wi=2", imageAlt: "Sarah Thompson"
|
||||
},
|
||||
{
|
||||
id: "5", name: "Thabo Mdlalose", handle: "Sandton, GP", testimonial: "Premium quality work at competitive prices. Blue Pools is the only company I trust with my pool and solar needs.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=3", imageAlt: "Thabo Mdlalose"
|
||||
},
|
||||
{
|
||||
id: "6", name: "Lisa Chen", handle: "Stellenbosch, WC", testimonial: "Five stars all the way. The team was punctual, professional, and left our property cleaner than when they arrived. Exceptional service!", imageSrc: "http://img.b2bpic.net/free-photo/successful-businesswoman-ready-challenges_1163-4336.jpg?_wi=3", imageAlt: "Lisa Chen"
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -182,34 +250,6 @@ export default function HomePage() {
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Testimonials Section */}
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSix
|
||||
title="What Our Clients Say"
|
||||
description="Hear from homeowners and businesses who've transformed their spaces with Blue Pools."
|
||||
tag="Testimonials"
|
||||
tagIcon={Star}
|
||||
tagAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Johan Pieterse", handle: "Cape Town, WC", testimonial: "Blue Pools transformed our backyard into a resort-like oasis. Their professionalism and attention to detail exceeded all expectations. Highly recommended!", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=1", imageAlt: "Johan Pieterse"},
|
||||
{
|
||||
id: "2", name: "Michelle van Dyk", handle: "Johannesburg, GP", testimonial: "The solar solution Blue Pools installed has cut our energy costs by 40%. Best investment we've made for our home and the environment.", imageSrc: "http://img.b2bpic.net/free-photo/successful-businesswoman-ready-challenges_1163-4336.jpg?_wi=1", imageAlt: "Michelle van Dyk"},
|
||||
{
|
||||
id: "3", name: "David Nkosi", handle: "Durban, KZN", testimonial: "Their maintenance service keeps our pool in perfect condition year-round. Reliable, affordable, and professional every time.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=2", imageAlt: "David Nkosi"},
|
||||
{
|
||||
id: "4", name: "Sarah Thompson", handle: "Pretoria, GP", testimonial: "From consultation to installation, Blue Pools made the entire process seamless. Our family loves our new pool and solar system!", imageSrc: "http://img.b2bpic.net/free-photo/successful-businesswoman-ready-challenges_1163-4336.jpg?_wi=2", imageAlt: "Sarah Thompson"},
|
||||
{
|
||||
id: "5", name: "Thabo Mdlalose", handle: "Sandton, GP", testimonial: "Premium quality work at competitive prices. Blue Pools is the only company I trust with my pool and solar needs.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=3", imageAlt: "Thabo Mdlalose"},
|
||||
{
|
||||
id: "6", name: "Lisa Chen", handle: "Stellenbosch, WC", testimonial: "Five stars all the way. The team was punctual, professional, and left our property cleaner than when they arrived. Exceptional service!", imageSrc: "http://img.b2bpic.net/free-photo/successful-businesswoman-ready-challenges_1163-4336.jpg?_wi=3", imageAlt: "Lisa Chen"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Footer */}
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterCard
|
||||
@@ -218,13 +258,16 @@ export default function HomePage() {
|
||||
socialLinks={[
|
||||
{
|
||||
icon: Facebook,
|
||||
href: "https://facebook.com/bluepools", ariaLabel: "Blue Pools Facebook"},
|
||||
href: "https://facebook.com/bluepools", ariaLabel: "Blue Pools Facebook"
|
||||
},
|
||||
{
|
||||
icon: Instagram,
|
||||
href: "https://instagram.com/bluepools", ariaLabel: "Blue Pools Instagram"},
|
||||
href: "https://instagram.com/bluepools", ariaLabel: "Blue Pools Instagram"
|
||||
},
|
||||
{
|
||||
icon: Linkedin,
|
||||
href: "https://linkedin.com/company/bluepools", ariaLabel: "Blue Pools LinkedIn"},
|
||||
href: "https://linkedin.com/company/bluepools", ariaLabel: "Blue Pools LinkedIn"
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user