{% extends "base.html" %}
{% set title = "Eerste configuratie" %}
{% block content %}
<section class="card card-narrow">
  <h1>Welkom bij Daynivo Kiosk Manager</h1>
  <p>Stel eerst een uniek beheerderswachtwoord in. Je hebt daarvoor de <strong>setupcode</strong> nodig die op het
     scherm van de kiosk staat (of via SSH: <code>sudo daynivo-kiosk-ctl setup-code</code>).</p>
  {% if error %}<div class="alert alert-error" role="alert">{{ error }}</div>{% endif %}
  <form method="post" class="form">
    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
    <label>Setupcode
      <input type="text" name="setup_code" required autocomplete="off" autocapitalize="characters" spellcheck="false" placeholder="ABCD-EFGH" maxlength="12" class="input-code">
    </label>
    <label>Nieuw wachtwoord
      <input type="password" name="password" required minlength="10" maxlength="128" autocomplete="new-password">
      <small>Minimaal 10 tekens. Gebruik voor iedere kiosk een eigen wachtwoord.</small>
    </label>
    <label>Herhaal wachtwoord
      <input type="password" name="password_confirm" required minlength="10" maxlength="128" autocomplete="new-password">
    </label>
    <button type="submit" class="btn btn-primary btn-block">Wachtwoord instellen</button>
  </form>
</section>
{% endblock %}