{% extends "auth.html" %}
{% block content %}
  <div class="row center-xs"
    <div class="col-xs col-sm-8 col-md-6 col-lg-5 col-xl-4">
      <div class="panel">
        <h2>Login</h2>
        <main>
          <form id="login" class="full" action="/login" method="POST" onSubmit="loginOnSubmit();">
            {% csrf-field %}
            <fieldset>
              <div class="form-row">
                <div class="input-addon-group">
                  <span class="icon"><i class="fa fa-user"></i></span>
                  <input type="text" id="username" name="username" autoComplete="on" autoCorrect="off" spellCheck="false" autoFocus="autofocus" placeholder="Login" onKeyPress="usernameOnKeyPress();" />
                </div>
              </div>
              <div class="form-row">
                <div class="input-addon-group">
                  <span class="icon"><i class="fa fa-lock"></i></span>
                  <input type="password" id="password" name="password" autoComplete="password" autoCorrect="off" spellCheck="false" autoFocus="autofocus" placeholder="Password" />
                </div>
              </div>
            </fieldset>
            <div class="form-row">
              <button class="blue button" style="display: block; margin-left: auto; margin-right: auto;">
                <i class="fa fa-key"></i>Submit
              </button>
            </div>
          </form>
        </main>
      </div>
    </div>
  </div>
{% endblock %}