Update src/components/Layout.tsx

src/components/Layout.tsx

@@ -1,5 +1,5 @@
-import FooterBrand from '@/components/sections/footer/FooterBrand';
-import NavbarFloating from '@/components/ui/NavbarFloating';
+import FooterSimpleMedia from '@/components/sections/footer/FooterSimpleMedia';
+import NavbarCentered from '@/components/ui/NavbarCentered';
 import SiteBackgroundSlot from "@/components/ui/SiteBackgroundSlot";
 import { Outlet } from 'react-router-dom';
 import { StyleProvider } from "@/components/ui/StyleProvider";
@@ -7,91 +7,80 @@ import { StyleProvider } from "@/components/ui/StyleProvider";
 export default function Layout() {
   const navItems = [
   {
-    "name": "Home",
-    "href": "#hero"
+    "name": "Home",    "href": "#hero"
   },
   {
-    "name": "Rooms",
-    "href": "#rooms"
+    "name": "About",    "href": "#about"
   },
   {
-    "name": "Amenities",
-    "href": "#amenities"
+    "name": "Amenities",    "href": "#amenities"
   },
   {
-    "name": "Gallery",
-    "href": "#gallery"
+    "name": "Rooms",    "href": "#rooms"
   },
   {
-    "name": "Testimonials",
-    "href": "#testimonials"
+    "name": "Testimonials",    "href": "#testimonials"
   },
   {
-    "name": "Contact",
-    "href": "#contact"
+    "name": "Contact",    "href": "#contact"
   },
   {
-    "name": "About",
-    "href": "#about"
+    "name": "Social Proof",    "href": "#social-proof"
   }
 ];
 
   return (
     <StyleProvider buttonVariant="stagger" siteBackground="floatingGradient" heroBackground="gradientBars">
       <SiteBackgroundSlot />
-      <NavbarFloating
-      logo="Grand Lux Hotel"
+      <NavbarCentered
       ctaButton={{
-        text: "Book Now",
-        href: "#contact",
-      }}
+        text: "Book Now",        href: "#contact"}}
+      logo="The Grand Haven Hotel"
      navItems={navItems} />
       <main className="flex-grow">
         <Outlet />
       </main>
-      <FooterBrand
-      brand="Grand Lux Hotel"
+      <FooterSimpleMedia
+      imageSrc="https://storage.googleapis.com/webild/default/no-image.jpg?id=5y0z2x"
+      brand="The Grand Haven Hotel"
       columns={[
         {
-          items: [
+          title: "About Us",          items: [
             {
-              label: "About Us",
-              href: "#about",
-            },
+              label: "Our Story",              href: "#about"},
             {
-              label: "Rooms & Suites",
-              href: "#rooms",
-            },
+              label: "Amenities",              href: "#amenities"},
             {
-              label: "Amenities",
-              href: "#amenities",
-            },
-            {
-              label: "Gallery",
-              href: "#gallery",
-            },
+              label: "Careers",              href: "#"},
           ],
         },
         {
-          items: [
+          title: "Rooms & Suites",          items: [
             {
-              label: "Contact",
-              href: "#contact",
-            },
+              label: "Deluxe Rooms",              href: "#rooms"},
             {
-              label: "Careers",
-              href: "#",
-            },
+              label: "Executive Suites",              href: "#rooms"},
             {
-              label: "Privacy Policy",
-              href: "#",
-            },
-            {
-              label: "Terms of Service",
-              href: "#",
-            },
+              label: "Presidential Suite",              href: "#rooms"},
           ],
         },
+        {
+          title: "Stay Connected",          items: [
+            {
+              label: "Contact",              href: "#contact"},
+            {
+              label: "Reservations",              href: "#"},
+            {
+              label: "Guest Services",              href: "#"},
+          ],
+        },
+      ]}
+      copyright="© 2024 The Grand Haven Hotel. All rights reserved."
+      links={[
+        {
+          label: "Privacy Policy",          href: "#"},
+        {
+          label: "Terms of Service",          href: "#"},
       ]}
     />
     </StyleProvider>