Docker/AdventureLog
Docker/AdventureLog
1
0
Fork 0
mirror of https://github.com/seanmorley15/AdventureLog.git synced 2025-08-05 13:15:18 +02:00
Code Issues Releases Activity

Add quote display and update signup form layout

Browse source
This commit is contained in:
Sean Morley 2024-04-11 13:49:35 +00:00
parent 7decfd61e8
commit cc7e950f5c
1 changed files with 51 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

63
src/routes/signup/+page.svelte
View file

@ -1,17 +1,56 @@
<!-- routes/signup/+page.svelte -->
<script lang="ts">
import { enhance } from "$app/forms";
import { getRandomQuote } from "$lib";
import { onMount } from "svelte";
let quote: string = "";
onMount(async () => {
quote = getRandomQuote();
});
</script>
<h1>Sign up</h1>
<form method="post" use:enhance>
<label for="username">Username</label>
<label for="first_name">First Name</label>
<input name="first_name" id="first_name" /><br />
<label for="last_name">Last Name</label>
<input name="last_name" id="last_name" /><br />
<input name="username" id="username" /><br />
<label for="password">Password</label>
<input type="password" name="password" id="password" /><br />
<button>Continue</button>
</form>
<article class="text-center text-4xl font-extrabold">
<h1>Signup</h1>
</article>
<div class="flex justify-center">
<form method="post" use:enhance class="w-full max-w-xs">
<label for="username">Username</label>
<input
name="username"
id="username"
class="block mb-2 input input-bordered w-full max-w-xs"
/><br />
<label for="first_name">First Name</label>
<input
name="first_name"
id="first_name"
class="block mb-2 input input-bordered w-full max-w-xs"
/><br />
<label for="last_name">Last Name</label>
<input
name="last_name"
id="last_name"
class="block mb-2 input input-bordered w-full max-w-xs"
/><br />
<label for="password">Password</label>
<input
type="password"
name="password"
id="password"
class="block mb-2 input input-bordered w-full max-w-xs"
/><br />
<button class="py-2 px-4 btn btn-primary">Signup</button>
</form>
</div>
<div class="flex justify-center mt-12 mr-25 ml-25">
<blockquote class="w-80 text-center text-lg break-words">
{#if quote != ""}
"{quote}"
{/if}
<!-- <footer class="text-sm">- Steve Jobs</footer> -->
</blockquote>
</div>
<!-- username first last pass -->