update

src/components/Layout/Centered.tsx

@@ -0,0 +1,13 @@
+import React, { PropsWithChildren } from 'react'
+
+interface CenteredProps extends PropsWithChildren { }
+
+const Centered = ({ children }: CenteredProps) => {
+    return (
+        <div className='w-full flex flex-col items-center px-4 sm:px-10'>
+            {children}
+        </div>
+    )
+}
+
+export default Centered

src/components/Layout/MainLayout.tsx

@@ -0,0 +1,21 @@
+import { ReactNode } from 'react'
+import Footer from '../Footer/Footer';
+import Header from '../Blocks/Header/Header';
+
+interface LayoutProps {
+    children: ReactNode;
+}
+
+export default function MainLayout({ children }: LayoutProps) {
+    return (
+        <div className="min-h-screen flex flex-col">
+            <Header />
+
+            <main className="flex-1 px-6 py-4">
+                {children}
+            </main>
+
+            <Footer />
+        </div>
+    );
+}