navbar is now consistent across all pages

Author: TR-04

frontend/src/components/Layout.tsx

@@ -4,10 +4,14 @@ import React from 'react';
 
 const Layout = ({ children }: { children: React.ReactNode }) => {
   return (
-    <section className="flex flex-col min-h-screen justify-between py-8 xl:px-24 md:px-10 px-5 relative">
+    <section className="flex flex-col min-h-screen justify-between py-8 relative">
       <Navbar />
-      {children}
-      <Footer />
+      
+      <div className='xl:px-24 md:px-10 px-5 '>
+        {children}
+        <Footer />
+      </div>
+      
     </section>
   );
 };

frontend/src/pages/events.tsx

@@ -5,10 +5,14 @@ import Events from '@/components/Event';
 
 export default function EventsPage() {
   return (
-    <section className="flex flex-col min-h-screen justify-between py-8 xl:px-24 md:px-10 px-5 relative">
+    <section className="flex flex-col min-h-screen justify-between py-8 relative">
       <Navbar />
-      <Events/>
-      <Footer />
+      
+      <div className='xl:px-24 md:px-10 px-5 '>
+        <Events/>
+        <Footer />
+      </div>
+      
     </section>
   );
 }