Creating about me page

Author: rps9

.DS_Store

@@ -3,15 +3,21 @@ import Home from './pages/Home';
 import Darts from './pages/Darts';
 import Cricket from './pages/Cricket';
 import X01 from './pages/X01';
+import AboutMe from './pages/AboutMe';
+import ScrollToTop from "./components/ScrollToTop";
 
 export default function App() {
   return (
-    <Routes>
-      <Route path="/home" element={<Home />} />
-      <Route path="/darts" element={<Darts />} />
-      <Route path="/darts/cricket" element={<Cricket />} />
-      <Route path="/darts/x01" element={<X01 />} />
-      <Route path="*" element={<Home />} />
-    </Routes>
+    <>
+      <ScrollToTop />
+      <Routes>
+        <Route path="/home" element={<Home />} />
+        <Route path="/darts" element={<Darts />} />
+        <Route path="/darts/cricket" element={<Cricket />} />
+        <Route path="/darts/x01" element={<X01 />} />
+        <Route path="/about-me" element={<AboutMe />} />
+        <Route path="*" element={<Home />} />
+      </Routes>
+    </>
   );
 }

assets/.DS_Store

@@ -6,7 +6,7 @@ type NavItem = { label: string; href: string };
 
 const HOME_HREF = "/";
 const MENU_LABEL = "Explore";
-const MENU_ITEMS: NavItem[] = [{ label: "Darts", href: "/darts" }];
+const MENU_ITEMS: NavItem[] = [{ label: "Darts", href: "/darts" },{ label: "About Me", href: "/about-me" }];
 
 export default function Header() {
   const [open, setOpen] = useState(false);

assets/images/biwa.png

@@ -0,0 +1,12 @@
+// used to bring the user to the top of the page whenever they are navigating to a new one
+
+import { useEffect } from "react";
+import { useLocation } from "react-router-dom";
+
+export default function ScrollToTop() {
+	useEffect(() => {
+		window.scrollTo({ top: 0, left: 0, behavior: "instant" as ScrollBehavior });
+	}, [useLocation().pathname]);
+
+	return null;
+}