Update buttons to Links for semantic HTML; Create new page for Disclaimers

Author: leekahung

frontend/src/About.tsx

@@ -1,14 +1,12 @@
-import { useNavigate } from "react-router-dom";
+import { Link } from "react-router-dom";
 
 export default function About() {
-  const navigate = useNavigate();
-
   return (
-    <div className="flex items-center h-dvh pt-16 sm:pt-0">
+    <div className="flex items-center pt-16 sm:mt-26 sm:pt-0">
       <div className="relative max-w-2xl m-auto p-8 bg-[#F4F4F2] rounded-lg shadow-md">
-        <button
+        <Link
           className="absolute top-4 left-4 flex text-[#4a90e2] hover:text-[#3a7bc8] font-semibold cursor-pointer"
-          onClick={() => navigate(-1)}
+          to="/"
           aria-label="Go back"
         >
           <svg
@@ -25,7 +23,7 @@ export default function About() {
             />
           </svg>
           Back
-        </button>
+        </Link>
         <p className="my-6">
           <strong>Tenant First Aid</strong> is an AI-powered chatbot designed to
           help tenants navigate rental issues, answer questions, and provides

frontend/src/App.tsx

@@ -3,6 +3,7 @@ import Chat from "./Chat";
 import About from "./About";
 import SessionContextProvider from "./contexts/SessionContext";
 import Navbar from "./pages/Chat/components/Navbar";
+import Disclaimer from "./Disclaimer";
 
 export default function App() {
   return (
@@ -12,6 +13,7 @@ export default function App() {
         <Routes>
           <Route path="/" element={<Chat />} />
           <Route path="/about" element={<About />} />
+          <Route path="/disclaimer" element={<Disclaimer />} />
         </Routes>
       </Router>
     </SessionContextProvider>