From d45295ba1ccb9ceb4165cf0b81f60b135a147938 Mon Sep 17 00:00:00 2001 From: realtradam Date: Fri, 28 Jun 2024 15:37:18 -0400 Subject: add sidebar --- react-frontend/index.html | 17 +++++++++++++---- react-frontend/package-lock.json | 10 ++++++++++ react-frontend/package.json | 1 + react-frontend/src/components/Layout.tsx | 29 +++++++++++++++++++++++++++-- react-frontend/src/index.css | 4 ++++ react-frontend/src/pages/Home.tsx | 6 +++--- 6 files changed, 58 insertions(+), 9 deletions(-) diff --git a/react-frontend/index.html b/react-frontend/index.html index e4b78ea..577b83e 100644 --- a/react-frontend/index.html +++ b/react-frontend/index.html @@ -1,13 +1,22 @@ - + - Vite + React + TS + Game Holster + + + - -
+ +
diff --git a/react-frontend/package-lock.json b/react-frontend/package-lock.json index 1545f96..920fd12 100644 --- a/react-frontend/package-lock.json +++ b/react-frontend/package-lock.json @@ -10,6 +10,7 @@ "dependencies": { "react": "^18.3.1", "react-dom": "^18.3.1", + "react-icons": "^5.2.1", "react-router-dom": "^6.24.0", "rsuite": "^5.64.2" }, @@ -3496,6 +3497,15 @@ "react": "^18.3.1" } }, + "node_modules/react-icons": { + "version": "5.2.1", + "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-5.2.1.tgz", + "integrity": "sha512-zdbW5GstTzXaVKvGSyTaBalt7HSfuK5ovrzlpyiWHAFXndXTdd/1hdDHI4xBM1Mn7YriT6aqESucFl9kEXzrdw==", + "license": "MIT", + "peerDependencies": { + "react": "*" + } + }, "node_modules/react-is": { "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", diff --git a/react-frontend/package.json b/react-frontend/package.json index c031a51..b20bafa 100644 --- a/react-frontend/package.json +++ b/react-frontend/package.json @@ -12,6 +12,7 @@ "dependencies": { "react": "^18.3.1", "react-dom": "^18.3.1", + "react-icons": "^5.2.1", "react-router-dom": "^6.24.0", "rsuite": "^5.64.2" }, diff --git a/react-frontend/src/components/Layout.tsx b/react-frontend/src/components/Layout.tsx index 9221687..8b87634 100644 --- a/react-frontend/src/components/Layout.tsx +++ b/react-frontend/src/components/Layout.tsx @@ -1,11 +1,36 @@ import { Outlet } from "react-router-dom"; +import { IconButton, Button, ButtonGroup } from 'rsuite'; +import { Icon } from '@rsuite/icons'; +import { FaUser } from "react-icons/fa6"; +import { FaGamepad } from "react-icons/fa"; +import { GiCowboyHolster } from "react-icons/gi"; +import { GrAdd } from "react-icons/gr"; export default function Layout() { return( <> -
sidebar
- +
+
+
+
+ {/*}>Log In*/} + + + + +
+
+
+
+ }>Browse Games + }>Upload Game +
+
+
+ +
+
); } diff --git a/react-frontend/src/index.css b/react-frontend/src/index.css index a90f074..ac216f5 100644 --- a/react-frontend/src/index.css +++ b/react-frontend/src/index.css @@ -2,3 +2,7 @@ @tailwind components; @tailwind utilities; +* { + /*border: 1px solid red;*/ +} + diff --git a/react-frontend/src/pages/Home.tsx b/react-frontend/src/pages/Home.tsx index 1fe2c83..2f15dd3 100644 --- a/react-frontend/src/pages/Home.tsx +++ b/react-frontend/src/pages/Home.tsx @@ -1,10 +1,10 @@ -import { Button } from 'rsuite'; export default function Home() { return( <> -

Welcome to Game Holster

- +
+

Welcome to Game Holster

+
); } -- cgit v1.2.3