From 90c074dd6f748650ebd8d0e9381e5c44e56a2441 Mon Sep 17 00:00:00 2001
From: JeffEmmett <20747463-JeffEmmett@users.noreply.replit.com>
Date: Fri, 13 Jun 2025 18:50:16 +0000
Subject: [PATCH] Improve footer layout by moving newsletter signup section to
 the right

Refactors the footer component to use a 4-column grid, repositioning the newsletter signup section.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: d004b9e1-f9be-46e2-acda-f440ccd644a9
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/af8dabca-e746-4e53-9c29-d8d4d9cf30f5/fad791f0-6b01-4e85-8ebb-cdf6a9516a7d.jpg
---
 client/src/components/navigation/footer.tsx | 18 ++++++++----------
 1 file changed, 8 insertions(+), 10 deletions(-)

diff --git a/client/src/components/navigation/footer.tsx b/client/src/components/navigation/footer.tsx
index 2874f52..3619f2d 100644
--- a/client/src/components/navigation/footer.tsx
+++ b/client/src/components/navigation/footer.tsx
@@ -62,7 +62,7 @@ export default function Footer() {
   return (
     <footer className="bg-teal text-white py-12">
       <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
-        <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
+        <div className="grid grid-cols-1 md:grid-cols-4 gap-8">
           <div>
             <img 
               src={SquareLogo} 
@@ -139,14 +139,12 @@ export default function Footer() {
               </li>
             </ul>
           </div>
-        </div>
-        
-        {/* Newsletter Signup Section */}
-        <div className="border-t border-white border-opacity-20 mt-12 pt-8 pb-8">
-          <div className="max-w-sm mx-auto text-center">
-            <h4 className="text-lg font-playfair font-semibold mb-3 text-white">
+
+          {/* Newsletter Signup Section */}
+          <div>
+            <h3 className="font-playfair font-bold text-lg mb-4 text-white">
               Newsletter Signup
-            </h4>
+            </h3>
             <form onSubmit={handleNewsletterSubmit} className="space-y-3">
               <input 
                 type="email" 
@@ -157,10 +155,10 @@ export default function Footer() {
                 required
               />
               
-              <div className="flex items-center justify-center gap-2">
+              <div className="flex items-start gap-2">
                 <input 
                   type="checkbox" 
-                  className="flex-shrink-0"
+                  className="mt-1 flex-shrink-0"
                   checked={agreedToTerms}
                   onChange={(e) => setAgreedToTerms(e.target.checked)}
                   required