changed styling nominaties

frontend/src/app/nominations/page.tsx

@@ -1,9 +1,9 @@
 "use client";
 import { useState } from "react";
-import { Vollkorn } from "next/font/google";
+import { Nunito } from "next/font/google";
 
-const vollkorn = Vollkorn({
-  weight: "600",
+const nunito = Nunito({
+  weight: "900",
   subsets: ["latin"],
 });
 
@@ -11,14 +11,20 @@ export default function Nominations() {
   const [songURL, setSongURL] = useState("");
 
   return (
-    <main className="flex min-h-screen flex-col items-center justify-between bg-orange-200 p-24">
-      <h1 className={`${vollkorn.className} text text-[42px]`}>Nominaties</h1>
-
-      <form className="flex flex-col items-center justify-between">
-        <label className="w-lg mb-2 block text-sm font-bold text-gray-700">
+    <main className="flex min-h-screen flex-col items-center justify-between p-24">
+      <h1
+        className={`${nunito.className} text-outline text-[42px] tracking-tighter text-yellow-500`}
+      >
+        NOMINATIES
+      </h1>
+      <div className="mb-12 flex flex-col items-center justify-between gap-4 rounded-md bg-blue-950/80 p-8">
+        <form className="flex flex-col items-center justify-center gap-4">
+          <p className="text-2xl font-semibold text-white drop-shadow-sm drop-shadow-gray-900">
             Dump hier je Spotify-link:
+          </p>
+          <label className="block w-lg text-sm font-bold text-gray-700">
             <input
-            className="w-full appearance-none rounded border bg-red-50 px-3 py-2 text-gray-700 opacity-70 shadow focus:outline-none"
+              className="w-full rounded border border-white px-4 py-2 font-bold text-white/70 focus:border-yellow-500 focus:outline-2 focus:outline-yellow-500"
               type="text"
               placeholder="Spotify URL"
               value={songURL}
@@ -27,7 +33,7 @@ export default function Nominations() {
           </label>
 
           <button
-          className="rounded bg-[#2f363c] px-4 py-2 font-bold text-white hover:bg-slate-700"
+            className="w-full rounded bg-blue-500 px-4 py-2 text-center font-bold text-white hover:bg-blue-400"
             type="submit"
             onClick={(e) => {
               e.preventDefault();
@@ -37,7 +43,7 @@ export default function Nominations() {
             Nomineer
           </button>
         </form>
-
+      </div>
       <footer>
         <p>© 2020-2025 Hoestende Draken PartyCo</p>
       </footer>