{{ template "base.html" . }}

{{ define "content" }}
<div class="flex ph3 ph0-ns justify-center">
	<div class="w-100 w-auto-ns pv3">
		<h1 class="tc">Sign up</h1>
		<form method="POST" class="flex flex-column">
			{{/* NOTE(asaf): No CSRF on register. We don't have a user session yet and I don't think we would gain anything from a pre-login session here */}}
			
			<input type="hidden" name="destination" value="{{ .DestinationURL }}" />

			<div>
				<label class="db b" for="username">Username</label>
				<input class="db w-100 w5-ns"
					name="username"
					type="text"
					minlength="3" maxlength="30"
					pattern="^[0-9a-zA-Z][\w-]{2,29}$"
					required
				/>
			</div>

			<div class="mt2">
				<label class="db" for="displayname"><b>Display name</b> <span class="c--dim i">(optional)</span></label>
				<input class="db w-100 w5-ns"
					name="displayname"
					type="text"
				/>
			</div>

			<div class="mt2">
				<label class="db b" for="email">Email</label>
				<input class="db w-100 w5-ns"
					name="email"
					type="email"
					required
				/>
			</div>

			<div class="mt2">
				<label class="db b" for="password">Password</label>
				<input class="db w-100 w5-ns"
					name="password"
					type="password"
					minlength="8"
					required
				/>
			</div>
	
			{{/* TODO(asaf): Consider adding some bot-mitigation thing here */}}

			<div class="mt3">
				<input class="w-100" type="submit" value="Register" />
			</div>
		</form>
	</div>
</div>
{{ end }}