- Updated the icons;

- Extracted the Layout into its own component;

src/pages/exam.tsx

@@ -20,6 +20,7 @@ import {v4 as uuidv4} from "uuid";
 import useUser from "@/hooks/useUser";
 import useExamStore from "@/stores/examStore";
 import Sidebar from "@/components/Sidebar";
+import Layout from "@/components/High/Layout";
 
 export const getServerSideProps = withIronSessionSsr(({req, res}) => {
 	const user = req.session.user;
@@ -208,15 +209,7 @@ export default function Page() {
 				<link rel="icon" href="/favicon.ico" />
 			</Head>
 			<ToastContainer />
-			{user && (
-				<main className="w-full h-[100vh] flex flex-col bg-mti-gray-smoke">
-					<Navbar user={user} />
-					<div className="h-full w-full flex py-4 pb-8 gap-2">
-						<Sidebar path="/exam" />
-						<div className="w-5/6 h-full mr-8 bg-white shadow-md rounded-2xl p-12 flex flex-col gap-12">{renderScreen()}</div>
-					</div>
-				</main>
-			)}
+			{user && <Layout user={user}>{renderScreen()}</Layout>}
 		</>
 	);
 }