diff --git a/package-lock.json b/package-lock.json index c74b2c2..06dafab 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,6 +14,7 @@ "react": "^18.3.1", "react-dom": "^18.3.1", "react-icons": "^5.4.0", + "react-router-dom": "^7.7.1", "react-use": "^17.6.0", "sonner": "^2.0.6" }, @@ -1984,6 +1985,15 @@ "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==", "dev": true }, + "node_modules/cookie": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/cookie/-/cookie-1.0.2.tgz", + "integrity": "sha512-9Kr/j4O16ISv8zBBhJoi4bXOYNTkFLOqSL3UDB0njXxCXNezjeyVrJyGOWtgfs/q2km1gwBcfH8q1yEGoMYunA==", + "license": "MIT", + "engines": { + "node": ">=18" + } + }, "node_modules/copy-to-clipboard": { "version": "3.3.3", "resolved": "https://registry.npmjs.org/copy-to-clipboard/-/copy-to-clipboard-3.3.3.tgz", @@ -4487,6 +4497,44 @@ "node": ">=0.10.0" } }, + "node_modules/react-router": { + "version": "7.7.1", + "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.7.1.tgz", + "integrity": "sha512-jVKHXoWRIsD/qS6lvGveckwb862EekvapdHJN/cGmzw40KnJH5gg53ujOJ4qX6EKIK9LSBfFed/xiQ5yeXNrUA==", + "license": "MIT", + "dependencies": { + "cookie": "^1.0.1", + "set-cookie-parser": "^2.6.0" + }, + "engines": { + "node": ">=20.0.0" + }, + "peerDependencies": { + "react": ">=18", + "react-dom": ">=18" + }, + "peerDependenciesMeta": { + "react-dom": { + "optional": true + } + } + }, + "node_modules/react-router-dom": { + "version": "7.7.1", + "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.7.1.tgz", + "integrity": "sha512-bavdk2BA5r3MYalGKZ01u8PGuDBloQmzpBZVhDLrOOv1N943Wq6dcM9GhB3x8b7AbqPMEezauv4PeGkAJfy7FQ==", + "license": "MIT", + "dependencies": { + "react-router": "7.7.1" + }, + "engines": { + "node": ">=20.0.0" + }, + "peerDependencies": { + "react": ">=18", + "react-dom": ">=18" + } + }, "node_modules/react-universal-interface": { "version": "0.6.2", "resolved": "https://registry.npmjs.org/react-universal-interface/-/react-universal-interface-0.6.2.tgz", @@ -4788,6 +4836,12 @@ "semver": "bin/semver.js" } }, + "node_modules/set-cookie-parser": { + "version": "2.7.1", + "resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.1.tgz", + "integrity": "sha512-IOc8uWeOZgnb3ptbCURJWNjWUPcO3ZnTTdzsurqERrP6nPyv+paC55vJM0LpOlT2ne+Ix+9+CRG1MNLlyZ4GjQ==", + "license": "MIT" + }, "node_modules/set-function-length": { "version": "1.2.2", "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.2.tgz", diff --git a/package.json b/package.json index ca954f8..79a2e8d 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,7 @@ "react": "^18.3.1", "react-dom": "^18.3.1", "react-icons": "^5.4.0", + "react-router-dom": "^7.7.1", "react-use": "^17.6.0", "sonner": "^2.0.6" }, diff --git a/src/App.jsx b/src/App.jsx index ff44d4d..33a500e 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -1,5 +1,10 @@ import React from 'react' import { Toaster } from 'sonner' +import { BrowserRouter as Router, Routes, Route } from "react-router-dom"; +import Header from "./components/Header"; +import Home from "./pages/Home"; +import Nexus from "./pages/Nexus"; +import Vault from "./pages/Vault"; import Hero from './components/Hero' import About from './components/About' import Navbar from './components/Navbar' @@ -15,70 +20,78 @@ import { GameProvider } from './context/GameContext' const App = () => { return ( - + -
- - - - - - - -
- -
- -
-
+ }} + /> +
+ + + + + + + +
+ +
+ +
+
+ + } /> + } /> + } /> + {/* Add more routes as needed */} + + ) } diff --git a/src/components/Header.css b/src/components/Header.css new file mode 100644 index 0000000..f470ca7 --- /dev/null +++ b/src/components/Header.css @@ -0,0 +1,17 @@ +.header { + background: #111; + padding: 1rem; +} +.nav-list { + display: flex; + gap: 2rem; + list-style: none; +} +.nav-list a { + color: #fff; + text-decoration: none; + font-weight: bold; +} +.nav-list a:hover { + text-decoration: underline; +} \ No newline at end of file diff --git a/src/components/Header.jsx b/src/components/Header.jsx new file mode 100644 index 0000000..67e48e7 --- /dev/null +++ b/src/components/Header.jsx @@ -0,0 +1,17 @@ +import { Link } from "react-router-dom"; +import "./Header.css"; // Optional: for styling + +export default function Header() { + return ( +
+ +
+ ); +} \ No newline at end of file diff --git a/src/main.jsx b/src/main.jsx index b9a1a6d..baf95eb 100644 --- a/src/main.jsx +++ b/src/main.jsx @@ -1,10 +1,10 @@ -import { StrictMode } from 'react' -import { createRoot } from 'react-dom/client' +import React from "react"; +import ReactDOM from "react-dom/client"; +import App from "./App"; import './index.css' -import App from './App.jsx' -createRoot(document.getElementById('root')).render( - +ReactDOM.createRoot(document.getElementById("root")).render( + - , -) + +); diff --git a/src/pages/Home.jsx b/src/pages/Home.jsx new file mode 100644 index 0000000..194764a --- /dev/null +++ b/src/pages/Home.jsx @@ -0,0 +1,3 @@ +export default function Home() { + return
Welcome to SCR Gaming Home!
; +} \ No newline at end of file diff --git a/src/pages/Nexus.jsx b/src/pages/Nexus.jsx new file mode 100644 index 0000000..da6a1da --- /dev/null +++ b/src/pages/Nexus.jsx @@ -0,0 +1,3 @@ +export default function Nexus() { + return
This is the Nexus page.
; +} \ No newline at end of file diff --git a/src/pages/Vault.jsx b/src/pages/Vault.jsx new file mode 100644 index 0000000..3776bb0 --- /dev/null +++ b/src/pages/Vault.jsx @@ -0,0 +1,3 @@ +export default function Vault() { + return
This is the Vault page.
; +} \ No newline at end of file