Compare commits
6 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 8578ec4372 | |||
| b22d54e63b | |||
| 832267b692 | |||
| 92cbeb68c5 | |||
| 5cb275a67a | |||
| e57a15dcf6 |
198
src/app/call-us/page.tsx
Normal file
198
src/app/call-us/page.tsx
Normal file
@@ -0,0 +1,198 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
|
||||
import FooterBase from "@/components/sections/footer/FooterBase";
|
||||
import { Phone, Mail, MapPin, Clock } from "lucide-react";
|
||||
|
||||
export default function CallUsPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="small"
|
||||
sizing="large"
|
||||
background="circleGradient"
|
||||
cardStyle="gradient-mesh"
|
||||
primaryButtonStyle="double-inset"
|
||||
secondaryButtonStyle="solid"
|
||||
headingFontWeight="extrabold"
|
||||
>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
{ name: "Free Quote", id: "/quote" },
|
||||
{ name: "Call Us", id: "/call-us" },
|
||||
]}
|
||||
brandName="Go To Gophers"
|
||||
bottomLeftText="Ready to transform your landscape"
|
||||
bottomRightText="hello@gototophers.com"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="min-h-screen bg-gradient-to-br from-slate-50 to-slate-100 py-20 px-4">
|
||||
<div className="max-w-4xl mx-auto">
|
||||
{/* Header */}
|
||||
<div className="text-center mb-12">
|
||||
<h1 className="text-5xl md:text-6xl font-bold text-gray-900 mb-4">
|
||||
Get in Touch
|
||||
</h1>
|
||||
<p className="text-xl text-gray-600">
|
||||
We're here to help! Reach out to us today for your landscaping
|
||||
needs.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Contact Information Cards */}
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6 mb-12">
|
||||
{/* Phone */}
|
||||
<div className="bg-white rounded-xl shadow-lg p-8 hover:shadow-xl transition-shadow">
|
||||
<div className="flex items-center mb-4">
|
||||
<Phone className="w-8 h-8 text-red-500 mr-3" />
|
||||
<h2 className="text-2xl font-bold text-gray-900">Call Us</h2>
|
||||
</div>
|
||||
<p className="text-gray-600 mb-4">
|
||||
Speak directly with our team about your project.
|
||||
</p>
|
||||
<a
|
||||
href="tel:6125321875"
|
||||
className="inline-block bg-gradient-to-r from-red-500 to-red-600 hover:from-red-600 hover:to-red-700 text-white font-bold py-3 px-6 rounded-lg transition-all duration-200 transform hover:scale-105"
|
||||
>
|
||||
(612) 532-1875
|
||||
</a>
|
||||
<p className="text-sm text-gray-500 mt-4">
|
||||
Available Monday - Friday, 8am - 6pm
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Email */}
|
||||
<div className="bg-white rounded-xl shadow-lg p-8 hover:shadow-xl transition-shadow">
|
||||
<div className="flex items-center mb-4">
|
||||
<Mail className="w-8 h-8 text-red-500 mr-3" />
|
||||
<h2 className="text-2xl font-bold text-gray-900">Email Us</h2>
|
||||
</div>
|
||||
<p className="text-gray-600 mb-4">
|
||||
Send us an email and we'll get back to you within 24 hours.
|
||||
</p>
|
||||
<a
|
||||
href="mailto:gotogopher@gmail.com"
|
||||
className="inline-block bg-gradient-to-r from-red-500 to-red-600 hover:from-red-600 hover:to-red-700 text-white font-bold py-3 px-6 rounded-lg transition-all duration-200 transform hover:scale-105 break-all"
|
||||
>
|
||||
gotogopher@gmail.com
|
||||
</a>
|
||||
<p className="text-sm text-gray-500 mt-4">
|
||||
Email response: 24 hours or less
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Additional Information */}
|
||||
<div className="bg-white rounded-xl shadow-lg p-8 md:p-12">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||||
{/* Hours */}
|
||||
<div>
|
||||
<div className="flex items-center mb-4">
|
||||
<Clock className="w-6 h-6 text-red-500 mr-2" />
|
||||
<h3 className="text-xl font-bold text-gray-900">
|
||||
Business Hours
|
||||
</h3>
|
||||
</div>
|
||||
<ul className="space-y-2 text-gray-600">
|
||||
<li>Monday - Friday: 8:00 AM - 6:00 PM</li>
|
||||
<li>Saturday: 9:00 AM - 4:00 PM</li>
|
||||
<li>Sunday: Closed</li>
|
||||
<li className="pt-2 font-semibold text-gray-900">
|
||||
Emergency services available 24/7
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{/* Why Call Us */}
|
||||
<div>
|
||||
<h3 className="text-xl font-bold text-gray-900 mb-4">
|
||||
Why Contact Us?
|
||||
</h3>
|
||||
<ul className="space-y-2 text-gray-600">
|
||||
<li>✓ Free consultations and quotes</li>
|
||||
<li>✓ Experienced professionals</li>
|
||||
<li>✓ Fast response times</li>
|
||||
<li>✓ Satisfaction guaranteed</li>
|
||||
<li>✓ Custom solutions for your needs</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Quick Actions */}
|
||||
<div className="mt-12 bg-gradient-to-r from-red-500 to-red-600 rounded-xl shadow-lg p-8 md:p-12 text-center text-white">
|
||||
<h2 className="text-3xl font-bold mb-4">
|
||||
Ready to Transform Your Landscape?
|
||||
</h2>
|
||||
<p className="text-lg mb-6 opacity-90">
|
||||
Don't wait! Contact Go To Gophers today and let's discuss your
|
||||
landscaping vision.
|
||||
</p>
|
||||
<div className="flex flex-col md:flex-row gap-4 justify-center">
|
||||
<a
|
||||
href="tel:6125321875"
|
||||
className="inline-block bg-white text-red-600 font-bold py-3 px-8 rounded-lg hover:bg-gray-100 transition-colors"
|
||||
>
|
||||
Call Now
|
||||
</a>
|
||||
<a
|
||||
href="mailto:gotogopher@gmail.com"
|
||||
className="inline-block bg-white text-red-600 font-bold py-3 px-8 rounded-lg hover:bg-gray-100 transition-colors"
|
||||
>
|
||||
Email Us
|
||||
</a>
|
||||
<a
|
||||
href="/quote"
|
||||
className="inline-block bg-transparent border-2 border-white text-white font-bold py-3 px-8 rounded-lg hover:bg-white hover:text-red-600 transition-colors"
|
||||
>
|
||||
Get Free Quote
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
logoText="Go To Gophers"
|
||||
copyrightText="© 2025 Go To Gophers Landscaping. All rights reserved."
|
||||
columns={[
|
||||
{
|
||||
title: "Services", items: [
|
||||
{ label: "Landscape Design", href: "/#services" },
|
||||
{ label: "Lawn Maintenance", href: "/#services" },
|
||||
{ label: "Irrigation Systems", href: "/#services" },
|
||||
{ label: "Seasonal Care", href: "/#services" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "/#about" },
|
||||
{ label: "Our Team", href: "/#about" },
|
||||
{ label: "Testimonials", href: "/#testimonials" },
|
||||
{ label: "Contact", href: "/#contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal", items: [
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Terms of Service", href: "#" },
|
||||
{ label: "Warranty", href: "#" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
@@ -29,11 +29,13 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "Home", id: "home" },
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
{ name: "Free Quote", id: "/quote" },
|
||||
{ name: "Call Us", id: "/call-us" },
|
||||
]}
|
||||
brandName="Go To Gophers"
|
||||
bottomLeftText="Ready to transform your landscape"
|
||||
@@ -52,7 +54,7 @@ export default function LandingPage() {
|
||||
imageSrc="http://img.b2bpic.net/free-photo/stylish-caucasian-woman-trendy-panama-waist-neon-bag-roof-bangkok-with-mobile-phone_343596-30.jpg"
|
||||
imageAlt="Beautiful landscape design"
|
||||
buttons={[
|
||||
{ text: "Get Your Free Quote", href: "contact" },
|
||||
{ text: "Get Your Free Quote", href: "/quote" },
|
||||
{ text: "View Our Work", href: "services" },
|
||||
]}
|
||||
buttonAnimation="slide-up"
|
||||
@@ -82,23 +84,19 @@ export default function LandingPage() {
|
||||
tagAnimation="slide-up"
|
||||
features={[
|
||||
{
|
||||
id: "01", title: "Landscape Design", description: "Custom designs that blend aesthetics with functionality. We create outdoor spaces that reflect your style and enhance your property value.", imageSrc: "http://img.b2bpic.net/free-photo/path-way_74190-2125.jpg?_wi=1", imageAlt: "Landscape design"
|
||||
},
|
||||
id: "01", title: "Landscape Design", description: "Custom designs that blend aesthetics with functionality. We create outdoor spaces that reflect your style and enhance your property value.", imageSrc: "http://img.b2bpic.net/free-photo/path-way_74190-2125.jpg?_wi=1", imageAlt: "Landscape design"},
|
||||
{
|
||||
id: "02", title: "Lawn Maintenance", description: "Regular maintenance keeps your lawn healthy and vibrant. Our team handles mowing, trimming, aeration, and seasonal care.", imageSrc: "http://img.b2bpic.net/free-photo/crop-woman-digging-grass-up_23-2147714901.jpg?_wi=1", imageAlt: "Lawn maintenance"
|
||||
},
|
||||
id: "02", title: "Lawn Maintenance", description: "Regular maintenance keeps your lawn healthy and vibrant. Our team handles mowing, trimming, aeration, and seasonal care.", imageSrc: "http://img.b2bpic.net/free-photo/crop-woman-digging-grass-up_23-2147714901.jpg?_wi=1", imageAlt: "Lawn maintenance"},
|
||||
{
|
||||
id: "03", title: "Irrigation Systems", description: "Smart irrigation solutions that keep your plants thriving while conserving water. Installation, repair, and maintenance available.", imageSrc: "http://img.b2bpic.net/free-photo/closeup-selective-focus-shot-automatic-watering-system_181624-20614.jpg?_wi=1", imageAlt: "Irrigation system"
|
||||
},
|
||||
id: "03", title: "Irrigation Systems", description: "Smart irrigation solutions that keep your plants thriving while conserving water. Installation, repair, and maintenance available.", imageSrc: "http://img.b2bpic.net/free-photo/closeup-selective-focus-shot-automatic-watering-system_181624-20614.jpg?_wi=1", imageAlt: "Irrigation system"},
|
||||
{
|
||||
id: "04", title: "Seasonal Care", description: "Spring cleanups, fall leaf removal, and winter preparation. We keep your landscape looking its best year-round.", imageSrc: "http://img.b2bpic.net/free-photo/path-way_74190-2125.jpg?_wi=2", imageAlt: "Seasonal landscaping"
|
||||
},
|
||||
id: "04", title: "Seasonal Care", description: "Spring cleanups, fall leaf removal, and winter preparation. We keep your landscape looking its best year-round.", imageSrc: "http://img.b2bpic.net/free-photo/path-way_74190-2125.jpg?_wi=2", imageAlt: "Seasonal landscaping"},
|
||||
]}
|
||||
gridVariant="two-columns-alternating-heights"
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
buttons={[{ text: "Schedule Consultation", href: "contact" }]}
|
||||
buttons={[{ text: "Schedule Consultation", href: "/quote" }]}
|
||||
buttonAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
@@ -112,11 +110,9 @@ export default function LandingPage() {
|
||||
tagAnimation="slide-up"
|
||||
metrics={[
|
||||
{
|
||||
id: "1", value: "2-4 Weeks", title: "Average Project Timeline", description: "Professional execution from concept to completion", imageSrc: "http://img.b2bpic.net/free-photo/path-way_74190-2125.jpg?_wi=3", imageAlt: "Completed landscape project"
|
||||
},
|
||||
id: "1", value: "2-4 Weeks", title: "Average Project Timeline", description: "Professional execution from concept to completion", imageSrc: "http://img.b2bpic.net/free-photo/path-way_74190-2125.jpg?_wi=3", imageAlt: "Completed landscape project"},
|
||||
{
|
||||
id: "2", value: "25% Savings", title: "Water Efficiency", description: "Smart irrigation reduces water consumption annually", imageSrc: "http://img.b2bpic.net/free-photo/closeup-selective-focus-shot-automatic-watering-system_181624-20614.jpg?_wi=2", imageAlt: "Irrigation efficiency"
|
||||
},
|
||||
id: "2", value: "25% Savings", title: "Water Efficiency", description: "Smart irrigation reduces water consumption annually", imageSrc: "http://img.b2bpic.net/free-photo/closeup-selective-focus-shot-automatic-watering-system_181624-20614.jpg?_wi=2", imageAlt: "Irrigation efficiency"},
|
||||
]}
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
@@ -133,23 +129,17 @@ export default function LandingPage() {
|
||||
tagAnimation="slide-up"
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Jennifer Martinez, Homeowner", date: "Date: 15 November 2024", title: "Absolutely transformed our backyard!", quote: "Go To Gophers completely transformed our dull backyard into a beautiful outdoor oasis. The team was professional, punctual, and stayed within budget. We couldn't be happier with the results!", tag: "Residential", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/path-way_74190-2125.jpg?_wi=4", imageAlt: "Backyard transformation"
|
||||
},
|
||||
id: "1", name: "Jennifer Martinez, Homeowner", date: "Date: 15 November 2024", title: "Absolutely transformed our backyard!", quote: "Go To Gophers completely transformed our dull backyard into a beautiful outdoor oasis. The team was professional, punctual, and stayed within budget. We couldn't be happier with the results!", tag: "Residential", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/path-way_74190-2125.jpg?_wi=4", imageAlt: "Backyard transformation"},
|
||||
{
|
||||
id: "2", name: "David Chen, Business Owner", date: "Date: 20 October 2024", title: "Professional and reliable service", quote: "As a commercial property manager, I've worked with many landscaping companies. Go To Gophers stands out for their attention to detail and consistent quality. Highly recommended for any business property.", tag: "Commercial", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/crop-woman-digging-grass-up_23-2147714901.jpg?_wi=2", imageAlt: "Commercial landscape maintenance"
|
||||
},
|
||||
id: "2", name: "David Chen, Business Owner", date: "Date: 20 October 2024", title: "Professional and reliable service", quote: "As a commercial property manager, I've worked with many landscaping companies. Go To Gophers stands out for their attention to detail and consistent quality. Highly recommended for any business property.", tag: "Commercial", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/crop-woman-digging-grass-up_23-2147714901.jpg?_wi=2", imageAlt: "Commercial landscape maintenance"},
|
||||
{
|
||||
id: "3", name: "Sarah Thompson, Homeowner", date: "Date: 5 September 2024", title: "Best investment for our home", quote: "The landscape design service exceeded our expectations. The team listened to our ideas and created something even better than we imagined. Our home value has definitely increased!", tag: "Design", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/path-way_74190-2125.jpg?_wi=5", imageAlt: "Home landscape design"
|
||||
},
|
||||
id: "3", name: "Sarah Thompson, Homeowner", date: "Date: 5 September 2024", title: "Best investment for our home", quote: "The landscape design service exceeded our expectations. The team listened to our ideas and created something even better than we imagined. Our home value has definitely increased!", tag: "Design", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/path-way_74190-2125.jpg?_wi=5", imageAlt: "Home landscape design"},
|
||||
{
|
||||
id: "4", name: "Michael Rodriguez, Homeowner", date: "Date: 12 August 2024", title: "Saved us so much on water bills", quote: "The new irrigation system Go To Gophers installed is amazing. Our water usage dropped significantly, and our lawn looks better than ever. Great investment!", tag: "Irrigation", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/closeup-selective-focus-shot-automatic-watering-system_181624-20614.jpg?_wi=3", imageAlt: "Irrigation system installation"
|
||||
},
|
||||
id: "4", name: "Michael Rodriguez, Homeowner", date: "Date: 12 August 2024", title: "Saved us so much on water bills", quote: "The new irrigation system Go To Gophers installed is amazing. Our water usage dropped significantly, and our lawn looks better than ever. Great investment!", tag: "Irrigation", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/closeup-selective-focus-shot-automatic-watering-system_181624-20614.jpg?_wi=3", imageAlt: "Irrigation system installation"},
|
||||
{
|
||||
id: "5", name: "Patricia Kim, Homeowner", date: "Date: 28 July 2024", title: "Fantastic seasonal maintenance", quote: "We signed up for their maintenance plan and haven't looked back. Every season they show up on time and keep our landscape looking pristine. Highly professional team!", tag: "Maintenance", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/crop-woman-digging-grass-up_23-2147714901.jpg?_wi=3", imageAlt: "Seasonal landscape care"
|
||||
},
|
||||
id: "5", name: "Patricia Kim, Homeowner", date: "Date: 28 July 2024", title: "Fantastic seasonal maintenance", quote: "We signed up for their maintenance plan and haven't looked back. Every season they show up on time and keep our landscape looking pristine. Highly professional team!", tag: "Maintenance", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/crop-woman-digging-grass-up_23-2147714901.jpg?_wi=3", imageAlt: "Seasonal landscape care"},
|
||||
{
|
||||
id: "6", name: "Robert Johnson, Homeowner", date: "Date: 10 June 2024", title: "Exceeded all our expectations", quote: "From the initial consultation to the final touches, Go To Gophers demonstrated exceptional craftsmanship and customer service. They truly care about creating beautiful spaces.", tag: "Full Service", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/path-way_74190-2125.jpg?_wi=6", imageAlt: "Full service landscape project"
|
||||
},
|
||||
id: "6", name: "Robert Johnson, Homeowner", date: "Date: 10 June 2024", title: "Exceeded all our expectations", quote: "From the initial consultation to the final touches, Go To Gophers demonstrated exceptional craftsmanship and customer service. They truly care about creating beautiful spaces.", tag: "Full Service", avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", imageSrc: "http://img.b2bpic.net/free-photo/path-way_74190-2125.jpg?_wi=6", imageAlt: "Full service landscape project"},
|
||||
]}
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
@@ -165,23 +155,17 @@ export default function LandingPage() {
|
||||
tagAnimation="slide-up"
|
||||
faqs={[
|
||||
{
|
||||
id: "1", title: "What's included in a landscape design consultation?", content: "Our consultation includes a site evaluation, discussion of your vision and budget, preliminary design sketches, and a detailed project estimate. This typically takes 1-2 hours."
|
||||
},
|
||||
id: "1", title: "What's included in a landscape design consultation?", content: "Our consultation includes a site evaluation, discussion of your vision and budget, preliminary design sketches, and a detailed project estimate. This typically takes 1-2 hours."},
|
||||
{
|
||||
id: "2", title: "How often should I have my lawn maintained?", content: "During growing season, we recommend weekly or bi-weekly maintenance depending on grass type and weather conditions. We can create a custom maintenance schedule for your specific needs."
|
||||
},
|
||||
id: "2", title: "How often should I have my lawn maintained?", content: "During growing season, we recommend weekly or bi-weekly maintenance depending on grass type and weather conditions. We can create a custom maintenance schedule for your specific needs."},
|
||||
{
|
||||
id: "3", title: "Do you offer emergency repair services?", content: "Yes! We offer emergency irrigation repair and storm cleanup services. Contact us immediately for urgent landscaping issues."
|
||||
},
|
||||
id: "3", title: "Do you offer emergency repair services?", content: "Yes! We offer emergency irrigation repair and storm cleanup services. Contact us immediately for urgent landscaping issues."},
|
||||
{
|
||||
id: "4", title: "What warranty do you provide?", content: "We guarantee workmanship on all installations for one year. Plant materials carry a standard 30-day establishment guarantee."
|
||||
},
|
||||
id: "4", title: "What warranty do you provide?", content: "We guarantee workmanship on all installations for one year. Plant materials carry a standard 30-day establishment guarantee."},
|
||||
{
|
||||
id: "5", title: "How can I reduce my landscape maintenance costs?", content: "We can recommend low-maintenance plant selections, efficient irrigation systems, and seasonal service packages that fit your budget."
|
||||
},
|
||||
id: "5", title: "How can I reduce my landscape maintenance costs?", content: "We can recommend low-maintenance plant selections, efficient irrigation systems, and seasonal service packages that fit your budget."},
|
||||
{
|
||||
id: "6", title: "Do you work with HOA requirements?", content: "Absolutely! We're familiar with most HOA guidelines and can design landscapes that comply with all restrictions."
|
||||
},
|
||||
id: "6", title: "Do you work with HOA requirements?", content: "Absolutely! We're familiar with most HOA guidelines and can design landscapes that comply with all restrictions."},
|
||||
]}
|
||||
faqsAnimation="slide-up"
|
||||
textboxLayout="default"
|
||||
@@ -197,8 +181,8 @@ export default function LandingPage() {
|
||||
background={{ variant: "plain" }}
|
||||
useInvertedBackground={false}
|
||||
buttons={[
|
||||
{ text: "Get Free Quote", href: "mailto:hello@gototophers.com" },
|
||||
{ text: "Call Us Today", href: "tel:+1-555-GOPHERS" },
|
||||
{ text: "Get Free Quote", href: "/quote" },
|
||||
{ text: "Call Us Today", href: "/call-us" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
329
src/app/quote/page.tsx
Normal file
329
src/app/quote/page.tsx
Normal file
@@ -0,0 +1,329 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
|
||||
import { useState } from "react";
|
||||
import FooterBase from "@/components/sections/footer/FooterBase";
|
||||
|
||||
export default function QuotePage() {
|
||||
const [formData, setFormData] = useState({
|
||||
name: "", email: "", phone: "", serviceType: "", propertySize: "", description: ""});
|
||||
|
||||
const [selectedDate, setSelectedDate] = useState<string | null>(null);
|
||||
const [selectedTime, setSelectedTime] = useState<string | null>(null);
|
||||
const [submitted, setSubmitted] = useState(false);
|
||||
|
||||
const handleInputChange = (
|
||||
e: React.ChangeEvent<
|
||||
HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement
|
||||
>
|
||||
) => {
|
||||
const { name, value } = e.target;
|
||||
setFormData((prev) => ({ ...prev, [name]: value }));
|
||||
};
|
||||
|
||||
const handleSubmit = (e: React.FormEvent) => {
|
||||
e.preventDefault();
|
||||
setSubmitted(true);
|
||||
setTimeout(() => {
|
||||
setSubmitted(false);
|
||||
setFormData({
|
||||
name: "", email: "", phone: "", serviceType: "", propertySize: "", description: ""});
|
||||
setSelectedDate(null);
|
||||
setSelectedTime(null);
|
||||
}, 3000);
|
||||
};
|
||||
|
||||
// Generate available dates (next 30 days)
|
||||
const generateDates = () => {
|
||||
const dates = [];
|
||||
const today = new Date();
|
||||
for (let i = 1; i <= 30; i++) {
|
||||
const date = new Date(today);
|
||||
date.setDate(date.getDate() + i);
|
||||
if (date.getDay() !== 0 && date.getDay() !== 6) {
|
||||
dates.push(date.toISOString().split("T")[0]);
|
||||
}
|
||||
}
|
||||
return dates;
|
||||
};
|
||||
|
||||
const availableTimeSlots = [
|
||||
"9:00 AM", "10:00 AM", "11:00 AM", "1:00 PM", "2:00 PM", "3:00 PM", "4:00 PM"];
|
||||
|
||||
const dates = generateDates();
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
contentWidth="small"
|
||||
sizing="large"
|
||||
background="circleGradient"
|
||||
cardStyle="gradient-mesh"
|
||||
primaryButtonStyle="double-inset"
|
||||
secondaryButtonStyle="solid"
|
||||
headingFontWeight="extrabold"
|
||||
>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleFullscreen
|
||||
navItems={[
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Services", id: "services" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Testimonials", id: "testimonials" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
{ name: "Free Quote", id: "/quote" },
|
||||
{ name: "Call Us", id: "/call-us" },
|
||||
]}
|
||||
brandName="Go To Gophers"
|
||||
bottomLeftText="Ready to transform your landscape"
|
||||
bottomRightText="hello@gototophers.com"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="min-h-screen bg-gradient-to-br from-slate-50 to-slate-100 py-20 px-4">
|
||||
<div className="max-w-2xl mx-auto">
|
||||
<div className="bg-white rounded-xl shadow-lg p-8 md:p-12">
|
||||
<h1 className="text-4xl md:text-5xl font-bold text-gray-900 mb-2">
|
||||
Get Your Free Quote
|
||||
</h1>
|
||||
<p className="text-lg text-gray-600 mb-8">
|
||||
Tell us about your landscape project and select your preferred
|
||||
consultation time.
|
||||
</p>
|
||||
|
||||
{submitted && (
|
||||
<div className="mb-8 p-4 bg-green-50 border border-green-200 rounded-lg">
|
||||
<p className="text-green-800 font-semibold">
|
||||
✓ Thank you! We'll contact you soon to confirm your
|
||||
appointment.
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<form onSubmit={handleSubmit} className="space-y-6">
|
||||
{/* Contact Information */}
|
||||
<div className="space-y-4">
|
||||
<h2 className="text-xl font-semibold text-gray-800">
|
||||
Contact Information
|
||||
</h2>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-1">
|
||||
Full Name *
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
name="name"
|
||||
value={formData.name}
|
||||
onChange={handleInputChange}
|
||||
required
|
||||
className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-red-500"
|
||||
placeholder="John Doe"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-1">
|
||||
Email *
|
||||
</label>
|
||||
<input
|
||||
type="email"
|
||||
name="email"
|
||||
value={formData.email}
|
||||
onChange={handleInputChange}
|
||||
required
|
||||
className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-red-500"
|
||||
placeholder="john@example.com"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-1">
|
||||
Phone *
|
||||
</label>
|
||||
<input
|
||||
type="tel"
|
||||
name="phone"
|
||||
value={formData.phone}
|
||||
onChange={handleInputChange}
|
||||
required
|
||||
className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-red-500"
|
||||
placeholder="(555) 123-4567"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Project Details */}
|
||||
<div className="space-y-4">
|
||||
<h2 className="text-xl font-semibold text-gray-800">
|
||||
Project Details
|
||||
</h2>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-1">
|
||||
Service Type *
|
||||
</label>
|
||||
<select
|
||||
name="serviceType"
|
||||
value={formData.serviceType}
|
||||
onChange={handleInputChange}
|
||||
required
|
||||
className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-red-500"
|
||||
>
|
||||
<option value="">Select a service...</option>
|
||||
<option value="landscape-design">Landscape Design</option>
|
||||
<option value="lawn-maintenance">Lawn Maintenance</option>
|
||||
<option value="irrigation">Irrigation Systems</option>
|
||||
<option value="seasonal-care">Seasonal Care</option>
|
||||
<option value="other">Other</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-1">
|
||||
Property Size *
|
||||
</label>
|
||||
<select
|
||||
name="propertySize"
|
||||
value={formData.propertySize}
|
||||
onChange={handleInputChange}
|
||||
required
|
||||
className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-red-500"
|
||||
>
|
||||
<option value="">Select property size...</option>
|
||||
<option value="small">Small (Under 5,000 sq ft)</option>
|
||||
<option value="medium">Medium (5,000 - 10,000 sq ft)</option>
|
||||
<option value="large">
|
||||
Large (10,000 - 25,000 sq ft)
|
||||
</option>
|
||||
<option value="xlarge">
|
||||
Extra Large (Over 25,000 sq ft)
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-1">
|
||||
Project Description
|
||||
</label>
|
||||
<textarea
|
||||
name="description"
|
||||
value={formData.description}
|
||||
onChange={handleInputChange}
|
||||
className="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-red-500"
|
||||
placeholder="Tell us about your project..."
|
||||
rows={4}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Schedule Consultation */}
|
||||
<div className="space-y-4">
|
||||
<h2 className="text-xl font-semibold text-gray-800">
|
||||
Schedule Consultation
|
||||
</h2>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-3">
|
||||
Preferred Date *
|
||||
</label>
|
||||
<div className="grid grid-cols-3 md:grid-cols-5 gap-2 max-h-48 overflow-y-auto">
|
||||
{dates.map((date) => (
|
||||
<button
|
||||
key={date}
|
||||
type="button"
|
||||
onClick={() => setSelectedDate(date)}
|
||||
className={`p-2 text-sm rounded-lg border transition-colors ${
|
||||
selectedDate === date
|
||||
? "bg-red-500 text-white border-red-500"
|
||||
: "bg-white text-gray-700 border-gray-300 hover:border-red-500"
|
||||
}`}
|
||||
>
|
||||
{new Date(date).toLocaleDateString("en-US", {
|
||||
month: "short", day: "numeric"})}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-3">
|
||||
Preferred Time *
|
||||
</label>
|
||||
<div className="grid grid-cols-2 md:grid-cols-4 gap-2">
|
||||
{availableTimeSlots.map((time) => (
|
||||
<button
|
||||
key={time}
|
||||
type="button"
|
||||
onClick={() => setSelectedTime(time)}
|
||||
className={`p-2 text-sm rounded-lg border transition-colors ${
|
||||
selectedTime === time
|
||||
? "bg-red-500 text-white border-red-500"
|
||||
: "bg-white text-gray-700 border-gray-300 hover:border-red-500"
|
||||
}`}
|
||||
>
|
||||
{time}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Submit Button */}
|
||||
<div className="pt-4">
|
||||
<button
|
||||
type="submit"
|
||||
disabled={!selectedDate || !selectedTime}
|
||||
className="w-full bg-gradient-to-r from-red-500 to-red-600 hover:from-red-600 hover:to-red-700 disabled:from-gray-400 disabled:to-gray-400 text-white font-bold py-3 px-6 rounded-lg transition-all duration-200 transform hover:scale-105"
|
||||
>
|
||||
Schedule My Free Consultation
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<p className="text-xs text-gray-500 text-center">
|
||||
We respect your privacy. Your information will only be used to
|
||||
contact you about your consultation.
|
||||
</p>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
logoText="Go To Gophers"
|
||||
copyrightText="© 2025 Go To Gophers Landscaping. All rights reserved."
|
||||
columns={[
|
||||
{
|
||||
title: "Services", items: [
|
||||
{ label: "Landscape Design", href: "/#services" },
|
||||
{ label: "Lawn Maintenance", href: "/#services" },
|
||||
{ label: "Irrigation Systems", href: "/#services" },
|
||||
{ label: "Seasonal Care", href: "/#services" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "/#about" },
|
||||
{ label: "Our Team", href: "/#about" },
|
||||
{ label: "Testimonials", href: "/#testimonials" },
|
||||
{ label: "Contact", href: "/#contact" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal", items: [
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Terms of Service", href: "#" },
|
||||
{ label: "Warranty", href: "#" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user