54 lines
1.8 KiB
Svelte
54 lines
1.8 KiB
Svelte
<script>
|
|
/** @type {import('./$types').ActionData} */ export let form;
|
|
</script>
|
|
|
|
<svelte:head>
|
|
<title>Register - Rowblox</title>
|
|
<script src="https://js.hcaptcha.com/1/api.js" async defer></script>
|
|
</svelte:head>
|
|
|
|
<form method="POST" class="max-w-lg mx-auto text-center text-white">
|
|
<img class="mx-auto" src="/favicon.png" alt="" />
|
|
<div class="flex flex-col">
|
|
<input
|
|
class="rounded w-72 px-4 border-2 {form?.error == 'username' ? 'border-red-500' : 'border-blue-500'} text-black mx-auto my-0.5 py-2"
|
|
required
|
|
type="username"
|
|
name="username"
|
|
id="username"
|
|
placeholder="Username"
|
|
value={form?.username ?? ""}
|
|
/>
|
|
<input
|
|
class="rounded w-72 px-4 border-2 {form?.error == 'password' ? 'border-red-500' : 'border-blue-500'} text-black mx-auto my-0.5 py-2"
|
|
required
|
|
type="password"
|
|
name="password"
|
|
id="password"
|
|
placeholder="Password"
|
|
/>
|
|
<input
|
|
class="rounded w-72 px-4 border-2 {form?.error == 'password' ? 'border-red-500' : 'border-blue-500'} text-black mx-auto my-0.5 py-2"
|
|
required
|
|
type="password"
|
|
name="confirm_password"
|
|
id="confirm_password"
|
|
placeholder="Confirm Password"
|
|
/>
|
|
<input
|
|
class="rounded w-72 px-4 border-2 {form?.error == 'invite_key' ? 'border-red-500' : 'border-blue-500'} text-black mx-auto my-0.5 py-2"
|
|
required
|
|
type="text"
|
|
name="invite_key"
|
|
id="invite_key"
|
|
placeholder="Invite Key"
|
|
value={form?.invite_key ?? ""}
|
|
/>
|
|
</div>
|
|
{#if form?.message}
|
|
<p class="rounded w-72 px-4 border-2 border-red-500 text-red-500 bg-red-500 mx-auto my-1.5 py-1.5 bg-opacity-50">{form?.message}</p>
|
|
{/if}
|
|
<div class="h-captcha" data-sitekey="30000000-ffff-ffff-ffff-000000000003" />
|
|
<button class="my-1.5 text-xl text-white px-4 py-1.5 w-full rounded shadow-lg border-2 border-blue-500 hover:bg-opacity-50 hover:bg-blue-500">Register</button>
|
|
</form>
|