{% extends "base" %}

{% block head %}
<style>
  .container {
    margin: 0 auto;
    padding: calc(var(--grid-gutter));
    max-width: 800px;
  }
</style>

{% endblock head %}
{% block body %}
<div class="row is-center">
  <div class="col-5">
    <img src="https://cdn.print-nanny.com/www/device-dash/logo.svg" />
  </div>
  {% if errors | length > 1 %}
  <small class="text-error" style="margin-top: -20px">
    {{ errors | length }} field(s) have errors
  </small>
  {% endif %}
</div>

<div class="row">
  <div class="col-12">

    <form action="/login" method="post" enctype="multipart/form-data">
      <fieldset>
        <legend>Log into PrintNanny OS</legend>
        <div class="row">
          <div class="col-12">
            {{ m::input(label="Email Address", type="text", name="email") }}
            <!-- required pattern=".*@.*"/> -->
          </div>
          <div class="col-12">
            {{ m::checkbox(label="I agree to send anonymous debug and analytics info to PrintNanny.", name="analytics",
            required=true) }}
            <a target="_blank" href="https://printnanny.ai/privacy-policy">View the Privacy
              Policy</a>
          </div>
        </div>
      </fieldset>
      <br />
      <p>A temporary login code will be sent to your email address.</p>

      <input type="submit" value="Submit" class="is-full-width" />
    </form>
  </div>
</div>
{% endblock body %}