Compare commits
22 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 0518675622 | |||
| e0257ff6fa | |||
| 3149358d53 | |||
| d7569122bb | |||
| 8b6b156d74 | |||
| 3b9bdb232f | |||
| 68e5f92dde | |||
| 6747ba4d83 | |||
| b76d1546b5 | |||
| 861015f03f | |||
| 2eb4be8f1c | |||
| 301c6d04bb | |||
| 99daeff82c | |||
| c0c6b67710 | |||
| b741446e29 | |||
| a6f99ff072 | |||
| b842d2ba67 | |||
| 05a3691716 | |||
| 498aafdfb6 | |||
| b67d96e954 | |||
| 5e6075de8c | |||
| 3d9c52f1c4 |
118
src/app/page.tsx
118
src/app/page.tsx
@@ -1,8 +1,7 @@
|
||||
"use client";
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import ReactLenis, { useLenis } from "lenis/react";
|
||||
import { useState } from 'react';
|
||||
import ReactLenis from "lenis/react";
|
||||
import ContactCTA from '@/components/sections/contact/ContactCTA';
|
||||
import FaqDouble from '@/components/sections/faq/FaqDouble';
|
||||
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
|
||||
@@ -11,38 +10,9 @@ import HeroLogoBillboardSplit from '@/components/sections/hero/HeroLogoBillboard
|
||||
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
|
||||
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
|
||||
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
|
||||
import Input from '@/components/form/Input';
|
||||
import { MessageCircle, Sparkles, Star, Wrench } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
const lenis = useLenis();
|
||||
|
||||
const scrollToSection = (sectionId) => {
|
||||
const cleanId = String(sectionId).replace(/^#/, "");
|
||||
if (lenis) {
|
||||
lenis.scrollTo(`#${cleanId}`, { offset: 0 });
|
||||
} else {
|
||||
const element = document.getElementById(cleanId);
|
||||
if (!element) return;
|
||||
element.scrollIntoView({ behavior: "smooth", block: "start" });
|
||||
}
|
||||
};
|
||||
|
||||
const [name, setName] = useState("");
|
||||
const [email, setEmail] = useState("");
|
||||
const [phone, setPhone] = useState("");
|
||||
const [message, setMessage] = useState("");
|
||||
|
||||
const handleSubmitQuote = (e) => {
|
||||
e.preventDefault();
|
||||
console.log({ name, email, phone, message });
|
||||
alert("Quote request submitted! We'll be in touch soon.");
|
||||
setName("");
|
||||
setEmail("");
|
||||
setPhone("");
|
||||
setMessage("");
|
||||
};
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="icon-arrow"
|
||||
@@ -71,7 +41,7 @@ export default function LandingPage() {
|
||||
]}
|
||||
brandName="Results Roofing"
|
||||
button={{
|
||||
text: "Free Estimate", onClick: () => scrollToSection("quote")}}
|
||||
text: "Free Estimate", href: "#quote"}}
|
||||
animateOnLoad={true}
|
||||
/>
|
||||
</div>
|
||||
@@ -84,9 +54,9 @@ export default function LandingPage() {
|
||||
description="Roofing that feels premium before the first shingle goes on. Results Roofing helps Dallas homeowners with inspections, repairs, replacements, and insurance guidance through a polished, high-trust experience from start to finish."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get My Free Roof Inspection", onClick: () => scrollToSection("quote")},
|
||||
text: "Get My Free Roof Inspection", href: "#quote"},
|
||||
{
|
||||
text: "See Why Dallas Trusts Us", onClick: () => scrollToSection("reviews")},
|
||||
text: "Call Now", href: "tel:+12145550199"},
|
||||
]}
|
||||
layoutOrder="default"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/chisinau-arena-sunset-moldova_1268-16015.jpg"
|
||||
@@ -203,17 +173,17 @@ export default function LandingPage() {
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact-cta" data-section="contact-cta">
|
||||
<div id="quote" data-section="quote">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "radial-gradient"}}
|
||||
tag="Ready when you are"
|
||||
title="Protect your home with a roof that looks better and performs better."
|
||||
description="Whether you need an inspection, a fast repair, or a full replacement, Results Roofing is positioned here as the premium choice that still feels approachable."
|
||||
title="Get Your Free Roofing Estimate"
|
||||
description="Need an inspection, repair, or full roof replacement? Tell us what is going on and our team will reach out to schedule your free estimate."
|
||||
buttons={[
|
||||
{
|
||||
text: "Get a Free Estimate", onClick: () => scrollToSection("quote")},
|
||||
text: "Request Free Estimate", href: "#quote"},
|
||||
{
|
||||
text: "Call Results Roofing", href: "tel:+12145550199"},
|
||||
]}
|
||||
@@ -223,68 +193,6 @@ export default function LandingPage() {
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="quote" data-section="quote" className="py-20 bg-card rounded-lg mx-auto max-w-content-width px-4 md:px-8">
|
||||
<div className="text-center mb-12">
|
||||
<h2 className="text-4xl md:text-5xl font-bold leading-tight text-foreground">Get Your Free Estimate</h2>
|
||||
<p className="mt-4 text-lg text-foreground/80">Fill out the form below and we'll get back to you shortly.</p>
|
||||
</div>
|
||||
<form onSubmit={handleSubmitQuote} className="max-w-xl mx-auto space-y-6">
|
||||
<div>
|
||||
<label htmlFor="name" className="block text-sm font-medium text-foreground">Name</label>
|
||||
<Input
|
||||
id="name"
|
||||
type="text"
|
||||
placeholder="Your Name"
|
||||
value={name}
|
||||
onChange={setName}
|
||||
required
|
||||
className="mt-1 block w-full text-foreground"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="email" className="block text-sm font-medium text-foreground">Email</label>
|
||||
<Input
|
||||
id="email"
|
||||
type="email"
|
||||
placeholder="your@email.com"
|
||||
value={email}
|
||||
onChange={setEmail}
|
||||
required
|
||||
className="mt-1 block w-full text-foreground"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="phone" className="block text-sm font-medium text-foreground">Phone</label>
|
||||
<Input
|
||||
id="phone"
|
||||
type="tel"
|
||||
placeholder="(___) ___-____"
|
||||
value={phone}
|
||||
onChange={setPhone}
|
||||
className="mt-1 block w-full text-foreground"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="message" className="block text-sm font-medium text-foreground">Message</label>
|
||||
<textarea
|
||||
id="message"
|
||||
rows={4}
|
||||
placeholder="Tell us about your roofing needs..."
|
||||
value={message}
|
||||
onChange={(e) => setMessage(e.target.value)}
|
||||
className="mt-1 block w-full p-3 border border-border rounded-md shadow-sm bg-background text-foreground focus:ring-primary-cta focus:border-primary-cta sm:text-sm"
|
||||
style={{ '--border': 'var(--accent)', '--background': 'var(--card)' } as any}
|
||||
/>
|
||||
</div>
|
||||
<button
|
||||
type="submit"
|
||||
className="w-full py-3 px-4 rounded-md shadow-sm text-base font-medium text-primary-cta-text bg-primary-cta hover:bg-primary-cta-hover focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-cta-hover"
|
||||
>
|
||||
Submit Request
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBaseCard
|
||||
logoText="Results Roofing"
|
||||
@@ -292,19 +200,19 @@ export default function LandingPage() {
|
||||
{
|
||||
title: "Quick Links", items: [
|
||||
{
|
||||
label: "Services", onClick: () => scrollToSection("services")},
|
||||
label: "Services", href: "#services"},
|
||||
{
|
||||
label: "Process", onClick: () => scrollToSection("process")},
|
||||
label: "Process", href: "#process"},
|
||||
{
|
||||
label: "Reviews", onClick: () => scrollToSection("reviews")},
|
||||
label: "Reviews", href: "#reviews"},
|
||||
{
|
||||
label: "FAQ", onClick: () => scrollToSection("faq")},
|
||||
label: "FAQ", href: "#faq"},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact", items: [
|
||||
{
|
||||
label: "Get an Estimate", onClick: () => scrollToSection("quote")},
|
||||
label: "Get an Estimate", href: "#quote"},
|
||||
{
|
||||
label: "Call Us: (214) 555-0199", href: "tel:+12145550199"},
|
||||
{
|
||||
|
||||
Reference in New Issue
Block a user