{% extends "misago/base.html" %}
{% load i18n %}


{% block title %}{% trans "Sign in" %} | {{ block.super }}{% endblock %}


{% block content %}
<div class="container">

  <div class="row">
    <div class="col-md-4 col-md-offset-4">

      <div class="form-panel">
        <form method="POST" role="form">
          {% csrf_token %}

          <div class="form-header">
            <h1>{% trans "Sign in" %}</h1>
          </div>

          {% include "misago/auth_form_errors.html" %}

          <div class="form-body no-fieldsets">

            <div class="form-group">
              <div class="control-input">
                <input type="text" name="username" class="form-control input-lg" placeholder="{% trans "Username or e-mail" %}" {% if form.username.value %}value="{{ form.username.value }}"{% endif %}>
              </div>
            </div>
            <div class="form-group">
              <div class="control-input">
                <input type="password" name="password" class="form-control input-lg" placeholder="{% trans "Password" %}">
              </div>
            </div>

          </div>

          <div class="form-footer">
            <button class="btn btn-primary btn-block">{% trans "Sign in" %}</button>
          </div>

        </form>
      </div>

    </div>
    <div class="col-md-4">

      <ul class="list-unstyled signin-help">
        <li>
          <h5>{% trans "Common problems:" %}</h5>
        </li>
        <li>
          <a href="{% url 'misago:request_password_reset' %}">
            <span class="fa fa-key fa-fw"></span>
            {% trans "I don't remember my password." %}
          </a>
        </li>
        <li>
          <a href="{% url 'misago:request_activation' %}">
            <span class="fa fa-power-off fa-fw"></span>
            {% trans "My account is inactive." %}
          </a>
        </li>
        <li>
          <a href="{% url 'misago:register' %}">
            <span class="fa fa-pencil-square-o fa-fw"></span>
            {% trans "I don't have an account." %}
          </a>
        </li>
      </ul>

    </div>
  </div>

</div>
{% endblock content %}