{{template "layout" .}}

{{define "title"}}bbq — your name{{end}}

{{define "content"}}
<div class="event-header">
  <div class="event-tag">Account</div>
  <h1 class="event-title">What's your name?</h1>
  <p style="font-family:'DM Mono',monospace;font-size:0.8rem;color:#555;margin-top:8px;">
    This will be used to autofill your name when you RSVP or claim a slot.
  </p>
</div>

<div class="claim-form-wrapper">
  <form method="POST" action="/account/name">
    <div class="form-row">
      <label>Name</label>
      <input type="text" name="name" placeholder="Your name" required autofocus
             value="{{if .User}}{{.User.Name}}{{end}}">
    </div>
    <button class="btn-submit" type="submit">Save &#8599;</button>
  </form>
</div>
{{end}}