{% extends "layout/immersive.html" %}
{% block content %}
<div class="row"><div class="columns">
  <div class="immersive--content immersive--center">
    <h1>{{ _('Login') }}</h1>
    <form method="POST">
      {% if model.system.get('server.login') %}
      <div class="row"><div class="columns">
        <label class="inverse material textbox">
          {{ _('Username') }}
          <input name="uname" type="text" autofocus autocomplete="username webauthn">
        </label>
      </div></div>
      <div class="row"><div class="columns">
        <label class="inverse material textbox">
          {{ _('Password') }}
          <input name="password" type="password">
        </label>
      </div></div>
      <div class="row"><div class="columns">
        <label class="inverse material checkbox" style="color:#fff;">
          <input type="checkbox" name="rememberme" class="checkbox">{{ _('Remember me') }}
        </label>
      </div></div>
      <div class="row"><div class="columns">
        <input type="hidden" name="tfa" value="">
        <input type="hidden" name="authnChallenge" value="">
        <div class="text-center">
          <input type="submit" value="{{ _('Login') }}" name="login_submit" class="inverse expanded rounded primary button">
        </div>
      </div></div>
      {% endif %}
      {%- for v in loginMethods|default(handler.loginMethods) -%}
        <div class="row"><div class="columns">
          <a href="{{ url('user_oauth', type=v.id, query={redirect: redirect}) }}" class="expanded rounded button inverse">{{ _(v.text) }}</a>
        </div></div>
      {%- endfor -%}
      <div class="row"><div class="columns">
        <div class="text-center supplementary inverse">
          <a href="{{ url('user_lostpass') }}">{{ _('Forgot password or username?') }}</a>
        </div>
      </div></div>
    </form>
  </div>
</div></div>
{% endblock %}