Create layout for character creation page.

src/routes/(app)/game/[game_id]/+page.server.js

@@ -1,7 +1,9 @@
 import {PUBLIC_API_URL} from "$env/static/public";
 import {error} from "@sveltejs/kit";
 
-export async function load({fetch, url}){
+export async function load({fetch, params}){
+    const {game_id} = params;
+
     const response = await fetch(`${PUBLIC_API_URL}/game/${game_id}`, {
         method: "GET",
         headers: {"Content-Type": "application/json"},

src/routes/(app)/game/[game_id]/character/new/+page.server.js

@@ -0,0 +1,24 @@
+import {PUBLIC_API_URL} from "$env/static/public";
+import {error} from "@sveltejs/kit";
+
+export async function load({fetch, params}){
+    const {game_id} = params;
+
+    const response = await fetch(`${PUBLIC_API_URL}/game/${game_id}`, {
+        method: "GET",
+        headers: {"Content-Type": "application/json"},
+        credentials: "include"
+    });
+
+    const data = await response.json();
+    if(!response.ok){
+        if(response.status === 401){
+            error(response.status, {
+                message: data.error.message,
+                back: "/"
+            });
+        }
+    }
+
+    return {data};
+}

src/routes/(app)/game/[game_id]/character/new/+page.svelte

@@ -0,0 +1,24 @@
+<script>
+    import {page} from "$app/state";
+
+    let name = $state("");
+    let description = $state("");
+
+    const submit = async ()=>{
+        console.log("submit");
+    }
+</script>
+
+<main>
+    <form bind:value={submit}>
+        <label>Name:
+            <input bind:value={name} type="text" required>
+        </label>
+
+        <label>Description:
+            <textarea bind:value={description}></textarea>
+        </label>
+
+        <button>Create Character</button>
+    </form>
+</main>

src/routes/(app)/game/new/+page.svelte

@@ -27,7 +27,7 @@
             }
         }else{
             toast("Game created");
-            goto("/game");
+            goto(`/game/${data.id}/character/new`);
         }
     }