Update src/app/page.tsx

Update src/app/layout.tsx
2026-03-04 02:19:40 +00:00 · 2026-03-04 02:18:49 +00:00 · 2026-03-04 02:18:49 +00:00 · 2026-03-04 00:29:50 +00:00 · 2026-03-04 00:29:45 +00:00 · 2026-03-04 00:28:49 +00:00
3 changed files with 127 additions and 111 deletions
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,57 +1,24 @@
 import type { Metadata } from "next";
 import { Halant } from "next/font/google";
 import { Inter } from "next/font/google";
 import { Figtree } from "next/font/google";
 import "./globals.css";
-import { ServiceWrapper } from "@/components/ServiceWrapper";
+import "./styles/variables.css";
-import Tag from "@/tag/Tag";
+import "./styles/base.css";
-const halant = Halant({
+const inter = Inter({ subsets: ["latin"] });
  variable: "--font-halant",  subsets: ["latin"],
  weight: ["300", "400", "500", "600", "700"],
 });
 const inter = Inter({
  variable: "--font-inter",  subsets: ["latin"],
 });
 const figtree = Figtree({
  variable: "--font-figtree",  subsets: ["latin"],
 });
 export const metadata: Metadata = {
-  title: "Sarabia Sealing - Professional Driveway & Parking Lot Sealing in O'Fallon, IL",  description: "Expert concrete and asphalt sealing services in O'Fallon, Illinois. Free estimates on driveway sealing, parking lot maintenance, and crack repair.",  keywords: "driveway sealing O'Fallon, parking lot sealing Illinois, asphalt maintenance, concrete sealing, crack filling",  metadataBase: new URL("https://sarabiasealing.com"),
+  title: "Sarabia Sealing | Professional Driveway & Parking Lot Sealing",  description: "Expert driveway and parking lot sealing services in O'Fallon, IL. Free estimates, professional team, 15+ years of experience."};
  alternates: {
    canonical: "https://sarabiasealing.com"},
  robots: {
    index: true,
    follow: true,
  },
  openGraph: {
    title: "Sarabia Sealing - Professional Sealing Services",    description: "Protect your surfaces with expert sealing solutions in O'Fallon, IL",    url: "https://sarabiasealing.com",    siteName: "Sarabia Sealing",    type: "website",    images: [
      {
        url: "http://img.b2bpic.net/free-photo/funny-kid-rain-boots-playing-rain-park_1157-37673.jpg",        alt: "Professional sealing services"},
    ],
  },
  twitter: {
    card: "summary_large_image",    title: "Sarabia Sealing - Professional Sealing Services in O'Fallon",    description: "Expert driveway and parking lot sealing services with free estimates",    images: ["http://img.b2bpic.net/free-photo/funny-kid-rain-boots-playing-rain-park_1157-37673.jpg"],
  },
 };
 export default function RootLayout({
  children,
-}: Readonly<{
+}: {
  children: React.ReactNode;
-}>) {
+}) {
  return (
-    <html lang="en" suppressHydrationWarning>
+    <html lang="en">
-      <ServiceWrapper>
+      <body className={inter.className}>
-        <body
+        {children}
-          className={`${halant.variable} ${inter.variable} ${figtree.variable} antialiased`}
+      
        >
          <Tag />
          {children}
        <script
          dangerouslySetInnerHTML={{
            __html: `
@@ -1419,7 +1386,6 @@ export default function RootLayout({
          }}
        />
      </body>
      </ServiceWrapper>
    </html>
  );
 }
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -3,33 +3,34 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
 import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
 import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
 import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
 import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
 import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
 import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
 import ContactCTA from '@/components/sections/contact/ContactCTA';
 import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
-import { Shield, Wrench, MessageSquare } from 'lucide-react';
+import { Shield, Wrench, Phone, Star } from 'lucide-react';
 export default function LandingPage() {
  return (
    <ThemeProvider
-      defaultButtonVariant="text-stagger"
+      defaultButtonVariant="hover-magnetic"
-      defaultTextAnimation="background-highlight"
+      defaultTextAnimation="entrance-slide"
-      borderRadius="soft"
+      borderRadius="rounded"
-      contentWidth="compact"
+      contentWidth="mediumLarge"
-      sizing="medium"
+      sizing="largeSmall"
      background="circleGradient"
-      cardStyle="soft-shadow"
+      cardStyle="glass-elevated"
-      primaryButtonStyle="double-inset"
+      primaryButtonStyle="gradient"
-      secondaryButtonStyle="radial-glow"
+      secondaryButtonStyle="glass"
-      headingFontWeight="normal"
+      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="Sarabia Sealing"
          navItems={[
            { name: "Services", id: "services" },
-            { name: "About", id: "about" },
+            { name: "Reviews", id: "reviews" },
            { name: "Contact", id: "contact" }
          ]}
        />
@@ -37,60 +38,73 @@ export default function LandingPage() {
      <div id="hero" data-section="hero">
        <HeroBillboardGallery
-          title="Professional Sealing Services for O'Fallon"
+          title="Professional Driveway & Parking Lot Sealing"
-          description="Protect and preserve your concrete and asphalt surfaces with expert sealing solutions from Sarabia Sealing. Serving O'Fallon, IL with quality workmanship and lasting results."
+          description="Protect your concrete and asphalt surfaces with expert sealing solutions. Same-day estimates available. Serving O'Fallon and surrounding areas with proven results."
-          background={{ variant: "radial-gradient" }}
+          background={{ variant: "plain" }}
-          tag="Quality Assured"
+          tag="Free Estimates Available"
          tagIcon={Shield}
          tagAnimation="slide-up"
          buttons={[
-            { text: "Get a Free Estimate", href: "contact" },
+            { text: "📞 (618) 555-0147", href: "tel:+16185550147" },
-            { text: "Learn More", href: "services" }
+            { text: "Request Estimate", href: "#estimate-form" }
          ]}
          buttonAnimation="slide-up"
          mediaItems={[
-            { imageSrc: "http://img.b2bpic.net/free-photo/funny-kid-rain-boots-playing-rain-park_1157-37673.jpg?_wi=1", imageAlt: "concrete sealing driveway sealing professional construction asphalt maintenance" },
+            { imageSrc: "https://images.unsplash.com/photo-1581578731548-c64695c952952?w=1200&h=800&fit=crop&_wi=1", imageAlt: "Professional driveway sealing showing before and after" },
-            { imageSrc: "http://img.b2bpic.net/free-photo/empty-parking-lot-parking-lane-outdoor-public-park_1127-3373.jpg?_wi=1", imageAlt: "parking lot sealing commercial paving asphalt maintenance parking surface" },
+            { imageSrc: "https://images.unsplash.com/photo-1581578731548-c64695c952952?w=1200&h=800&fit=crop&_wi=2", imageAlt: "Commercial parking lot sealing and maintenance" },
-            { imageSrc: "http://img.b2bpic.net/free-photo/funny-kid-rain-boots-playing-rain-park_1157-37673.jpg?_wi=2", imageAlt: "driveway sealing asphalt protection concrete repair surface treatment" }
+            { imageSrc: "https://images.unsplash.com/photo-1581578731548-c64695c952952?w=1200&h=800&fit=crop&_wi=3", imageAlt: "Expert crack filling and asphalt repair" }
          ]}
          mediaAnimation="slide-up"
        />
      </div>
-      <div id="about" data-section="about">
+      <div id="estimate-form" data-section="estimate-form">
-        <TextSplitAbout
+        <ContactSplitForm
-          title="About Sarabia Sealing"
+          title="Get Your Free Estimate"
-          description={[
+          description="Fill out the form below and we'll contact you within 2 hours with a competitive quote for your sealing project."
-            "With years of experience protecting surfaces across O'Fallon and surrounding areas, Sarabia Sealing is your trusted partner for driveway, parking lot, and commercial sealing projects.",            "We use industry-leading materials and proven techniques to extend the life of your asphalt and concrete surfaces. Our commitment to quality workmanship and customer satisfaction has made us a preferred choice for residential and commercial clients.",            "Every project is handled with precision and care. We take pride in delivering results that protect your investment and enhance your property's appearance."
+          inputs={[
            { name: "name", type: "text", placeholder: "Your Name", required: true },
            { name: "phone", type: "tel", placeholder: "(618) 555-0000", required: true },
            { name: "email", type: "email", placeholder: "your@email.com", required: true },
            { name: "address", type: "text", placeholder: "Property Address", required: true },
            { name: "projectType", type: "text", placeholder: "e.g., Driveway, Parking Lot, Commercial", required: true },
            { name: "squareFootage", type: "text", placeholder: "Estimated square footage", required: false }
          ]}
-          buttons={[
+          textarea={{
-            { text: "Request Service", href: "contact" }
+            name: "message",            placeholder: "Describe your project details and any special concerns...",            rows: 4,
-          ]}
+            required: false
-          showBorder={true}
+          }}
          useInvertedBackground={false}
-          buttonAnimation="slide-up"
+          imageSrc="https://images.unsplash.com/photo-1581578731548-c64695c952952?w=800&h=600&fit=crop"
          imageAlt="Professional sealing team at work"
          mediaAnimation="slide-up"
          mediaPosition="right"
          buttonText="Get Free Estimate"
          onSubmit={(data) => {
            console.log('Form submitted:', data);
          }}
        />
      </div>
      <div id="services" data-section="services">
        <FeatureCardEight
          title="Our Services"
-          description="Comprehensive sealing and maintenance solutions tailored to your needs"
+          description="Comprehensive sealing and maintenance solutions for residential and commercial properties"
-          tag="Service Solutions"
+          tag="Complete Solutions"
          tagIcon={Wrench}
          tagAnimation="slide-up"
          features={[
            {
              id: 1,
-              title: "Driveway Sealing",              description: "Professional sealcoating to protect your driveway from UV damage, water infiltration, and harsh weather conditions.",              imageSrc: "http://img.b2bpic.net/free-photo/funny-kid-rain-boots-playing-rain-park_1157-37673.jpg?_wi=3",              imageAlt: "Driveway sealing service"
+              title: "Driveway Sealing",              description: "Professional sealcoating to protect your driveway from UV damage, water infiltration, and harsh weather conditions. Extends pavement life by 5-10 years.",              imageSrc: "https://images.unsplash.com/photo-1581578731548-c64695c952952?w=600&h=400&fit=crop&_wi=1",              imageAlt: "Driveway sealing service"
            },
            {
              id: 2,
-              title: "Parking Lot Maintenance",              description: "Commercial-grade sealing services for parking lots, ensuring longevity and professional appearance for your business.",              imageSrc: "http://img.b2bpic.net/free-photo/empty-parking-lot-parking-lane-outdoor-public-park_1127-3373.jpg?_wi=2",              imageAlt: "Parking lot maintenance"
+              title: "Parking Lot Maintenance",              description: "Commercial-grade sealing services for parking lots, ensuring longevity and professional appearance for your business. Includes line striping and repairs.",              imageSrc: "https://images.unsplash.com/photo-1581578731548-c64695c952952?w=600&h=400&fit=crop&_wi=2",              imageAlt: "Parking lot maintenance"
            },
            {
              id: 3,
-              title: "Crack Filling & Repair",              description: "Expert crack identification and filling to prevent further damage and maintain surface integrity.",              imageSrc: "http://img.b2bpic.net/free-photo/funny-kid-rain-boots-playing-rain-park_1157-37673.jpg?_wi=4",              imageAlt: "Crack filling service"
+              title: "Crack Filling & Repair",              description: "Expert crack identification and filling to prevent further damage and maintain surface integrity. Prevents water infiltration and extends surface life.",              imageSrc: "https://images.unsplash.com/photo-1581578731548-c64695c952952?w=600&h=400&fit=crop&_wi=3",              imageAlt: "Crack filling service"
            }
          ]}
          textboxLayout="default"
@@ -99,17 +113,53 @@ export default function LandingPage() {
        />
      </div>
      <div id="reviews" data-section="reviews">
        <TestimonialCardThirteen
          testimonials={[
            {
              id: "1",              name: "John Martinez",              handle: "Local Homeowner",              testimonial: "Sarabia Sealing did an amazing job on my driveway. Professional team, fair pricing, and the results look fantastic. Highly recommend!",              rating: 5,
              icon: Star
            },
            {
              id: "2",              name: "Sarah Thompson",              handle: "Business Owner",              testimonial: "We've used Sarabia Sealing for our parking lot maintenance for 3 years. Consistently excellent work and they always meet our schedule.",              rating: 5,
              icon: Star
            },
            {
              id: "3",              name: "Robert Chen",              handle: "Property Manager",              testimonial: "Fast, professional, and they stand behind their work. Best sealing company in O'Fallon. Already scheduled our next project.",              rating: 5,
              icon: Star
            },
            {
              id: "4",              name: "Michelle Davis",              handle: "Residential Client",              testimonial: "From the free estimate to the finished product, everything was handled with care and expertise. My driveway looks brand new!",              rating: 5,
              icon: Star
            }
          ]}
          showRating={true}
          title="Customer Reviews"
          description="Trusted by hundreds of satisfied homeowners and businesses"
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
          carouselMode="buttons"
        />
      </div>
      <div id="metrics" data-section="metrics">
        <MetricCardFourteen
-          title="Trusted by hundreds of homeowners and businesses throughout O'Fallon and the surrounding region."
+          title="Trusted by Hundreds"
          tag="By The Numbers"
          tagAnimation="slide-up"
          metrics={[
            {
-              id: "1",              value: "500+",              description: "Successful projects completed with consistent quality and customer satisfaction."
+              id: "1",              value: "500+",              description: "Successful projects completed with consistent quality"
            },
            {
-              id: "2",              value: "15+",              description: "Years of experience delivering professional sealing and maintenance services."
+              id: "2",              value: "15+",              description: "Years of professional sealing experience"
            },
            {
              id: "3",              value: "98%",              description: "Customer satisfaction rating"
            },
            {
              id: "4",              value: "24/7",              description: "Emergency service availability"
            }
          ]}
          metricsAnimation="slide-up"
@@ -119,18 +169,18 @@ export default function LandingPage() {
      <div id="contact" data-section="contact">
        <ContactCTA
-          tag="Ready to Get Started?"
+          tag="Emergency Service Available"
-          tagIcon={MessageSquare}
+          tagIcon={Phone}
          tagAnimation="slide-up"
-          title="Protect Your Surfaces Today"
+          title="Ready to Protect Your Surfaces?"
-          description="Contact Sarabia Sealing for a free estimate on your driveway, parking lot, or commercial sealing project. Our team is ready to help preserve and enhance your surfaces."
+          description="Call Sarabia Sealing today for a free estimate on your driveway, parking lot, or commercial sealing project. Our team is ready to help preserve and enhance your surfaces."
          buttons={[
-            { text: "Call for Free Estimate", href: "tel:+1-618-XXX-XXXX" },
+            { text: "📞 Call (618) 555-0147", href: "tel:+16185550147" },
-            { text: "Email Us", href: "mailto:info@sarabiasealing.com" }
+            { text: "📧 Email Info", href: "mailto:info@sarabiasealing.com" }
          ]}
          buttonAnimation="slide-up"
          background={{ variant: "plain" }}
-          useInvertedBackground={false}
+          useInvertedBackground={true}
        />
      </div>
@@ -147,20 +197,20 @@ export default function LandingPage() {
            },
            {
              title: "Company",              items: [
-                { label: "About Us", href: "#about" },
+                { label: "About Us", href: "#" },
-                { label: "Contact", href: "#contact" },
+                { label: "Free Estimates", href: "#estimate-form" },
-                { label: "Service Area", href: "#" }
+                { label: "Reviews", href: "#reviews" }
              ]
            },
            {
              title: "Contact",              items: [
-                { label: "O'Fallon, IL", href: "#" },
+                { label: "📞 (618) 555-0147", href: "tel:+16185550147" },
-                { label: "Free Estimates", href: "#contact" },
+                { label: "📧 info@sarabiasealing.com", href: "mailto:info@sarabiasealing.com" },
-                { label: "Emergency Service", href: "#" }
+                { label: "📍 O'Fallon, IL 62269", href: "#" }
              ]
            }
          ]}
-          copyrightText="© 2025 Sarabia Sealing. All rights reserved. Professional sealing services in O'Fallon, IL."
+          copyrightText="© 2025 Sarabia Sealing. All rights reserved. Professional driveway and parking lot sealing services in O'Fallon, IL."
        />
      </div>
    </ThemeProvider>
--- a/src/app/styles/variables.css
+++ b/src/app/styles/variables.css
@@ -2,23 +2,23 @@
  /* Base units */
  /* --vw is set by ThemeProvider */
-  /* --background: #f5f5f5;;
+  /* --background: #ffffff;;
-  --card: #ffffff;;
+  --card: #f9f9f9;;
-  --foreground: #1c1c1c;;
+  --foreground: #000612e6;;
-  --primary-cta: #341f51;;
+  --primary-cta: #E34400;;
-  --secondary-cta: #ffffff;;
+  --secondary-cta: #f9f9f9;;
-  --accent: #6139e6;;
+  --accent: #e2e2e2;;
-  --background-accent: #b3a8e8;; */
+  --background-accent: #E34400;; */
-  --background: #f5f5f5;;
+  --background: #ffffff;;
-  --card: #ffffff;;
+  --card: #f9f9f9;;
-  --foreground: #1c1c1c;;
+  --foreground: #000612e6;;
-  --primary-cta: #341f51;;
+  --primary-cta: #E34400;;
  --primary-cta-text: #f5f5f5;;
-  --secondary-cta: #ffffff;;
+  --secondary-cta: #f9f9f9;;
  --secondary-cta-text: #1c1c1c;;
-  --accent: #6139e6;;
+  --accent: #e2e2e2;;
-  --background-accent: #b3a8e8;;
+  --background-accent: #E34400;;
  /* text sizing - set by ThemeProvider */
  /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
Author	SHA1	Message	Date
bender	90f8600486	Update src/app/page.tsx	2026-03-04 02:19:40 +00:00
bender	21c382c74a	Update src/app/page.tsx	2026-03-04 02:18:49 +00:00
bender	1966be20d3	Update src/app/layout.tsx	2026-03-04 02:18:49 +00:00
bender	00601bf847	Merge version_2 into main Merge version_2 into main	2026-03-04 00:29:50 +00:00
bender	4b7e1f9e88	Update src/app/page.tsx	2026-03-04 00:29:45 +00:00
bender	86ce5bde47	Merge version_2 into main Merge version_2 into main	2026-03-04 00:28:49 +00:00
bender	d6674d52d1	Update src/app/page.tsx	2026-03-04 00:28:45 +00:00
bender	db7d7fa921	Merge version_2 into main Merge version_2 into main	2026-03-04 00:27:10 +00:00
bender	006d379030	Update src/app/styles/variables.css	2026-03-04 00:27:06 +00:00
bender	adb1a2db88	Update src/app/page.tsx	2026-03-04 00:27:06 +00:00
bender	4d28de6af0	Update src/app/layout.tsx	2026-03-04 00:27:05 +00:00
bender	7de0a0c3c2	Merge version_1 into main Merge version_1 into main	2026-03-03 23:45:07 +00:00
bender	ecb4283a7d	Merge version_1 into main Merge version_1 into main	2026-03-03 23:44:22 +00:00
bender	86710b7945	Merge version_1 into main Merge version_1 into main	2026-03-03 23:43:19 +00:00