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

Update user settings page layout and form styling

Browse source
This commit is contained in:
Sean Morley 2024-04-18 23:23:30 +00:00
parent e372ebbacc
commit 1e1f594612
1 changed files with 60 additions and 60 deletions
Download patch file Download diff file Expand all files Collapse all files

120
src/routes/settings/+page.svelte
View file

@ -1,72 +1,72 @@
<script> <script>
import { enhance } from "$app/forms"; import { enhance } from "$app/forms";
import AdventureCard from "$lib/components/AdventureCard.svelte"; import AdventureCard from "$lib/components/AdventureCard.svelte";
export let data; export let data;
let username = data.user?.username; let username = data.user?.username;
let first_name = data.user?.first_name; let first_name = data.user?.first_name;
let last_name = data.user?.last_name; let last_name = data.user?.last_name;
let user_id = data.user?.id; let user_id = data.user?.id;
let icon = data.user?.icon; let icon = data.user?.icon;
let signup_date = data.user?.signup_date; let signup_date = data.user?.signup_date;
let role = data.user?.role; let role = data.user?.role;
</script> </script>
<h1 class="text-center font-extrabold text-4xl mb-6">Settings Page</h1> <h1 class="text-center font-extrabold text-4xl mb-6">Settings Page</h1>
<h1 class="text-center font-extrabold text-xl">User Account Settings</h1> <h1 class="text-center font-extrabold text-xl">User Account Settings</h1>
<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
bind:value={username} bind:value={username}
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
type="text" type="text"
bind:value={first_name} bind:value={first_name}
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
type="text" type="text"
bind:value={last_name} bind:value={last_name}
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="icon">Profile Icon (emoji)</label> <label for="icon">Profile Icon (emoji)</label>
<input <input
type="emoji" type="emoji"
bind:value={icon} bind:value={icon}
name="icon" name="icon"
id="icon" id="icon"
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 />
<!-- make hidden input where the user id is --> <!-- make hidden input where the user id is -->
<input <input
type="hidden" type="hidden"
bind:value={user_id} bind:value={user_id}
name="user_id" name="user_id"
id="user_id" id="user_id"
class="block mb-2 input input-bordered w-full max-w-xs" class="block mb-2 input input-bordered w-full max-w-xs"
/> />
<button class="py-2 px-4 btn btn-primary">Update</button> <button class="py-2 px-4 btn btn-primary">Update</button>
</form> </form>
</div> </div>
<small class="text-center" <small class="text-center"
><b>For Debug Use:</b> UUID={user_id} Signup Date={signup_date} Role={role}</small ><b>For Debug Use:</b> UUID={user_id} Signup Date={signup_date} Role={role}</small
> >