Updated Body

CODECHAMPS7 · Sep 21, 2024 · 7c31baa · 7c31baa
1 parent 75ce537
commit 7c31baa
Show file tree

Hide file tree

Showing 4 changed files with 50 additions and 60 deletions.
diff --git a/src/App.jsx b/src/App.jsx
@@ -1,43 +1,43 @@
-import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
+import { BrowserRouter as Router, Routes, Route, Outlet } from 'react-router-dom';
 
 import Home from './components/Home';
 import Body from './components/Body';
 import Login from './Pages/Login';
-import Signup from './Pages/SIgnup';  
+import Signup from './Pages/SIgnup';  // Fix casing for Signup
 import Dashboard from './Pages/Dashboard';
 import Profile from './Pages/profile';
 import Footer from './components/Footer';
 import Quiz from './Pages/Quiz';
-import Navbar from './components/Navbar'; 
 
-function App() {
+const Layout = () => {
   return (
-    <Router>
-      <div className="flex flex-col min-h-screen">
-
-        <Navbar /> 
-
-
-        <div className="flex-grow">
-          <Routes>
-
-            <Route path="/" element={<Home />} />
+    <div className="flex flex-col min-h-screen">
+      <Home />
+      <div className="flex-grow">
+        <Outlet />
+      </div>
+      <Footer />
+    </div>
+  );
+}
 
-
-            <Route path="/dashboard" element={<Dashboard />} />
-            <Route path="/" element={<Body />} />
-            <Route path="/login" element={<Login />} />
-            <Route path="/signup" element={<Signup />} />
-            <Route path="/profile" element={<Profile />} />
-            <Route path="/quiz" element={<Quiz />} />
-          </Routes>
-        </div>
 
-
-        <Footer />
-      </div>
+function App() {
+  return (
+    <Router>
+      <Routes>
+
+        <Route path="/" element={<Layout />}>
+          <Route path="/" element={<Body />} />
+          <Route path="login" element={<Login />} />
+          <Route path="signup" element={<Signup />} /> 
+          <Route path="dashboard" element={<Dashboard />} />
+          <Route path="profile" element={<Profile />} />
+          <Route path='Quiz' element ={<Quiz />}></Route>
+        </Route>
+      </Routes>
     </Router>
   );
 }
 
-export default App;
+export default App;
diff --git a/src/Pages/Announcement.jsx b/src/Pages/Announcement.jsx
@@ -1,23 +1,19 @@
-import Banner from "./Banner";
 import { useState } from "react";
 
 const Announcement = () => {
   const [currentContent, setCurrentContent] = useState('');
 
   return (
     <div className="p-10">
-      {/* Banner Section */}
-      <Banner />
-
       {/* Announcements Section */}
-
-      <div className="p-10">
-      <h2 className="text-3xl font-semibold mb-5">Latest Announcements</h2>
-      <ul className="list-disc ml-5 space-y-2">
-        <li>Government introduces new tax reform policies.</li>
-        <li>COVID-19 vaccination drive for all citizens.</li>
-        <li>Upcoming examinations scheduled for next month.</li>
-      </ul>
+      <div>
+        <h2 className="text-3xl font-semibold mb-5">Latest Announcements</h2>
+        <ul className="list-disc ml-5 space-y-2">
+          <li>Government introduces new tax reform policies.</li>
+          <li>COVID-19 vaccination drive for all citizens.</li>
+          <li>Upcoming examinations scheduled for next month.</li>
+        </ul>
+      </div>
 
       {/* Links Section */}
       <div className="p-10">
@@ -60,20 +56,18 @@ const Announcement = () => {
             Form Fillup
           </button>
         </div>
-        </div>
+      </div>
 
-        {/* Conditionally display selected content */}
-        <div className="mt-10 p-5 bg-gray-100 rounded-lg">
-          {currentContent ? (
-            <h3>{currentContent}</h3>
-          ) : (
-            <h3>Select a category to display information</h3>
-          )}
-        </div>
+      {/* Conditionally display selected content */}
+      <div className="mt-10 p-5 bg-gray-100 rounded-lg">
+        {currentContent ? (
+          <h3>{currentContent}</h3>
+        ) : (
+          <h3>Select a category to display information</h3>
+        )}
       </div>
 
       {/* Footer Section */}
-
     </div>
   );
 };

diff --git a/src/components/Body.jsx b/src/components/Body.jsx
@@ -1,13 +1,11 @@
-import Announcement from "../Pages/Announcement"; // Make sure the spelling is correct
-import Banner from "../Pages/Banner";
+import Banner from "../Pages/Banner"
+import Announcement from "../Pages/Announcement"
 
 const Body = () => {
   return (
-    <div>
-      <h1>Body</h1>
-
-      <Banner />
-      <Announcement />
+    <div>    
+       <Banner/>
+      <Announcement/> 
     </div>
   );
 }

diff --git a/src/components/Home.jsx b/src/components/Home.jsx
@@ -1,11 +1,9 @@
-import Announcement from "../Pages/Announcement";
-
+import Navbar from "./Navbar"
 
 const Home = () => {
   return (
     <div>
-      {/* Main homepage content */}
-      <Announcement/>
+      <Navbar/>
     </div>
   );
 };