[#37] Login & Register Page UI

https://project.mdnd-it.cc/work_packages/37

SerpentRace_Frontend/src/App.jsx

@@ -1,26 +1,47 @@
-import { useState } from 'react'
+import { useState, useEffect } from "react";
+import { BrowserRouter as Router, Route, Routes } from "react-router-dom";
+import AuthRegister from "./pages/Auth/AuthRegister";
+import AuthLogin from "./pages/Auth/AuthLogin";
+import EmailVerification from "./pages/Auth/EmailVerification";
+import Test from "./pages/Testing/Test";
+
 
 function App() {
-  const [count, setCount] = useState(0)
+  const [isMobile, setIsMobile] = useState(false);
+
+  useEffect(() => {
+    const handleResize = () => {
+      setIsMobile(window.innerWidth <= 1280);
+    };
+
+    handleResize();
+    window.addEventListener("resize", handleResize);
+
+    return () => window.removeEventListener("resize", handleResize);
+  }, []);
+
+  // if (isMobile) {
+  //   return (
+  //     <Router>
+  //       <Routes>
+  //         <Route path="/register" element={<AuthRegister />} />
+  //         <Route path="/login" element={<AuthLogin />} />
+  //         <Route path="/verify-email" element={<EmailVerification />} />
+  //       </Routes>
+  //     </Router>
+  //   );
+  // }
 
   return (
-    <>
-    <div className="flex flex-col items-center bg-background justify-center min-h-screen">
-      <p className="text-text text-[60px]">primary</p>
-      <p className="text-text-muted text-[60px]">secondary</p>
-      <p className="text-accent text-[60px]">accent</p>
-      <p className="text-background text-[60px]">background</p>
-      <p className="text-surface text-[60px]">surface</p>
-      <p className="text-card text-[60px]">card</p>
-      <p className="text-text text-[60px]">text</p>
-      <p className="text-text-muted text-[60px]">text-muted</p>
-      <p className="text-text-inverse text-[60px]">text-inverse</p>
-      <p className="text-success text-[60px]">success</p>
-      <p className="text-warning text-[60px]">warning</p>
-      <p className="text-error text-[60px]">error</p>
-    </div>
-    </>
-  )
+    <Router>
+      <Routes>
+        <Route path="/register" element={<AuthRegister />} />
+        <Route path="/login" element={<AuthLogin />} />
+        <Route path="/verify-email" element={<EmailVerification />} />
+        <Route path="/test" element={<Test />} />
+      </Routes>
+    </Router>
+  );
 }
 
-export default App
+export default App;