diff --git a/front/src/index.css b/front/src/index.css index f025d51..2f1d0f5 100644 --- a/front/src/index.css +++ b/front/src/index.css @@ -1,10 +1,16 @@ :root { --main-bg-color: #282828; - --primary-text-color: #fafafa; - --success-color: #58df58; - --success-color-hover: #a8dfa8; - --gold-color: #ffd700; - --gold-color-hover: #ffd7aa; + --primary-text-color: #ebdbb2; + --success-color: #689d6a; + --success-color-hover: #8ec07c; + --gold-color: #d79921; + --gold-color-hover: #fabd2f; + --blue-color: #458488; + --blue-color-hover: #83a598; + --purple-color: #b16286; + --purple-color-hover: #d3869b; + --red-color: #cc241d; + --red-color-hover: #fb4934; } @font-face { @@ -54,17 +60,17 @@ body { padding: 0.5rem; padding-left: 2rem; padding-right: 2rem; - border: var(--primary-text-color) solid 1px; + border: var(--purple-color) solid 1px; } .link { text-decoration: underline; font-size: 1.25rem; - color: var(--primary-text-color); + color: var(--success-color); } .link:hover { - color: var(--gold-color); + color: var(--success-color-hover); text-decoration: none; } diff --git a/front/src/root.jsx b/front/src/root.jsx index be08b13..b7233f2 100644 --- a/front/src/root.jsx +++ b/front/src/root.jsx @@ -25,7 +25,7 @@ export const Root = () => { Keys setSignedIn(false)} to="/" > @@ -41,9 +41,9 @@ export const Root = () => { ) } href={process.env.REACT_APP_GITHUB_OAUTH} - className="link" + className="button" > - Login w/ GitHub + 🐙 Login w/ GitHub 🐙 )} diff --git a/front/src/routes/auth_successful.jsx b/front/src/routes/auth_successful.jsx index 78f9d56..8487d32 100644 --- a/front/src/routes/auth_successful.jsx +++ b/front/src/routes/auth_successful.jsx @@ -2,14 +2,8 @@ import { useEffect, useCallback } from "react"; import { useAuthContext } from "../context/auth_context"; export const AuthSuccessful = () => { - const { - username, - signedIn, - setSignedIn, - setSessionOver, - setUserId, - setUsername, - } = useAuthContext(); + const { username, signedIn, setSignedIn, setUserId, setUsername } = + useAuthContext(); const fetchMyself = useCallback( () => @@ -22,7 +16,7 @@ export const AuthSuccessful = () => { setUserId(player.id); setUsername(player.username); }), - [setSessionOver, setSignedIn, setUserId, setUsername] + [setSignedIn, setUserId, setUsername] ); useEffect(() => { diff --git a/front/src/routes/home.jsx b/front/src/routes/home.jsx index d5964e0..d56d5ef 100644 --- a/front/src/routes/home.jsx +++ b/front/src/routes/home.jsx @@ -1,11 +1,11 @@ import { useAuthContext } from "../context/auth_context"; export const Home = () => { - const { username } = useAuthContext(); + const { username, signedIn } = useAuthContext(); return (
-

Welcome home, {username || "guest"}!

+

Welcome home, {signedIn ? username : "guest"}!

); };