{% extends postorius_base_template %}
{% load i18n %}
{% load staticfiles %}
{% load browserid %}
{% load bootstrap_tags %}

{% block subtitle %}
{% trans 'Login' %}
{% endblock %}
{% block additionalcss %}
    {% browserid_css %}
{% endblock %}


{% block main %}

    <div class="page-header">
        <h3>{% trans 'Login with username and password or with Mozilla Persona' %}</h3>
    </div>

    <div class="row">
        <div class="col-md-6">
            <form action="" method="post" class="well form-horizontal">
                {% render_form_horizontal form 4 8 'Log in' %}
            </form>
        </div>
        <div class="col-md-6 text-center persona-login">
            {% browserid_info %}
            {% browserid_login text='Login using Persona' color='blue' %}
            <p>
                {% blocktrans %}
                    Mozilla Persona is an easy way to sign into multiple websites, while still controlling your personal data.
                    For more information see the <a href="http://www.mozilla.org/en-US/persona">Mozilla website</a>.
                {% endblocktrans %}
            </p>
            <noscript>
                <p class="text-error">
                    {% trans 'Mozilla Persona requires the use of JavaScript.' %}
                </p>
            </noscript>
        </div>
    </div>

{% endblock %}

{% block additionaljs %}
    {% browserid_js %}
{% endblock additionaljs %}