{{ template "base.html" . }}

{{ define "content" }}
<div class="flex ph3 ph0-ns justify-center">
	<div class="w-100 w-auto-ns pv3">
		<h1>Hi, {{ .Username }}!</h1>
		<form method="post" class="flex flex-column">
			<input type="hidden" name="token" value="{{ .Token }}" />

			{{/*NOTE: The username field isn't `type="hidden"` because this way browser will offer to save the username along with the password */}}
			<input
				style="position:absolute; visibility:hidden;"
				type="text"
				name="username"
				value="{{ .Username }}"
				readonly
			/>

			<div>Please enter a new password.</div>

			<div class="mt2">
				<label class="db b" for="password">New password</label>
				<input class="db w-100 w5-ns"
					name="password"
					type="password"
					minlength="8"
					required
				/>
			</div>

			<input class="db mt3 w-100"
				type="submit"
				value="Reset your password"
			/>
		</form>
	</div>
</div>
{{ end }}