diff --git a/frontend/public/UNO_Logo.svg b/frontend/public/UNO_Logo.svg
new file mode 100644
index 0000000..278a3ed
--- /dev/null
+++ b/frontend/public/UNO_Logo.svg
@@ -0,0 +1,175 @@
+
+
+
+
\ No newline at end of file
diff --git a/frontend/src/index.css b/frontend/src/index.css
index b5c61c9..a168df0 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -1,3 +1,7 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
+
+body::-webkit-scrollbar {
+ display: none;
+}
diff --git a/frontend/src/library/button.tsx b/frontend/src/library/button.tsx
index d9f5396..319076e 100644
--- a/frontend/src/library/button.tsx
+++ b/frontend/src/library/button.tsx
@@ -11,7 +11,14 @@ type ButtonProps = {
};
function Button({ onClick, children }: ButtonProps) {
- return ;
+ return (
+
+ );
}
export default Button;
diff --git a/frontend/src/library/heading.tsx b/frontend/src/library/heading.tsx
index e69de29..510cf54 100644
--- a/frontend/src/library/heading.tsx
+++ b/frontend/src/library/heading.tsx
@@ -0,0 +1,13 @@
+type InputProps = {
+ name?: string;
+};
+
+const heading = ({ name }: InputProps) => {
+ return (
+
+
{name}
+
+ );
+};
+
+export default heading;
diff --git a/frontend/src/pages/PlayOptions.tsx b/frontend/src/pages/PlayOptions.tsx
index 6600ba6..df10c29 100644
--- a/frontend/src/pages/PlayOptions.tsx
+++ b/frontend/src/pages/PlayOptions.tsx
@@ -1,26 +1,61 @@
+import { useState } from 'react';
import { useNavigate } from 'react-router-dom';
-import Input from '../library/input';
import Button from '../library/button';
+import Heading from '../library/heading';
+import '../index.css';
-function PlayOptions() {
+const PlayOptions = () => {
+ const [gameCode, setGameCode] = useState('');
const navigate = useNavigate();
- function handleCreateGame() {
- console.log('Creating a new game');
+ const CreateGame = () => {
+ // Logic to create a game
+ console.log('Create Game');
navigate('/game');
- }
+ };
+
+ const JoinGame = () => {
+ // Logic to join a game
+ console.log('Join Game with code:', gameCode);
+ };
return (
- <>
-
-
Create a new game
-
-
-
-
Join a game
-
+
+
+
+
+
+ Ready for Action?
+
+
+
+
+
+
+
+
+
+ setGameCode(e.target.value)}
+ className="border-2 border-red-600 rounded-lg p-1 mb-4 text-md w-full bg-black text-white"
+ />
+
+
+
+
-
+
);
-}
+};
export default PlayOptions;