Update src/app/page.tsx

Update src/app/layout.tsx
Merge version_8 into main
2026-03-06 04:04:21 +00:00 · 2026-03-06 04:04:21 +00:00 · 2026-03-06 03:58:12 +00:00 · 2026-03-06 03:58:08 +00:00 · 2026-03-06 03:41:52 +00:00 · 2026-03-06 03:41:48 +00:00
3 changed files with 202 additions and 102 deletions
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,54 +1,22 @@
 import type { Metadata } from "next";
-import { Halant } from "next/font/google";
 import { Inter } from "next/font/google";
-import { Public_Sans } from "next/font/google";
 import "./globals.css";
-import { ServiceWrapper } from "@/components/ServiceWrapper";
-import Tag from "@/tag/Tag";
+import "./styles/variables.css";
+import "./styles/base.css";

-const halant = Halant({
-  variable: "--font-halant",  subsets: ["latin"],
-  weight: ["300", "400", "500", "600", "700"],
-});
-
-const inter = Inter({
-  variable: "--font-inter",  subsets: ["latin"],
-});
-
-const publicSans = Public_Sans({
-  variable: "--font-public-sans",  subsets: ["latin"],
-});
+const inter = Inter({ subsets: ["latin"] });

 export const metadata: Metadata = {
-  title: "CoreScale - Professional Websites for Small Businesses",  description: "Affordable, professional web design for small businesses. Build trust online with clean, modern websites starting at $250. CoreScale helps local businesses grow online.",  keywords: "web design, small business, affordable websites, professional website design, local business website, online presence",  robots: {
-    index: true,
-    follow: true,
-  },
-  openGraph: {
-    title: "CoreScale - Affordable Professional Websites for Small Businesses",    description: "Get a professional website for your small business starting at $250. Build trust, attract customers, and grow online with CoreScale.",    type: "website",    siteName: "CoreScale",    images: [
-      {
-        url: "http://img.b2bpic.net/free-photo/joyous-coworkers-having-fun-vibrant-office-while-reviewing-financial-graphs_482257-126650.jpg",        alt: "Professional website design for small businesses"},
-    ],
-  },
-  twitter: {
-    card: "summary_large_image",    title: "CoreScale - Professional Websites for Small Businesses",    description: "Affordable, professional web design starting at $250. Build your online presence with CoreScale.",    images: ["http://img.b2bpic.net/free-photo/joyous-coworkers-having-fun-vibrant-office-while-reviewing-financial-graphs_482257-126650.jpg"],
-  },
-};
+  title: "CoreScale - Professional Websites for Small Businesses",  description: "Affordable professional websites for small and local businesses. Build trust, attract customers, and grow your business online with CoreScale."};

 export default function RootLayout({
  children,
-}: Readonly<{
+}: {
  children: React.ReactNode;
-}>) {
+}) {
  return (
-    <html lang="en" suppressHydrationWarning>
-      <ServiceWrapper>
-        <body
-          className={`${halant.variable} ${inter.variable} ${publicSans.variable} antialiased`}
-        >
-          <Tag />
-          {children}
-        
+    <html lang="en">
+      <body className={inter.className}>{children}
        <script
          dangerouslySetInnerHTML={{
            __html: `
@@ -1416,7 +1384,6 @@ export default function RootLayout({
          }}
        />
      </body>
-      </ServiceWrapper>
    </html>
  );
 }
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -6,12 +6,40 @@ import HeroOverlay from "@/components/sections/hero/HeroOverlay";
 import TextSplitAbout from "@/components/sections/about/TextSplitAbout";
 import PricingCardTwo from "@/components/sections/pricing/PricingCardTwo";
 import FeatureCardThree from "@/components/sections/feature/featureCardThree/FeatureCardThree";
-import TestimonialCardOne from "@/components/sections/testimonial/TestimonialCardOne";
-import ContactFaq from "@/components/sections/contact/ContactFaq";
 import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
-import { ArrowRight, CheckCircle, Sparkles, Star } from "lucide-react";
+import { ArrowRight, CheckCircle, Sparkles, Phone, Mail } from "lucide-react";
+import { useState } from "react";

 export default function LandingPage() {
+  const [submitted, setSubmitted] = useState(false);
+  const [formData, setFormData] = useState({
+    fullName: "",    businessName: "",    email: "",    phone: "",    message: ""});
+
+  const handlePhoneClick = () => {
+    window.location.href = "tel:206-741-9017";
+  };
+
+  const handleEmailClick = () => {
+    window.location.href = "mailto:CoreScale.co@gmail.com";
+  };
+
+  const handleFormSubmit = (e: React.FormEvent) => {
+    e.preventDefault();
+    setSubmitted(true);
+    setFormData({
+      fullName: "",      businessName: "",      email: "",      phone: "",      message: ""});
+    setTimeout(() => setSubmitted(false), 5000);
+  };
+
+  const handleInputChange = (
+    e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>
+  ) => {
+    setFormData({
+      ...formData,
+      [e.target.name]: e.target.value,
+    });
+  };
+
  return (
    <ThemeProvider
      defaultButtonVariant="directional-hover"
@@ -32,7 +60,6 @@ export default function LandingPage() {
            { name: "About", id: "about" },
            { name: "Services", id: "services" },
            { name: "Why We Matter", id: "why-matters" },
-            { name: "Testimonials", id: "testimonials" },
            { name: "Contact", id: "contact" },
          ]}
          button={{
@@ -84,7 +111,7 @@ export default function LandingPage() {
          plans={[
            {
              id: "1",              badge: "Website Design",              badgeIcon: Sparkles,
-              price: "Starting at $250",              subtitle: "Perfect for your first website or redesign",              buttons: [
+              price: "Starting at $250",              subtitle: "Professional website starting at $250 built to help your business attract more customers online",              buttons: [
                { text: "Get Started", href: "contact" },
                { text: "Learn More", href: "#" },
              ],
@@ -125,60 +152,166 @@ export default function LandingPage() {
        />
      </div>

-      <div id="testimonials" data-section="testimonials">
-        <TestimonialCardOne
-          title="What Our Clients Say"
-          description="Real feedback from small business owners who've grown their online presence with CoreScale. With star ratings and detailed reviews, see why our clients trust us."
-          tag="Client Success"
-          tagAnimation="slide-up"
-          textboxLayout="default"
-          useInvertedBackground={false}
-          gridVariant="uniform-all-items-equal"
-          animationType="slide-up"
-          carouselMode="buttons"
-          testimonials={[
-            {
-              id: "1",              name: "Sarah Mitchell",              role: "Owner",              company: "Mitchell's Cleaning Services",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/smiling-homosexual-man-official-suit-looking-camera-close-up-shot-happy-gay-getting-dressed-wedding-ceremony-standing-hotel-room-with-his-partner-background-love-emotion-concept_74855-22675.jpg?_wi=1",              imageAlt: "Sarah Mitchell"},
-            {
-              id: "2",              name: "David Chen",              role: "Founder",              company: "Chen's Local Plumbing",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/smiling-homosexual-man-official-suit-looking-camera-close-up-shot-happy-gay-getting-dressed-wedding-ceremony-standing-hotel-room-with-his-partner-background-love-emotion-concept_74855-22675.jpg?_wi=2",              imageAlt: "David Chen"},
-            {
-              id: "3",              name: "Jennifer Rodriguez",              role: "Owner",              company: "Rodriguez Photography Studio",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/smiling-homosexual-man-official-suit-looking-camera-close-up-shot-happy-gay-getting-dressed-wedding-ceremony-standing-hotel-room-with-his-partner-background-love-emotion-concept_74855-22675.jpg?_wi=3",              imageAlt: "Jennifer Rodriguez"},
-            {
-              id: "4",              name: "Marcus Thompson",              role: "Owner",              company: "Thompson's Landscaping",              rating: 5,
-              imageSrc: "http://img.b2bpic.net/free-photo/smiling-homosexual-man-official-suit-looking-camera-close-up-shot-happy-gay-getting-dressed-wedding-ceremony-standing-hotel-room-with-his-partner-background-love-emotion-concept_74855-22675.jpg?_wi=4",              imageAlt: "Marcus Thompson"},
-          ]}
-        />
-      </div>
-
      <div id="contact" data-section="contact">
-        <ContactFaq
-          ctaTitle="Ready to Get Your Website?"
-          ctaDescription="Contact CoreScale today and let's discuss how we can help your business grow online. We're ready to answer your questions and get you started."
-          ctaButton={{
-            text: "Contact Us Now",            href: "mailto:CoreScale.co@gmail.com"}}
-          ctaIcon={ArrowRight}
-          useInvertedBackground={false}
-          animationType="slide-up"
-          accordionAnimationType="smooth"
-          showCard={true}
-          faqs={[
-            {
-              id: "1",              title: "How much does a website cost?",              content: "Website design starts at $250. This includes professional modern design, mobile-friendly layout, fast loading pages, and everything needed to build customer trust. We also offer ongoing maintenance for $50/month."},
-            {
-              id: "2",              title: "How long does it take to get a website?",              content: "We work efficiently to get your website live quickly. Most projects are completed within 2-3 weeks, depending on complexity and how quickly you provide content and feedback."},
-            {
-              id: "3",              title: "Will my website work on mobile phones?",              content: "Absolutely! All CoreScale websites are mobile-friendly and responsive. They look and work perfectly on smartphones, tablets, and desktop computers."},
-            {
-              id: "4",              title: "Can I update my website myself?",              content: "Yes! We design websites that are easy to manage. We can train you on how to make updates, or we offer monthly maintenance packages to handle updates for you."},
-            {
-              id: "5",              title: "What if I already have a website?",              content: "If your current website is outdated or not performing well, we can redesign it with modern design and better functionality. Let's discuss your needs!"},
-            {
-              id: "6",              title: "Do you provide support after launch?",              content: "Yes! We offer ongoing support through our Website Maintenance & Edits service ($50/month). We can handle updates, improvements, and technical support to keep your site running smoothly."},
-          ]}
-        />
+        <section className="w-full py-20 px-4 md:px-8 lg:px-12 bg-background">
+          <div className="max-w-4xl mx-auto">
+            {/* Header */}
+            <div className="text-center mb-12">
+              <h2 className="text-4xl md:text-5xl font-bold text-foreground mb-4">
+                Get Your Website Started
+              </h2>
+              <p className="text-lg text-foreground/80 mb-8">
+                Ready to grow your business online? Contact CoreScale today to get your professional website built quickly and affordably.
+              </p>
+            </div>
+
+            {/* Contact Information */}
+            <div className="grid md:grid-cols-2 gap-8 mb-12">
+              <div className="flex items-center gap-4 p-6 rounded-lg bg-card">
+                <Phone className="w-8 h-8 text-primary-cta flex-shrink-0" />
+                <div>
+                  <p className="text-sm text-foreground/60 mb-1">Phone</p>
+                  <a
+                    href="tel:206-741-9017"
+                    className="text-lg font-semibold text-foreground hover:text-primary-cta transition"
+                  >
+                    206-741-9017
+                  </a>
+                </div>
+              </div>
+              <div className="flex items-center gap-4 p-6 rounded-lg bg-card">
+                <Mail className="w-8 h-8 text-primary-cta flex-shrink-0" />
+                <div>
+                  <p className="text-sm text-foreground/60 mb-1">Email</p>
+                  <a
+                    href="mailto:CoreScale.co@gmail.com"
+                    className="text-lg font-semibold text-foreground hover:text-primary-cta transition"
+                  >
+                    CoreScale.co@gmail.com
+                  </a>
+                </div>
+              </div>
+            </div>
+
+            {/* Contact Form */}
+            {!submitted ? (
+              <form onSubmit={handleFormSubmit} className="bg-card p-8 rounded-lg">
+                <div className="grid md:grid-cols-2 gap-6 mb-6">
+                  <div>
+                    <label
+                      htmlFor="fullName"
+                      className="block text-sm font-medium text-foreground mb-2"
+                    >
+                      Full Name
+                    </label>
+                    <input
+                      type="text"
+                      id="fullName"
+                      name="fullName"
+                      value={formData.fullName}
+                      onChange={handleInputChange}
+                      required
+                      className="w-full px-4 py-2 rounded-lg border border-accent bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary-cta"
+                      placeholder="John Doe"
+                    />
+                  </div>
+                  <div>
+                    <label
+                      htmlFor="businessName"
+                      className="block text-sm font-medium text-foreground mb-2"
+                    >
+                      Business Name
+                    </label>
+                    <input
+                      type="text"
+                      id="businessName"
+                      name="businessName"
+                      value={formData.businessName}
+                      onChange={handleInputChange}
+                      required
+                      className="w-full px-4 py-2 rounded-lg border border-accent bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary-cta"
+                      placeholder="Your Business"
+                    />
+                  </div>
+                </div>
+
+                <div className="grid md:grid-cols-2 gap-6 mb-6">
+                  <div>
+                    <label
+                      htmlFor="email"
+                      className="block text-sm font-medium text-foreground mb-2"
+                    >
+                      Email Address
+                    </label>
+                    <input
+                      type="email"
+                      id="email"
+                      name="email"
+                      value={formData.email}
+                      onChange={handleInputChange}
+                      required
+                      className="w-full px-4 py-2 rounded-lg border border-accent bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary-cta"
+                      placeholder="your@email.com"
+                    />
+                  </div>
+                  <div>
+                    <label
+                      htmlFor="phone"
+                      className="block text-sm font-medium text-foreground mb-2"
+                    >
+                      Phone Number
+                    </label>
+                    <input
+                      type="tel"
+                      id="phone"
+                      name="phone"
+                      value={formData.phone}
+                      onChange={handleInputChange}
+                      required
+                      className="w-full px-4 py-2 rounded-lg border border-accent bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary-cta"
+                      placeholder="206-741-9017"
+                    />
+                  </div>
+                </div>
+
+                <div className="mb-6">
+                  <label
+                    htmlFor="message"
+                    className="block text-sm font-medium text-foreground mb-2"
+                  >
+                    Message
+                  </label>
+                  <textarea
+                    id="message"
+                    name="message"
+                    value={formData.message}
+                    onChange={handleInputChange}
+                    required
+                    rows={5}
+                    className="w-full px-4 py-2 rounded-lg border border-accent bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary-cta"
+                    placeholder="Tell us about your business and what you're looking for in a website..."
+                  />
+                </div>
+
+                <button
+                  type="submit"
+                  className="w-full bg-primary-cta hover:bg-primary-cta/90 text-primary-cta-text font-semibold py-3 px-6 rounded-lg transition"
+                >
+                  Request Website
+                </button>
+              </form>
+            ) : (
+              <div className="bg-green-50 border border-green-200 rounded-lg p-8 text-center">
+                <p className="text-lg font-semibold text-green-800 mb-2">
+                  Thank you for contacting CoreScale.
+                </p>
+                <p className="text-green-700">
+                  We will reach out shortly to discuss your website.
+                </p>
+              </div>
+            )}
+          </div>
+        </section>
      </div>

      <div id="footer" data-section="footer">
--- a/src/app/styles/variables.css
+++ b/src/app/styles/variables.css
@@ -12,11 +12,11 @@

  --background: #ffffff;
  --card: #f9f9f9;
-  --foreground: #000f06e6;
-  --primary-cta: #0a7039;
+  --foreground: #000612e6;
+  --primary-cta: #15479c;
  --primary-cta-text: #ffffff;
  --secondary-cta: #f9f9f9;
-  --secondary-cta-text: #000f06e6;
+  --secondary-cta-text: #000612e6;
  --accent: #e2e2e2;
  --background-accent: #c4c4c4;
Author	SHA1	Message	Date
bender	0d4a62f433	Update src/app/page.tsx	2026-03-06 04:04:21 +00:00
bender	3fac4b6d68	Update src/app/layout.tsx	2026-03-06 04:04:21 +00:00
bender	e009f2ed81	Merge version_8 into main Merge version_8 into main	2026-03-06 03:58:12 +00:00
bender	b9a63f0fc6	Update src/app/page.tsx	2026-03-06 03:58:08 +00:00
bender	fdf07f2a24	Merge version_7 into main Merge version_7 into main	2026-03-06 03:41:52 +00:00
bender	4886572a14	Update src/app/page.tsx	2026-03-06 03:41:48 +00:00
bender	ca28dc5047	Merge version_7 into main Merge version_7 into main	2026-03-06 03:40:52 +00:00
bender	43e66bf416	Update src/app/page.tsx	2026-03-06 03:40:48 +00:00
bender	ef03615c9d	Merge version_6 into main Merge version_6 into main	2026-03-06 03:35:37 +00:00
bender	3c39d8d459	Update src/app/page.tsx	2026-03-06 03:35:33 +00:00
bender	17a1fc9a75	Merge version_5 into main Merge version_5 into main	2026-03-06 03:18:25 +00:00
bender	6dc0f9905e	Update src/app/page.tsx	2026-03-06 03:18:21 +00:00
bender	8d36a7f9cd	Merge version_4 into main Merge version_4 into main	2026-03-06 03:16:41 +00:00
bender	41bf64043b	Update theme colors	2026-03-06 03:16:35 +00:00
bender	a9183bd3e2	Merge version_4 into main Merge version_4 into main	2026-03-06 03:15:04 +00:00
bender	9734e36ef4	Update src/app/page.tsx	2026-03-06 03:15:00 +00:00
bender	cfe23a3b4c	Update src/app/layout.tsx	2026-03-06 03:14:59 +00:00
bender	b920a10d71	Merge version_3 into main Merge version_3 into main	2026-03-06 03:11:57 +00:00
bender	80b174ab75	Update src/app/page.tsx	2026-03-06 03:11:53 +00:00
bender	f45c543c97	Merge version_2 into main Merge version_2 into main	2026-03-06 03:08:18 +00:00