Nav Bar correct and iframe2

components/layout/layout-wrapper.tsx

@@ -1,10 +1,8 @@
 "use client";
 
 import { MainNav } from "@/components/main-nav";
-import { Footer } from "@/components/footer";
 import { AuthCheck } from "@/components/auth/auth-check";
 import { Toaster } from "@/components/ui/toaster";
-import { useBackgroundImage } from "@/components/background-switcher";
 
 interface LayoutWrapperProps {
   children: React.ReactNode;
@@ -17,8 +15,6 @@ export function LayoutWrapper({
   isSignInPage,
   isAuthenticated,
 }: LayoutWrapperProps) {
-  const { currentBackground, changeBackground } = useBackgroundImage();
-
   if (isSignInPage) {
     return <>{children}</>;
   }
@@ -26,29 +22,13 @@ export function LayoutWrapper({
   return (
     <AuthCheck>
       <div className="min-h-screen bg-black">
-        <nav className="h-20 bg-black/20 px-4">
+        <nav className="h-16 bg-black/20 px-4">
           {!isSignInPage && isAuthenticated && <MainNav />}
         </nav>
-        <main className="h-[calc(100vh-5rem)]">
-          <div 
-            style={
-              {
-                backgroundImage: `url('${currentBackground}')`,
-                backgroundSize: 'cover',
-                backgroundPosition: 'center',
-                backgroundRepeat: 'no-repeat',
-                backgroundAttachment: 'fixed',
-                cursor: 'pointer',
-                transition: 'background-image 0.5s ease-in-out'
-              }
-            }
-            onClick={!isSignInPage ? changeBackground : undefined}
-          >
-            {children}
-          </div>
+        <main className="h-[calc(100vh-4rem)]">
+          {children}
         </main>
       </div>
-      {!isSignInPage && isAuthenticated && <Footer />}
       <Toaster />
     </AuthCheck>
   );