From bcaaae90e9136c54b1fdf254b96c69be3459cc2a Mon Sep 17 00:00:00 2001
From: Guus <ghligtvoet@gmail.com>
Date: Fri, 22 Aug 2025 12:20:11 +0200
Subject: [PATCH] post-game opleuken

---
 frontend/src/app/post-game/page.tsx | 37 +++++++++++++++++++++++++----
 1 file changed, 33 insertions(+), 4 deletions(-)

diff --git a/frontend/src/app/post-game/page.tsx b/frontend/src/app/post-game/page.tsx
index 1ea991c..0252302 100644
--- a/frontend/src/app/post-game/page.tsx
+++ b/frontend/src/app/post-game/page.tsx
@@ -2,6 +2,11 @@
 import { useEffect, useState } from "react";
 import { api } from "muzak/data/fetcher";
 import { useSession } from "muzak/contexts/SessionContext";
+import { Nunito } from "next/font/google";
+const nunito = Nunito({
+  weight: "900",
+  subsets: ["latin"],
+});
 
 export default function PostGame() {
   const { sessionId, setSessionId } = useSession();
@@ -22,10 +27,34 @@ export default function PostGame() {
 
   return (
     <main className="flex min-h-screen flex-col items-center justify-between p-24">
-      <h1>Post-game</h1>
-      <p>{trackCount} tracks</p>
-      <p>{voteCount} votes</p>
-      <p>{averageVote} average vote</p>
+      <p
+        className={`${nunito.className} text-outline text-[42px] tracking-tighter text-yellow-500`}
+      >
+        Bedankt voor het stemmen!
+      </p>
+      <div className="flex flex-col text-center">
+        <p
+          className={`${nunito.className} text-outline text-[42px] tracking-tighter text-yellow-500`}
+        >
+          Jullie hebben {voteCount} stemmen uitgebracht op {trackCount} nummers.
+        </p>
+        <p
+          className={`${nunito.className} text-outline text-[42px] tracking-tighter text-yellow-500`}
+        >
+          Gemiddeld vonden jullie {(averageVote * 100).toFixed(0)}% van de
+          nummers best oké.
+        </p>
+        <p
+          className={`${nunito.className} text-outline text-[42px] tracking-tighter text-yellow-500`}
+        >
+          Applaus voor jezelf!
+        </p>
+      </div>
+      <p
+        className={`${nunito.className} text-outline text-[42px] tracking-tighter text-yellow-500`}
+      >
+        Tot HDcon!
+      </p>
     </main>
   );
 }