status after 3h & 30min

frontend/src/App.svelte

@@ -1,32 +1,26 @@
 <script lang="ts">
   import "./app.css";
-  import { Navbar, NavBrand, DarkMode } from "flowbite-svelte";
-  import { Router, Route, Link, navigate } from "svelte-routing";
+  import { Navbar, NavBrand, DarkMode, Button } from "flowbite-svelte";
+  import { Router, Route, Link } from "svelte-routing";
   import Home from "./routes/Home.svelte";
   import "./app.css";
   import Tournament from "./routes/Tournament.svelte";
-  interface Props {
-    url?: string;
-  }
-
-  let { url = $bindable("") }: Props = $props();
+  export let url = "";
 </script>
 
 <main class="flex-col h-screen items-center bg-gray-50 dark:bg-gray-800">
-  <Navbar>
-    <NavBrand on:click={() => navigate("", { replace: true })}>
-      <span>Tournamenter</span>
-    </NavBrand>
-    <DarkMode />
-  </Navbar>
   <Router bind:url>
+    <Navbar>
+      <NavBrand>
+        <Link to="/">Tournaments</Link>
+      </NavBrand>
+      <DarkMode />
+    </Navbar>
     <div>
       <Route path="/"><Home /></Route>
-      <Route path="/tournament/:id" 
-        >{#snippet children({ params })}
-                <Tournament id={params.id} />              {/snippet}
-            </Route
-      >
+      <Route path="/tournament/:id" let:params>
+        <Tournament id={parseInt(params.id)} />
+      </Route>
     </div>
   </Router>
 </main>