Docker/AdventureLog
Docker/AdventureLog
1
0
Fork 0
mirror of https://github.com/seanmorley15/AdventureLog.git synced 2025-07-29 17:59:36 +02:00
Code Issues Releases Activity

Add loading state to setup page

Browse source
This commit is contained in:
Sean Morley 2024-04-26 23:19:50 +00:00
parent 9837cc4e64
commit b0acb23edf
1 changed files with 42 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

74
src/routes/setup/+page.svelte
View file

@ -1,5 +1,7 @@
<script lang="ts"> <script lang="ts">
import { enhance } from "$app/forms"; import { enhance } from "$app/forms";
let loading = false;
</script> </script>
<h1 class="text-center font-bold text-4xl">AdventureLog Setup</h1> <h1 class="text-center font-bold text-4xl">AdventureLog Setup</h1>
@ -9,39 +11,47 @@
Welcome to AdventureLog! Please follow the steps below to setup your server. Welcome to AdventureLog! Please follow the steps below to setup your server.
</p> </p>
<!-- step 1 create admin user --> {#if !loading}
<h2 class="text-center font-bold text-2xl mt-6">Create Admin User</h2> <!-- step 1 create admin user -->
<h2 class="text-center font-bold text-2xl mt-6">Create Admin User</h2>
<div class="flex justify-center"> <div class="flex justify-center">
<form method="post" use:enhance class="w-full max-w-xs"> <form method="post" use:enhance class="w-full max-w-xs">
<label for="username">Username</label> <label for="username">Username</label>
<input <input
name="username" name="username"
id="username" id="username"
class="block mb-2 input input-bordered w-full max-w-xs" class="block mb-2 input input-bordered w-full max-w-xs"
/><br /> /><br />
<label for="first_name">First Name</label> <label for="first_name">First Name</label>
<input <input
name="first_name" name="first_name"
id="first_name" id="first_name"
class="block mb-2 input input-bordered w-full max-w-xs" class="block mb-2 input input-bordered w-full max-w-xs"
/><br /> /><br />
<label for="last_name">Last Name</label> <label for="last_name">Last Name</label>
<input <input
name="last_name" name="last_name"
id="last_name" id="last_name"
class="block mb-2 input input-bordered w-full max-w-xs" class="block mb-2 input input-bordered w-full max-w-xs"
/><br /> /><br />
<label for="password">Password</label> <label for="password">Password</label>
<input <input
type="password" type="password"
name="password" name="password"
id="password" id="password"
class="block mb-2 input input-bordered w-full max-w-xs" class="block mb-2 input input-bordered w-full max-w-xs"
/><br /> /><br />
<button class="py-2 px-4 btn btn-primary">Signup and Setup Server</button> <button class="py-2 px-4 btn btn-primary">Signup and Setup Server</button>
</form> </form>
</div> </div>
{/if}
{#if loading}
<div class="flex justify-center items-center w-full mt-16">
<span class="loading loading-spinner w-24 h-24"></span>
</div>
{/if}
<svelte:head> <svelte:head>
<title>Setup | AdventureLog</title> <title>Setup | AdventureLog</title>