Compare commits
17 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 33676a0026 | |||
| cedc31c39b | |||
| 30f5479ea1 | |||
| 05306f8214 | |||
| ee3c297494 | |||
| d95fc7132b | |||
| 5debf0cb92 | |||
| f0c8f40c23 | |||
| baac49bcc9 | |||
| f58bfc04ad | |||
| 9dbdcdbfa9 | |||
| 70febe0685 | |||
| 8fef0f19c5 | |||
| b5eb8ca538 | |||
| d7e05cd8e7 | |||
| 9230eaa033 | |||
| baaea4d5cc |
@@ -4,14 +4,14 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|||||||
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
|
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
|
||||||
import HeroBillboardCarousel from "@/components/sections/hero/HeroBillboardCarousel";
|
import HeroBillboardCarousel from "@/components/sections/hero/HeroBillboardCarousel";
|
||||||
import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
|
import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
|
||||||
import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
|
import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
|
||||||
import FaqSplitText from "@/components/sections/faq/FaqSplitText";
|
import FaqSplitText from "@/components/sections/faq/FaqSplitText";
|
||||||
import FooterCard from "@/components/sections/footer/FooterCard";
|
import FooterCard from "@/components/sections/footer/FooterCard";
|
||||||
import { Hammer, Wrench, Droplet, Paintbrush, Zap, MonitorPlay, Armchair, Layers, TrendingUp, Clock, Users, CheckCircle, Star, Facebook, Instagram, Phone } from "lucide-react";
|
import { Hammer, Wrench, Droplet, Paintbrush, Zap, MonitorPlay, Armchair, Layers, TrendingUp, Clock, Users, CheckCircle, Star, Facebook, Instagram, Phone, Quote } from "lucide-react";
|
||||||
|
|
||||||
export default function ContactPage() {
|
export default function ContactPage() {
|
||||||
const navItems = [
|
const navItems = [
|
||||||
{ name: "Home", id: "home" },
|
{ name: "Home", id: "/" },
|
||||||
{ name: "Services", id: "services" },
|
{ name: "Services", id: "services" },
|
||||||
{ name: "About", id: "about" },
|
{ name: "About", id: "about" },
|
||||||
{ name: "Portfolio", id: "portfolio" },
|
{ name: "Portfolio", id: "portfolio" },
|
||||||
@@ -19,7 +19,8 @@ export default function ContactPage() {
|
|||||||
];
|
];
|
||||||
|
|
||||||
const contactButton = {
|
const contactButton = {
|
||||||
text: "Call Now", href: "tel:804-938-0669"};
|
text: "Call Now", href: "tel:804-938-0669"
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ThemeProvider
|
<ThemeProvider
|
||||||
@@ -52,23 +53,31 @@ export default function ContactPage() {
|
|||||||
background={{ variant: "sparkles-gradient" }}
|
background={{ variant: "sparkles-gradient" }}
|
||||||
mediaItems={[
|
mediaItems={[
|
||||||
{
|
{
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/young-cute-family-repairs-room_1157-24897.jpg", imageAlt: "Professional home services team"},
|
imageSrc: "http://img.b2bpic.net/free-photo/young-cute-family-repairs-room_1157-24897.jpg", imageAlt: "Professional home services team"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721573.jpg", imageAlt: "Expert plumbing services"},
|
imageSrc: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721573.jpg", imageAlt: "Expert plumbing services"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-painting-wall-home_23-2149098981.jpg", imageAlt: "Professional painting services"},
|
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-painting-wall-home_23-2149098981.jpg", imageAlt: "Professional painting services"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/woman-electrician-checks-switchboard-tablet-night-shift-smart-service_169016-70936.jpg", imageAlt: "Licensed electrical work"},
|
imageSrc: "http://img.b2bpic.net/free-photo/woman-electrician-checks-switchboard-tablet-night-shift-smart-service_169016-70936.jpg", imageAlt: "Licensed electrical work"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/mechanics-checking-planning-workshop_329181-11868.jpg", imageAlt: "General maintenance services"},
|
imageSrc: "http://img.b2bpic.net/free-photo/mechanics-checking-planning-workshop_329181-11868.jpg", imageAlt: "General maintenance services"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/circular-saw-carpenter-using-circular-saw-wood_169016-17039.jpg", imageAlt: "Professional flooring installation"},
|
imageSrc: "http://img.b2bpic.net/free-photo/circular-saw-carpenter-using-circular-saw-wood_169016-17039.jpg", imageAlt: "Professional flooring installation"
|
||||||
|
},
|
||||||
]}
|
]}
|
||||||
buttons={[
|
buttons={[
|
||||||
{
|
{
|
||||||
text: "Call Now: 804-938-0669", href: "tel:804-938-0669"},
|
text: "Call Now: 804-938-0669", href: "tel:804-938-0669"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
text: "Quick Contact Form", href: "#contact-form"},
|
text: "Quick Contact Form", href: "#contact-form"
|
||||||
|
},
|
||||||
]}
|
]}
|
||||||
buttonAnimation="slide-up"
|
buttonAnimation="slide-up"
|
||||||
ariaLabel="Contact page hero section for Earl Boys Services"
|
ariaLabel="Contact page hero section for Earl Boys Services"
|
||||||
@@ -86,36 +95,44 @@ export default function ContactPage() {
|
|||||||
title: "Phone Support", description: "Call us directly for immediate assistance and emergency service requests.", icon: Phone,
|
title: "Phone Support", description: "Call us directly for immediate assistance and emergency service requests.", icon: Phone,
|
||||||
mediaItems: [
|
mediaItems: [
|
||||||
{
|
{
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-receiving-box_23-2149103401.jpg", imageAlt: "Customer service support"},
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-receiving-box_23-2149103401.jpg", imageAlt: "Customer service support"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-man-choosing-color_23-2148903521.jpg", imageAlt: "Professional communication"},
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-man-choosing-color_23-2148903521.jpg", imageAlt: "Professional communication"
|
||||||
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Service Area Coverage", description: "We proudly serve Richmond, VA and all surrounding areas with comprehensive home services.", icon: Wrench,
|
title: "Service Area Coverage", description: "We proudly serve Richmond, VA and all surrounding areas with comprehensive home services.", icon: Wrench,
|
||||||
mediaItems: [
|
mediaItems: [
|
||||||
{
|
{
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-person-s-hand-holding-push-pin-blur-map_23-2147958186.jpg", imageAlt: "Richmond virginia map location marker"},
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-person-s-hand-holding-push-pin-blur-map_23-2147958186.jpg", imageAlt: "Richmond virginia map location marker"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-men-cleaning-office-together_23-2149345517.jpg", imageAlt: "Professional home services team working"},
|
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-men-cleaning-office-together_23-2149345517.jpg", imageAlt: "Professional home services team working"
|
||||||
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Free Estimates", description: "Schedule a free consultation and estimate for your project with our experienced team.", icon: CheckCircle,
|
title: "Free Estimates", description: "Schedule a free consultation and estimate for your project with our experienced team.", icon: CheckCircle,
|
||||||
mediaItems: [
|
mediaItems: [
|
||||||
{
|
{
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/young-couple-moving-new-home_23-2149242082.jpg", imageAlt: "Home improvement project"},
|
imageSrc: "http://img.b2bpic.net/free-photo/young-couple-moving-new-home_23-2149242082.jpg", imageAlt: "Home improvement project"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-builder-men-with-smartphones_23-2148751993.jpg", imageAlt: "Professional consultation"},
|
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-builder-men-with-smartphones_23-2148751993.jpg", imageAlt: "Professional consultation"
|
||||||
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: "Licensed & Insured", description: "All services fully licensed, insured, and bonded for your peace of mind.", icon: CheckCircle,
|
title: "Licensed & Insured", description: "All services fully licensed, insured, and bonded for your peace of mind.", icon: CheckCircle,
|
||||||
mediaItems: [
|
mediaItems: [
|
||||||
{
|
{
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-grey-haired-logistic-worker-hardhat-uniform-standing-shelves-warehouse-with-arms-folded-looking-camera-smiling-vertical-shot-labor-blue-collar-portrait-concept_74855-14227.jpg", imageAlt: "Professional tradesman"},
|
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-grey-haired-logistic-worker-hardhat-uniform-standing-shelves-warehouse-with-arms-folded-looking-camera-smiling-vertical-shot-labor-blue-collar-portrait-concept_74855-14227.jpg", imageAlt: "Professional tradesman"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
imageSrc: "http://img.b2bpic.net/free-photo/view-professional-cleaning-service-person-holding-supplies_23-2150520608.jpg", imageAlt: "Professional service team"},
|
imageSrc: "http://img.b2bpic.net/free-photo/view-professional-cleaning-service-person-holding-supplies_23-2150520608.jpg", imageAlt: "Professional service team"
|
||||||
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
@@ -124,36 +141,42 @@ export default function ContactPage() {
|
|||||||
useInvertedBackground={false}
|
useInvertedBackground={false}
|
||||||
buttons={[
|
buttons={[
|
||||||
{
|
{
|
||||||
text: "Request Service", href: "tel:804-938-0669"},
|
text: "Request Service", href: "tel:804-938-0669"
|
||||||
|
},
|
||||||
]}
|
]}
|
||||||
buttonAnimation="slide-up"
|
buttonAnimation="slide-up"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="metrics" data-section="metrics">
|
<div id="testimonials" data-section="testimonials">
|
||||||
<MetricCardOne
|
<TestimonialCardThirteen
|
||||||
title="Ready to Transform Your Home?"
|
title="What Our Customers Say"
|
||||||
description="Join thousands of satisfied customers who have trusted Earl Boys Services with their most important projects."
|
description="Hear from satisfied clients who have experienced Earl Boys Services excellence firsthand."
|
||||||
tag="Contact Details"
|
tag="Customer Reviews"
|
||||||
tagIcon={TrendingUp}
|
tagIcon={Star}
|
||||||
metrics={[
|
testimonials={[
|
||||||
{
|
{
|
||||||
id: "1", value: "804", title: "938", description: "Call us directly - Call Now", icon: Phone,
|
id: "1", name: "John Mitchell", handle: "@john_m", testimonial: "Earl Boys Services transformed our kitchen with professional craftsmanship. The team was punctual, courteous, and delivered exceptional results. Highly recommend!", rating: 5,
|
||||||
|
icon: Quote
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "2", value: "15", title: "Years", description: "Experience serving Richmond VA", icon: Clock,
|
id: "2", name: "Sarah Thompson", handle: "@sarah_t", testimonial: "Outstanding plumbing work! They fixed a complex issue that other companies said was impossible. Professional, efficient, and fair pricing.", rating: 5,
|
||||||
|
icon: Quote
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "3", value: "2000", title: "Customers", description: "Trust us for their home services", icon: Users,
|
id: "3", name: "Michael Chen", handle: "@m_chen", testimonial: "The electrical work on our renovation was flawless. They explained everything clearly and made sure we understood the improvements. Will definitely call again!", rating: 5,
|
||||||
|
icon: Quote
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: "4", value: "10", title: "Services", description: "Available in your area", icon: Wrench,
|
id: "4", name: "Jennifer Rodriguez", handle: "@jen_rod", testimonial: "Best home improvement decision we made! The painters were meticulous and the quality is outstanding. Worth every penny!", rating: 5,
|
||||||
|
icon: Quote
|
||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
|
showRating={true}
|
||||||
animationType="slide-up"
|
animationType="slide-up"
|
||||||
gridVariant="uniform-all-items-equal"
|
|
||||||
textboxLayout="default"
|
textboxLayout="default"
|
||||||
useInvertedBackground={true}
|
useInvertedBackground={false}
|
||||||
|
carouselMode="buttons"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -163,17 +186,23 @@ export default function ContactPage() {
|
|||||||
sideDescription="Find answers to common questions about contacting Earl Boys Services, scheduling appointments, and our service offerings."
|
sideDescription="Find answers to common questions about contacting Earl Boys Services, scheduling appointments, and our service offerings."
|
||||||
faqs={[
|
faqs={[
|
||||||
{
|
{
|
||||||
id: "1", title: "What is your phone number?", content: "You can reach us at 804-938-0669. We're available during business hours and offer emergency service for urgent issues."},
|
id: "1", title: "What is your phone number?", content: "You can reach us at 804-938-0669. We're available during business hours and offer emergency service for urgent issues."
|
||||||
|
},
|
||||||
{
|
{
|
||||||
id: "2", title: "How quickly can you respond to my request?", content: "We typically respond to service requests within 24 hours. For emergency issues, call us immediately at 804-938-0669."},
|
id: "2", title: "How quickly can you respond to my request?", content: "We typically respond to service requests within 24 hours. For emergency issues, call us immediately at 804-938-0669."
|
||||||
|
},
|
||||||
{
|
{
|
||||||
id: "3", title: "What areas do you serve?", content: "We proudly serve Richmond, VA and all surrounding areas. Our service team covers residential and commercial properties throughout the region."},
|
id: "3", title: "What areas do you serve?", content: "We proudly serve Richmond, VA and all surrounding areas. Our service team covers residential and commercial properties throughout the region."
|
||||||
|
},
|
||||||
{
|
{
|
||||||
id: "4", title: "Do you charge for consultations and estimates?", content: "No! We provide free, no-obligation estimates for all services. Contact us to schedule your consultation."},
|
id: "4", title: "Do you charge for consultations and estimates?", content: "No! We provide free, no-obligation estimates for all services. Contact us to schedule your consultation."
|
||||||
|
},
|
||||||
{
|
{
|
||||||
id: "5", title: "What payment methods do you accept?", content: "We accept cash, check, credit cards, and digital payments. We also offer financing options for larger projects."},
|
id: "5", title: "What payment methods do you accept?", content: "We accept cash, check, credit cards, and digital payments. We also offer financing options for larger projects."
|
||||||
|
},
|
||||||
{
|
{
|
||||||
id: "6", title: "Are you licensed and insured?", content: "Absolutely. Earl Boys Services is fully licensed, insured, and bonded. We maintain all required certifications."},
|
id: "6", title: "Are you licensed and insured?", content: "Absolutely. Earl Boys Services is fully licensed, insured, and bonded. We maintain all required certifications."
|
||||||
|
},
|
||||||
]}
|
]}
|
||||||
textPosition="left"
|
textPosition="left"
|
||||||
faqsAnimation="slide-up"
|
faqsAnimation="slide-up"
|
||||||
@@ -189,13 +218,16 @@ export default function ContactPage() {
|
|||||||
socialLinks={[
|
socialLinks={[
|
||||||
{
|
{
|
||||||
icon: Facebook,
|
icon: Facebook,
|
||||||
href: "https://facebook.com", ariaLabel: "Facebook"},
|
href: "https://facebook.com", ariaLabel: "Facebook"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
icon: Instagram,
|
icon: Instagram,
|
||||||
href: "https://instagram.com", ariaLabel: "Instagram"},
|
href: "https://instagram.com", ariaLabel: "Instagram"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
icon: Phone,
|
icon: Phone,
|
||||||
href: "tel:804-938-0669", ariaLabel: "Call us"},
|
href: "tel:804-938-0669", ariaLabel: "Call us"
|
||||||
|
},
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
559
src/app/page.tsx
559
src/app/page.tsx
@@ -1,244 +1,369 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
|
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
|
||||||
import HeroLogo from "@/components/sections/hero/HeroLogo";
|
import HeroBillboardCarousel from "@/components/sections/hero/HeroBillboardCarousel";
|
||||||
import FeatureCardSeven from "@/components/sections/feature/FeatureCardSeven";
|
import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
|
||||||
import PricingCardEight from "@/components/sections/pricing/PricingCardEight";
|
|
||||||
import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
|
|
||||||
import TestimonialCardTwelve from "@/components/sections/testimonial/TestimonialCardTwelve";
|
import TestimonialCardTwelve from "@/components/sections/testimonial/TestimonialCardTwelve";
|
||||||
import FaqSplitMedia from "@/components/sections/faq/FaqSplitMedia";
|
import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
|
||||||
import ContactText from "@/components/sections/contact/ContactText";
|
import FaqSplitText from "@/components/sections/faq/FaqSplitText";
|
||||||
import FooterBaseCard from "@/components/sections/footer/FooterBaseCard";
|
import FooterCard from "@/components/sections/footer/FooterCard";
|
||||||
import { Zap, Users, TrendingUp, Award } from "lucide-react";
|
import Link from "next/link";
|
||||||
|
import {
|
||||||
const Home = () => {
|
Hammer,
|
||||||
const navItems = [
|
Wrench,
|
||||||
{ name: "Home", id: "/" },
|
Droplet,
|
||||||
{ name: "Portfolio", id: "/portfolio" },
|
Paintbrush,
|
||||||
{ name: "Contact", id: "contact" },
|
Zap,
|
||||||
];
|
MonitorPlay,
|
||||||
|
Armchair,
|
||||||
const features = [
|
Layers,
|
||||||
{
|
Clock,
|
||||||
id: 1,
|
Users,
|
||||||
title: "Lightning Fast Performance", description: "Optimized for speed with advanced caching, lazy loading, and resource optimization. Achieve sub-second page loads.", imageSrc: "https://images.unsplash.com/photo-1517694712202-14dd9538aa97?w=500&h=500&fit=crop&_wi=1"},
|
CheckCircle,
|
||||||
{
|
TrendingUp,
|
||||||
id: 2,
|
Star,
|
||||||
title: "Seamless User Experience", description: "Intuitive interface with smooth animations and responsive design. Works flawlessly on all devices.", imageSrc: "https://images.unsplash.com/photo-1633356122544-f134324ef6db?w=500&h=500&fit=crop&_wi=1"},
|
Facebook,
|
||||||
{
|
Instagram,
|
||||||
id: 3,
|
Phone,
|
||||||
title: "Intelligent Caching", description: "Smart caching strategies that reduce server load and bandwidth usage while improving response times significantly.", imageSrc: "https://images.unsplash.com/photo-1552664730-d307ca884978?w=500&h=500&fit=crop"},
|
} from "lucide-react";
|
||||||
{
|
|
||||||
id: 4,
|
|
||||||
title: "Scalable Infrastructure", description: "Built to handle growth. Scales automatically to meet demand without compromising performance or reliability.", imageSrc: "https://images.unsplash.com/photo-1561070791-2526d30994b5?w=500&h=500&fit=crop"},
|
|
||||||
];
|
|
||||||
|
|
||||||
const plans = [
|
|
||||||
{
|
|
||||||
id: "starter", badge: "Great for Getting Started", price: "$29/mo", subtitle: "Perfect for small projects and prototypes", buttons: [{ text: "Get Started", href: "/contact" }],
|
|
||||||
features: [
|
|
||||||
"Up to 100K monthly requests", "5GB storage", "Basic analytics", "Email support"],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "professional", badge: "Most Popular", badgeIcon: Zap,
|
|
||||||
price: "$79/mo", subtitle: "Ideal for growing businesses", buttons: [{ text: "Start Free Trial", href: "/contact" }],
|
|
||||||
features: [
|
|
||||||
"Up to 1M monthly requests", "100GB storage", "Advanced analytics", "Priority support", "Custom domains"],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "enterprise", badge: "For Scale", price: "Custom", subtitle: "Enterprise-grade performance", buttons: [{ text: "Contact Sales", href: "/contact" }],
|
|
||||||
features: [
|
|
||||||
"Unlimited requests", "Unlimited storage", "Real-time analytics", "24/7 phone support", "Custom integrations", "Dedicated account manager"],
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
const metrics = [
|
|
||||||
{
|
|
||||||
id: "1", icon: TrendingUp,
|
|
||||||
title: "Performance", value: "99.99%"},
|
|
||||||
{
|
|
||||||
id: "2", icon: Zap,
|
|
||||||
title: "Speed", value: "<100ms"},
|
|
||||||
{
|
|
||||||
id: "3", icon: Users,
|
|
||||||
title: "Users", value: "50K+"},
|
|
||||||
{
|
|
||||||
id: "4", icon: Award,
|
|
||||||
title: "Uptime", value: "99.9%"},
|
|
||||||
];
|
|
||||||
|
|
||||||
const testimonials = [
|
|
||||||
{
|
|
||||||
id: "1", name: "Sarah Johnson", imageSrc: "https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=400&h=400&fit=crop"},
|
|
||||||
{
|
|
||||||
id: "2", name: "Michael Chen", imageSrc: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=400&h=400&fit=crop"},
|
|
||||||
{
|
|
||||||
id: "3", name: "Emma Davis", imageSrc: "https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=400&h=400&fit=crop&_wi=1"},
|
|
||||||
{
|
|
||||||
id: "4", name: "James Wilson", imageSrc: "https://images.unsplash.com/photo-1500648767791-00dcc994a43e?w=400&h=400&fit=crop&_wi=1"},
|
|
||||||
];
|
|
||||||
|
|
||||||
const faqs = [
|
|
||||||
{
|
|
||||||
id: "1", title: "How do I get started?", content:
|
|
||||||
"Getting started is easy! Sign up for a free account, choose your plan, and follow our setup guide. You'll be up and running in minutes."},
|
|
||||||
{
|
|
||||||
id: "2", title: "What makes your service fast?", content:
|
|
||||||
"We use advanced caching strategies, CDN distribution, and optimized infrastructure to ensure lightning-fast performance across all regions."},
|
|
||||||
{
|
|
||||||
id: "3", title: "Can I upgrade or downgrade anytime?", content:
|
|
||||||
"Absolutely! You can change your plan at any time. Upgrades take effect immediately, and downgrades apply at the next billing cycle."},
|
|
||||||
{
|
|
||||||
id: "4", title: "What support do you offer?", content:
|
|
||||||
"We provide email support for all plans, priority support for Professional and above, and 24/7 phone support for Enterprise customers."},
|
|
||||||
{
|
|
||||||
id: "5", title: "Is my data secure?", content:
|
|
||||||
"Yes, we use enterprise-grade security with encryption at rest and in transit. All data is backed up daily and complies with industry standards."},
|
|
||||||
{
|
|
||||||
id: "6", title: "Do you offer a free trial?", content:
|
|
||||||
"Yes! We offer a 14-day free trial with full access to all Professional features. No credit card required to get started."},
|
|
||||||
];
|
|
||||||
|
|
||||||
const footerColumns = [
|
|
||||||
{
|
|
||||||
title: "Product", items: [
|
|
||||||
{ label: "Features", href: "#features" },
|
|
||||||
{ label: "Pricing", href: "#pricing" },
|
|
||||||
{ label: "Security", href: "#security" },
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "Company", items: [
|
|
||||||
{ label: "About", href: "/" },
|
|
||||||
{ label: "Blog", href: "/" },
|
|
||||||
{ label: "Careers", href: "/" },
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "Resources", items: [
|
|
||||||
{ label: "Documentation", href: "/" },
|
|
||||||
{ label: "API Reference", href: "/" },
|
|
||||||
{ label: "Support", href: "/" },
|
|
||||||
],
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
|
export default function HomePage() {
|
||||||
return (
|
return (
|
||||||
<ThemeProvider
|
<ThemeProvider
|
||||||
defaultButtonVariant="hover-magnetic"
|
defaultButtonVariant="hover-magnetic"
|
||||||
defaultTextAnimation="entrance-slide"
|
defaultTextAnimation="reveal-blur"
|
||||||
borderRadius="rounded"
|
borderRadius="rounded"
|
||||||
contentWidth="medium"
|
contentWidth="smallMedium"
|
||||||
sizing="medium"
|
sizing="mediumLargeSizeLargeTitles"
|
||||||
background="none"
|
background="noise"
|
||||||
cardStyle="solid"
|
cardStyle="solid"
|
||||||
primaryButtonStyle="gradient"
|
primaryButtonStyle="primary-glow"
|
||||||
secondaryButtonStyle="glass"
|
secondaryButtonStyle="glass"
|
||||||
headingFontWeight="bold"
|
headingFontWeight="bold"
|
||||||
>
|
>
|
||||||
<NavbarLayoutFloatingOverlay
|
<div id="nav" data-section="nav">
|
||||||
navItems={navItems}
|
<NavbarStyleCentered
|
||||||
brandName="Fast"
|
brandName="Earl Boys Services"
|
||||||
button={{ text: "Get Started", href: "contact" }}
|
navItems={[
|
||||||
/>
|
{ name: "Home", id: "home" },
|
||||||
<div id="hero" data-section="hero">
|
{ name: "Services", id: "services" },
|
||||||
<HeroLogo
|
{ name: "About", id: "about" },
|
||||||
logoText="Fast"
|
{ name: "Portfolio", id: "portfolio" },
|
||||||
description="Optimized performance and lightning-fast load times for your website"
|
{ name: "Contact", id: "contact" },
|
||||||
buttons={[
|
|
||||||
{ text: "Start Free Trial", href: "/contact" },
|
|
||||||
{ text: "View Docs", href: "/" },
|
|
||||||
]}
|
]}
|
||||||
imageSrc="https://images.unsplash.com/photo-1517694712202-14dd9538aa97?w=1200&h=600&fit=crop"
|
button={{
|
||||||
imageAlt="Fast performance illustration"
|
text: "Call Now",
|
||||||
|
href: "tel:804-938-0669",
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div id="features" data-section="features">
|
|
||||||
<div className="py-20">
|
<div id="hero" data-section="hero">
|
||||||
<FeatureCardSeven
|
<HeroBillboardCarousel
|
||||||
title="Why Choose Our Platform"
|
title="Professional Home Services in Richmond, VA"
|
||||||
description="We deliver exceptional performance and speed optimization for your business"
|
description="Expert solutions for all your home improvement, repair, and maintenance needs. 10+ services to transform your home. Call 804-938-0669"
|
||||||
features={features}
|
tag="Earl Boys Services"
|
||||||
animationType="slide-up"
|
tagIcon={Hammer}
|
||||||
textboxLayout="default"
|
tagAnimation="slide-up"
|
||||||
useInvertedBackground={false}
|
background={{ variant: "plain" }}
|
||||||
/>
|
mediaItems={[
|
||||||
</div>
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/young-cute-family-repairs-room_1157-24897.jpg?_wi=1",
|
||||||
|
imageAlt: "Professional home services team",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721573.jpg?_wi=1",
|
||||||
|
imageAlt: "Expert plumbing services",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-painting-wall-home_23-2149098981.jpg?_wi=1",
|
||||||
|
imageAlt: "Professional painting services",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/woman-electrician-checks-switchboard-tablet-night-shift-smart-service_169016-70936.jpg?_wi=1",
|
||||||
|
imageAlt: "Licensed electrical work",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/mechanics-checking-planning-workshop_329181-11868.jpg?_wi=1",
|
||||||
|
imageAlt: "General maintenance services",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/circular-saw-carpenter-using-circular-saw-wood_169016-17039.jpg?_wi=1",
|
||||||
|
imageAlt: "Professional flooring installation",
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
buttons={[
|
||||||
|
{
|
||||||
|
text: "Call Now: 804-938-0669",
|
||||||
|
href: "tel:804-938-0669",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: "Book a Service",
|
||||||
|
href: "contact",
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
buttonAnimation="slide-up"
|
||||||
|
ariaLabel="Hero section for Earl Boys Services"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div id="metrics" data-section="metrics">
|
|
||||||
<div className="py-20">
|
<div id="services-home" data-section="services-home">
|
||||||
<MetricCardThree
|
<FeatureCardTwentyFive
|
||||||
title="Our Performance Metrics"
|
features={[
|
||||||
description="Industry-leading uptime and speed performance"
|
{
|
||||||
metrics={metrics}
|
title: "Plumbing Services",
|
||||||
animationType="slide-up"
|
description: "Expert plumbing repairs, installations, and maintenance for all your home water systems.",
|
||||||
textboxLayout="default"
|
icon: Droplet,
|
||||||
useInvertedBackground={false}
|
mediaItems: [
|
||||||
/>
|
{
|
||||||
</div>
|
imageSrc: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721573.jpg?_wi=2",
|
||||||
</div>
|
imageAlt: "Professional plumbing work",
|
||||||
<div id="pricing" data-section="pricing">
|
},
|
||||||
<div className="py-20">
|
{
|
||||||
<PricingCardEight
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-receiving-box_23-2149103401.jpg?_wi=1",
|
||||||
title="Simple, Transparent Pricing"
|
imageAlt: "Plumbing project completed",
|
||||||
description="Choose the perfect plan for your needs"
|
},
|
||||||
plans={plans}
|
],
|
||||||
animationType="slide-up"
|
},
|
||||||
textboxLayout="default"
|
{
|
||||||
useInvertedBackground={false}
|
title: "Painting Services",
|
||||||
/>
|
description: "Interior and exterior painting with premium finishes for residential and commercial spaces.",
|
||||||
</div>
|
icon: Paintbrush,
|
||||||
|
mediaItems: [
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-painting-wall-home_23-2149098981.jpg?_wi=2",
|
||||||
|
imageAlt: "Professional painting service",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-man-choosing-color_23-2148903521.jpg?_wi=1",
|
||||||
|
imageAlt: "Painting transformation",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Electrical Work",
|
||||||
|
description: "Licensed electrical services including installations, repairs, and safety inspections.",
|
||||||
|
icon: Zap,
|
||||||
|
mediaItems: [
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/woman-electrician-checks-switchboard-tablet-night-shift-smart-service_169016-70936.jpg?_wi=2",
|
||||||
|
imageAlt: "Professional electrical work",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/young-couple-moving-new-home_23-2149242082.jpg?_wi=1",
|
||||||
|
imageAlt: "Electrical project completed",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Wall Mounting",
|
||||||
|
description: "Professional TV mounting, shelving installation, and wall customization services.",
|
||||||
|
icon: MonitorPlay,
|
||||||
|
mediaItems: [
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-builder-men-with-smartphones_23-2148751993.jpg?_wi=1",
|
||||||
|
imageAlt: "Professional wall mounting",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-receiving-box_23-2149103401.jpg?_wi=2",
|
||||||
|
imageAlt: "Wall mounting installation",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Furniture Assembly",
|
||||||
|
description: "Quick and efficient furniture assembly for residential and commercial installations.",
|
||||||
|
icon: Armchair,
|
||||||
|
mediaItems: [
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-hitting-nail-by-hammer_329181-3740.jpg?_wi=1",
|
||||||
|
imageAlt: "Professional furniture assembly",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-man-choosing-color_23-2148903521.jpg?_wi=2",
|
||||||
|
imageAlt: "Furniture installation completed",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Flooring Installation",
|
||||||
|
description: "Expert flooring installation for hardwood, tile, laminate, and other materials.",
|
||||||
|
icon: Layers,
|
||||||
|
mediaItems: [
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/circular-saw-carpenter-using-circular-saw-wood_169016-17039.jpg?_wi=2",
|
||||||
|
imageAlt: "Professional flooring installation",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/young-couple-moving-new-home_23-2149242082.jpg?_wi=2",
|
||||||
|
imageAlt: "Flooring project transformation",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
animationType="slide-up"
|
||||||
|
title="Our Expert Services"
|
||||||
|
description="Comprehensive home services tailored to your needs. From plumbing to painting, we handle it all with professional excellence."
|
||||||
|
tag="10 Services"
|
||||||
|
tagIcon={Wrench}
|
||||||
|
textboxLayout="default"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
buttons={[
|
||||||
|
{
|
||||||
|
text: "View All Services",
|
||||||
|
href: "/services",
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
buttonAnimation="slide-up"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="testimonials" data-section="testimonials">
|
<div id="testimonials" data-section="testimonials">
|
||||||
<div className="py-20">
|
<TestimonialCardTwelve
|
||||||
<TestimonialCardTwelve
|
testimonials={[
|
||||||
testimonials={testimonials}
|
{
|
||||||
cardTitle="Join 50,000+ satisfied customers who trust our platform"
|
id: "1",
|
||||||
cardTag="Customer Testimonials"
|
name: "Sarah Johnson",
|
||||||
cardAnimation="slide-up"
|
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiley-businessman-close-up_23-2148746290.jpg",
|
||||||
useInvertedBackground={false}
|
imageAlt: "Sarah Johnson testimonial",
|
||||||
/>
|
},
|
||||||
</div>
|
{
|
||||||
|
id: "2",
|
||||||
|
name: "Michael Chen",
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/happy-man-with-thumbs-up_1187-3144.jpg",
|
||||||
|
imageAlt: "Michael Chen testimonial",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "3",
|
||||||
|
name: "Emily Rodriguez",
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/headshot-euphoric-successful-businesswoman_273609-13789.jpg",
|
||||||
|
imageAlt: "Emily Rodriguez testimonial",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "4",
|
||||||
|
name: "David Williams",
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/young-man-holding-house-model-t-shirt-jacket-cap-looking-amazed-front-view_176474-57861.jpg",
|
||||||
|
imageAlt: "David Williams testimonial",
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
cardTitle="Over 2,000+ satisfied customers trust Earl Boys Services for their home improvement needs"
|
||||||
|
cardTag="Customer Reviews"
|
||||||
|
cardTagIcon={Star}
|
||||||
|
cardAnimation="slide-up"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div id="metrics" data-section="metrics">
|
||||||
|
<MetricCardOne
|
||||||
|
metrics={[
|
||||||
|
{
|
||||||
|
id: "1",
|
||||||
|
value: "15",
|
||||||
|
title: "Years",
|
||||||
|
description: "In business serving Richmond VA",
|
||||||
|
icon: Clock,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "2",
|
||||||
|
value: "2000",
|
||||||
|
title: "Customers",
|
||||||
|
description: "Satisfied homeowners and businesses",
|
||||||
|
icon: Users,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "3",
|
||||||
|
value: "98",
|
||||||
|
title: "Percent",
|
||||||
|
description: "Customer satisfaction rating",
|
||||||
|
icon: CheckCircle,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "4",
|
||||||
|
value: "10",
|
||||||
|
title: "Services",
|
||||||
|
description: "Complete home service solutions",
|
||||||
|
icon: Wrench,
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
animationType="slide-up"
|
||||||
|
gridVariant="uniform-all-items-equal"
|
||||||
|
title="By The Numbers"
|
||||||
|
description="Earl Boys Services is Richmond's trusted home services leader with proven results."
|
||||||
|
tag="Our Success"
|
||||||
|
tagIcon={TrendingUp}
|
||||||
|
textboxLayout="default"
|
||||||
|
useInvertedBackground={true}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="faq" data-section="faq">
|
<div id="faq" data-section="faq">
|
||||||
<div className="py-20">
|
<FaqSplitText
|
||||||
<FaqSplitMedia
|
faqs={[
|
||||||
faqs={faqs}
|
{
|
||||||
imageSrc="https://images.unsplash.com/photo-1552664730-d307ca884978?w=800&h=600&fit=crop"
|
id: "1",
|
||||||
imageAlt="FAQ support"
|
title: "What areas of Richmond do you serve?",
|
||||||
title="Frequently Asked Questions"
|
content: "We proudly serve all of Richmond, VA and surrounding areas. Our service team covers residential and commercial properties throughout the region.",
|
||||||
description="Find answers to common questions about our service"
|
},
|
||||||
textboxLayout="default"
|
{
|
||||||
faqsAnimation="slide-up"
|
id: "2",
|
||||||
mediaAnimation="slide-up"
|
title: "How quickly can you respond to service requests?",
|
||||||
useInvertedBackground={false}
|
content: "We typically respond to service requests within 24 hours. For urgent issues, call us at 804-938-0669 for immediate assistance.",
|
||||||
/>
|
},
|
||||||
</div>
|
{
|
||||||
</div>
|
id: "3",
|
||||||
<div id="contact" data-section="contact">
|
title: "Do you offer warranty on your work?",
|
||||||
<div className="py-20">
|
content: "Yes! We stand behind our workmanship with comprehensive warranties on all services. Details vary by service type.",
|
||||||
<ContactText
|
},
|
||||||
text="Ready to optimize your website performance? Start your free trial today and experience the difference."
|
{
|
||||||
animationType="entrance-slide"
|
id: "4",
|
||||||
buttons={[
|
title: "Are you licensed and insured?",
|
||||||
{ text: "Start Free Trial", href: "/contact" },
|
content: "Absolutely. Earl Boys Services is fully licensed, insured, and bonded. We maintain all required certifications for electrical, plumbing, and other specialized services.",
|
||||||
{ text: "Schedule Demo", href: "/" },
|
},
|
||||||
]}
|
{
|
||||||
background={{ variant: "plain" }}
|
id: "5",
|
||||||
useInvertedBackground={false}
|
title: "What payment methods do you accept?",
|
||||||
/>
|
content: "We accept cash, check, credit cards, and digital payments. We also offer financing options for larger projects.",
|
||||||
</div>
|
},
|
||||||
|
{
|
||||||
|
id: "6",
|
||||||
|
title: "Do you provide free estimates?",
|
||||||
|
content: "Yes! We provide free, no-obligation estimates for all services. Contact us to schedule your consultation.",
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
sideTitle="Frequently Asked Questions"
|
||||||
|
sideDescription="Find answers to common questions about our home services, pricing, and availability."
|
||||||
|
textPosition="left"
|
||||||
|
faqsAnimation="slide-up"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
animationType="smooth"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="footer" data-section="footer">
|
<div id="footer" data-section="footer">
|
||||||
<FooterBaseCard
|
<FooterCard
|
||||||
logoText="Fast"
|
logoText="Earl Boys Services"
|
||||||
columns={footerColumns}
|
copyrightText="© 2025 Earl Boys Services LLC. All rights reserved. Licensed & Insured."
|
||||||
copyrightText="© 2025 Fast. All rights reserved."
|
socialLinks={[
|
||||||
|
{
|
||||||
|
icon: Facebook,
|
||||||
|
href: "https://facebook.com",
|
||||||
|
ariaLabel: "Facebook",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Instagram,
|
||||||
|
href: "https://instagram.com",
|
||||||
|
ariaLabel: "Instagram",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Phone,
|
||||||
|
href: "tel:804-938-0669",
|
||||||
|
ariaLabel: "Call us",
|
||||||
|
},
|
||||||
|
]}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
);
|
);
|
||||||
};
|
}
|
||||||
|
|
||||||
export default Home;
|
|
||||||
@@ -1,136 +1,187 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||||
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
|
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
|
||||||
|
import HeroBillboardCarousel from "@/components/sections/hero/HeroBillboardCarousel";
|
||||||
import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
|
import FeatureCardTwentyFive from "@/components/sections/feature/FeatureCardTwentyFive";
|
||||||
import TeamCardEleven from "@/components/sections/team/TeamCardEleven";
|
import FooterCard from "@/components/sections/footer/FooterCard";
|
||||||
import { Briefcase, Code, Palette, Users } from "lucide-react";
|
import {
|
||||||
|
Wrench,
|
||||||
const Portfolio = () => {
|
Paintbrush,
|
||||||
const navItems = [
|
Droplet,
|
||||||
{ name: "Home", id: "/" },
|
Zap,
|
||||||
{ name: "Portfolio", id: "/portfolio" },
|
MonitorPlay,
|
||||||
{ name: "Contact", id: "contact" },
|
Facebook,
|
||||||
];
|
Instagram,
|
||||||
|
Phone,
|
||||||
const projects = [
|
} from "lucide-react";
|
||||||
{
|
|
||||||
title: "Brand Identity Design", description: "Complete visual identity system including logo, color palette, and brand guidelines.", icon: Palette,
|
|
||||||
mediaItems: [
|
|
||||||
{
|
|
||||||
imageSrc: "https://images.unsplash.com/photo-1561070791-2526d30994b5?w=500&h=500&fit=crop&_wi=1", imageAlt: "Brand design mockup"},
|
|
||||||
{
|
|
||||||
imageSrc: "https://images.unsplash.com/photo-1543632835-a1bf4ab86fef?w=500&h=500&fit=crop", imageAlt: "Color palette exploration"},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "Web Application Development", description: "Full-stack web application with responsive design and modern architecture.", icon: Code,
|
|
||||||
mediaItems: [
|
|
||||||
{
|
|
||||||
imageSrc: "https://images.unsplash.com/photo-1517694712202-14dd9538aa97?w=500&h=500&fit=crop&_wi=2", imageAlt: "Web application interface"},
|
|
||||||
{
|
|
||||||
imageSrc: "https://images.unsplash.com/photo-1633356122544-f134324ef6db?w=500&h=500&fit=crop&_wi=2", imageAlt: "Mobile responsive design"},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "Strategic Branding", description: "Comprehensive branding strategy and positioning for market leadership.", icon: Briefcase,
|
|
||||||
mediaItems: [
|
|
||||||
{
|
|
||||||
imageSrc: "https://images.unsplash.com/photo-1552664730-d307ca884978?w=500&h=500&fit=crop&_wi=1", imageAlt: "Strategy workshop"},
|
|
||||||
{
|
|
||||||
imageSrc: "https://images.unsplash.com/photo-1552664730-d307ca884978?w=500&h=500&fit=crop&_wi=2", imageAlt: "Marketing materials"},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "User Experience Design", description: "Intuitive user interfaces designed with user research and testing.", icon: Palette,
|
|
||||||
mediaItems: [
|
|
||||||
{
|
|
||||||
imageSrc: "https://images.unsplash.com/photo-1561070791-2526d30994b5?w=500&h=500&fit=crop&_wi=2", imageAlt: "UX wireframes"},
|
|
||||||
{
|
|
||||||
imageSrc: "https://images.unsplash.com/photo-1561070791-2526d30994b5?w=500&h=500&fit=crop&_wi=3", imageAlt: "Design iterations"},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
const teamMembers = [
|
|
||||||
{
|
|
||||||
id: "leadership", groupTitle: "Leadership", members: [
|
|
||||||
{
|
|
||||||
id: "1", title: "Sarah Johnson", subtitle: "Creative Director", detail: "sarah.johnson@company.com", imageSrc: "https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=400&h=400&fit=crop&_wi=1", imageAlt: "Sarah Johnson"},
|
|
||||||
{
|
|
||||||
id: "2", title: "Michael Chen", subtitle: "Lead Strategist", detail: "michael.chen@company.com", imageSrc: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=400&h=400&fit=crop&_wi=1", imageAlt: "Michael Chen"},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "design", groupTitle: "Design Team", members: [
|
|
||||||
{
|
|
||||||
id: "3", title: "Emma Davis", subtitle: "UI/UX Designer", detail: "emma.davis@company.com", imageSrc: "https://images.unsplash.com/photo-1438761681033-6461ffad8d80?w=400&h=400&fit=crop&_wi=2", imageAlt: "Emma Davis"},
|
|
||||||
{
|
|
||||||
id: "4", title: "James Wilson", subtitle: "Brand Designer", detail: "james.wilson@company.com", imageSrc: "https://images.unsplash.com/photo-1500648767791-00dcc994a43e?w=400&h=400&fit=crop&_wi=2", imageAlt: "James Wilson"},
|
|
||||||
{
|
|
||||||
id: "5", title: "Sophie Martin", subtitle: "Graphic Designer", detail: "sophie.martin@company.com", imageSrc: "https://images.unsplash.com/photo-1517849845537-1d51a20414de?w=400&h=400&fit=crop", imageAlt: "Sophie Martin"},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "development", groupTitle: "Development Team", members: [
|
|
||||||
{
|
|
||||||
id: "6", title: "Alex Rodriguez", subtitle: "Full Stack Developer", detail: "alex.rodriguez@company.com", imageSrc: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=400&h=400&fit=crop&_wi=2", imageAlt: "Alex Rodriguez"},
|
|
||||||
{
|
|
||||||
id: "7", title: "Lisa Anderson", subtitle: "Frontend Developer", detail: "lisa.anderson@company.com", imageSrc: "https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=400&h=400&fit=crop&_wi=2", imageAlt: "Lisa Anderson"},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
|
export default function PortfolioPage() {
|
||||||
return (
|
return (
|
||||||
<ThemeProvider
|
<ThemeProvider
|
||||||
defaultButtonVariant="hover-magnetic"
|
defaultButtonVariant="hover-magnetic"
|
||||||
defaultTextAnimation="entrance-slide"
|
defaultTextAnimation="reveal-blur"
|
||||||
borderRadius="rounded"
|
borderRadius="rounded"
|
||||||
contentWidth="medium"
|
contentWidth="smallMedium"
|
||||||
sizing="medium"
|
sizing="mediumLargeSizeLargeTitles"
|
||||||
background="none"
|
background="noise"
|
||||||
cardStyle="solid"
|
cardStyle="solid"
|
||||||
primaryButtonStyle="gradient"
|
primaryButtonStyle="primary-glow"
|
||||||
secondaryButtonStyle="glass"
|
secondaryButtonStyle="glass"
|
||||||
headingFontWeight="bold"
|
headingFontWeight="bold"
|
||||||
>
|
>
|
||||||
<NavbarLayoutFloatingOverlay
|
{/* Navbar */}
|
||||||
navItems={navItems}
|
<div id="nav" data-section="nav">
|
||||||
brandName="Portfolio"
|
<NavbarStyleCentered
|
||||||
button={{ text: "Contact Us", href: "contact" }}
|
navItems={[
|
||||||
/>
|
{ name: "Home", id: "/" },
|
||||||
<div id="portfolio" data-section="portfolio">
|
{ name: "Services", id: "/services" },
|
||||||
<div className="py-20">
|
{ name: "About", id: "/about" },
|
||||||
<FeatureCardTwentyFive
|
{ name: "Portfolio", id: "/portfolio" },
|
||||||
title="Featured Projects"
|
{ name: "Contact", id: "/contact" },
|
||||||
description="Explore our latest work and successful client engagements"
|
]}
|
||||||
features={projects.map((project) => ({
|
button={{
|
||||||
...project,
|
text: "Call Now",
|
||||||
mediaItems: [
|
href: "tel:804-938-0669",
|
||||||
project.mediaItems[0],
|
}}
|
||||||
project.mediaItems[1] || project.mediaItems[0],
|
brandName="Earl Boys Services"
|
||||||
],
|
/>
|
||||||
}))}
|
|
||||||
animationType="slide-up"
|
|
||||||
textboxLayout="default"
|
|
||||||
useInvertedBackground={false}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div id="team" data-section="team">
|
|
||||||
<div className="py-20">
|
{/* Portfolio Hero Section */}
|
||||||
<TeamCardEleven
|
<div id="portfolio-hero" data-section="portfolio-hero">
|
||||||
title="Our Team"
|
<HeroBillboardCarousel
|
||||||
description="Meet the talented professionals behind our success"
|
title="Our Portfolio"
|
||||||
groups={teamMembers}
|
description="Explore our collection of completed projects showcasing professional home services excellence across Richmond, VA."
|
||||||
animationType="slide-up"
|
tag="Earl Boys Services"
|
||||||
textboxLayout="default"
|
tagIcon={Wrench}
|
||||||
useInvertedBackground={false}
|
tagAnimation="slide-up"
|
||||||
/>
|
background={{ variant: "plain" }}
|
||||||
</div>
|
mediaItems={[
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-receiving-box_23-2149103401.jpg?_wi=6",
|
||||||
|
imageAlt: "Before after home renovation transformation",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-man-choosing-color_23-2148903521.jpg?_wi=5",
|
||||||
|
imageAlt: "Kitchen renovation before after transformation",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/young-couple-moving-new-home_23-2149242082.jpg?_wi=5",
|
||||||
|
imageAlt: "Room renovation before after completion",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721573.jpg?_wi=5",
|
||||||
|
imageAlt: "Professional plumbing work",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-painting-wall-home_23-2149098981.jpg?_wi=4",
|
||||||
|
imageAlt: "Professional painting service",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/woman-electrician-checks-switchboard-tablet-night-shift-smart-service_169016-70936.jpg?_wi=5",
|
||||||
|
imageAlt: "Professional electrician electrical work",
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
buttons={[
|
||||||
|
{
|
||||||
|
text: "View Services",
|
||||||
|
href: "/services",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: "Get a Quote",
|
||||||
|
href: "tel:804-938-0669",
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
buttonAnimation="slide-up"
|
||||||
|
ariaLabel="Portfolio section for Earl Boys Services"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Featured Projects Section */}
|
||||||
|
<div id="projects" data-section="projects">
|
||||||
|
<FeatureCardTwentyFive
|
||||||
|
title="Featured Projects"
|
||||||
|
description="A selection of our most successful home improvement and repair projects completed with professional excellence and customer satisfaction."
|
||||||
|
tag="Project Showcase"
|
||||||
|
tagIcon={Wrench}
|
||||||
|
features={[
|
||||||
|
{
|
||||||
|
title: "Plumbing Installation",
|
||||||
|
description: "Complete bathroom and kitchen plumbing system installation with modern fixtures and premium finishes.",
|
||||||
|
icon: Droplet,
|
||||||
|
mediaItems: [
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/plumbing-professional-doing-his-job_23-2150721573.jpg?_wi=6",
|
||||||
|
imageAlt: "Professional plumbing work",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-man-receiving-box_23-2149103401.jpg?_wi=7",
|
||||||
|
imageAlt: "Project completed successfully",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Interior Painting",
|
||||||
|
description: "Professional interior painting project transforming living spaces with fresh color and premium finish.",
|
||||||
|
icon: Paintbrush,
|
||||||
|
mediaItems: [
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-woman-painting-wall-home_23-2149098981.jpg?_wi=5",
|
||||||
|
imageAlt: "Professional painting service",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-man-choosing-color_23-2148903521.jpg?_wi=6",
|
||||||
|
imageAlt: "Color selection and painting results",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "Electrical Upgrades",
|
||||||
|
description: "Licensed electrical work including panel upgrades, outlet installation, and safety inspections for modern homes.",
|
||||||
|
icon: Zap,
|
||||||
|
mediaItems: [
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/woman-electrician-checks-switchboard-tablet-night-shift-smart-service_169016-70936.jpg?_wi=6",
|
||||||
|
imageAlt: "Professional electrician electrical work",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
imageSrc: "http://img.b2bpic.net/free-photo/light-switches-near-metal-door-handle-stairs-lighting-control_169016-69323.jpg",
|
||||||
|
imageAlt: "Professional electrical installation",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
animationType="slide-up"
|
||||||
|
textboxLayout="default"
|
||||||
|
useInvertedBackground={false}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Footer */}
|
||||||
|
<div id="footer" data-section="footer">
|
||||||
|
<FooterCard
|
||||||
|
logoText="Earl Boys Services"
|
||||||
|
copyrightText="© 2025 Earl Boys Services LLC. All rights reserved. Licensed & Insured."
|
||||||
|
socialLinks={[
|
||||||
|
{
|
||||||
|
icon: Facebook,
|
||||||
|
href: "https://facebook.com",
|
||||||
|
ariaLabel: "Facebook",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Instagram,
|
||||||
|
href: "https://instagram.com",
|
||||||
|
ariaLabel: "Instagram",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: Phone,
|
||||||
|
href: "tel:804-938-0669",
|
||||||
|
ariaLabel: "Call us",
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</ThemeProvider>
|
</ThemeProvider>
|
||||||
);
|
);
|
||||||
};
|
}
|
||||||
|
|
||||||
export default Portfolio;
|
|
||||||
Reference in New Issue
Block a user