diff --git a/frontend/src/app/layout.tsx b/frontend/src/app/layout.tsx index 60d4080..a25738c 100644 --- a/frontend/src/app/layout.tsx +++ b/frontend/src/app/layout.tsx @@ -11,19 +11,60 @@ import SessionChecker from "muzak/components/SessionChecker"; import { AnimationContext } from "muzak/contexts/AnimationContext"; import { QuotaContext } from "muzak/contexts/QuotaContext"; import { SessionContext } from "muzak/contexts/SessionContext"; +import { usePathname } from "next/navigation"; const nunito = Nunito({ subsets: ["latin"], }); +const navToggle = true; //voor dev navigatie + +const pageConfig: Record< + string, + { + showAuthStatus: boolean; + showSessionChecker: boolean; + showNav: boolean; + showQuota: boolean; + } +> = { + "/nominations": { + showAuthStatus: true, + showSessionChecker: false, + showQuota: true, + showNav: navToggle, + }, + "/mobile-voting": { + showAuthStatus: false, + showSessionChecker: false, + showQuota: false, + showNav: false, + }, + "/lobby": { + showAuthStatus: true, + showSessionChecker: false, + showQuota: true, + showNav: navToggle, + }, +}; + function LayoutContent({ children }: { children: React.ReactNode }) { + const pathname = usePathname(); + + const config = pageConfig[pathname] ?? { + showAuthStatus: true, + showSessionChecker: true, + showQuota: false, + showNav: navToggle, + }; + return ( <> - - + {config.showSessionChecker && } + {config.showAuthStatus && } {children} - {/* */} - + {config.showNav && } + {config.showQuota && } ); } diff --git a/frontend/src/app/login/page.tsx b/frontend/src/app/login/page.tsx deleted file mode 100644 index 76faa97..0000000 --- a/frontend/src/app/login/page.tsx +++ /dev/null @@ -1,48 +0,0 @@ -"use client"; - -import { Nunito } from "next/font/google"; -import { useState } from "react"; -import Link from "next/link"; - -const nunito = Nunito({ - weight: "900", - subsets: ["latin"], -}); - -export default function Login() { - const [userName, setUserName] = useState("Stroop"); - const [pin, setPin] = useState(""); - return ( -
-
-

- LOGIN -

-
- -
-

- Welkom, {userName}! -

-
- setPin(e.target.value.toUpperCase())} - /> - - Join - -
-
-
-
- ); -} diff --git a/frontend/src/app/mobile-voting/page.tsx b/frontend/src/app/mobile-voting/page.tsx new file mode 100644 index 0000000..3b2310c --- /dev/null +++ b/frontend/src/app/mobile-voting/page.tsx @@ -0,0 +1,56 @@ +"use client"; + +import { Nunito } from "next/font/google"; +import { useState } from "react"; +import Link from "next/link"; + +const nunito = Nunito({ + weight: "900", + subsets: ["latin"], +}); + +export default function MobileVoting() { + const [vote, setVote] = useState(0.5); + const [noHighlight, setNoHighlight] = useState(false); + const [yesHighlight, setYesHighlight] = useState(false); + + return ( +
+
+ +
+ + +
+
+
+ ); +} diff --git a/frontend/src/app/post-game/page.tsx b/frontend/src/app/post-game/page.tsx index 490ffa9..9f9dbec 100644 --- a/frontend/src/app/post-game/page.tsx +++ b/frontend/src/app/post-game/page.tsx @@ -2,6 +2,8 @@ export default function PostGame() { return (

Post-game

+

Bedankt voor het stemmen!

+

;)

); } diff --git a/frontend/src/components/NavigationBar.tsx b/frontend/src/components/NavigationBar.tsx index 5a4ccdd..05176e8 100644 --- a/frontend/src/components/NavigationBar.tsx +++ b/frontend/src/components/NavigationBar.tsx @@ -5,6 +5,8 @@ const source = Source_Sans_3({ subsets: ["latin"], }); const font = source.className; +const btnStyle = + "rounded-md px-4 py-2 text-sm font-medium text-white bg-green-600 hover:bg-green-700"; export default function NavigationBar() { const auth = useAuth(); @@ -12,11 +14,26 @@ export default function NavigationBar() { return ( );