<!-- extend base layout -->
{% extends "appbuilder/base.html" %}

{% block content %}

<script type="text/javascript">
    var baseLoginUrl = "{{appbuilder.get_url_for_login}}";
    var baseRegisterUrl = "{{appbuilder.get_url_for_login}}";
    var next = "?next={{request.args.get('next', '')}}"

    function signin(provider) {
        window.location.href = baseLoginUrl + provider + next;
    }
</script>

<div class="container">
    <div id="loginbox" style="margin-top:50px;" class="mainbox col-md-6 col-md-offset-3 col-sm-8 col-sm-offset-2">
        <div class="panel panel-primary">
            <div class="panel-heading">
                <div class="panel-title">{{ title }}</div>
            </div>
            <div style="padding-top:30px" class="panel-body">
                <div>
                    {% for provider in providers %}
                    <a
                        onclick="signin('{{ provider.name }}');"
                        class="btn btn-primary btn-block"
                        type="submit"
                    >
                        {{_('Sign In with ')}}{{ provider.name }}
                        <i id="{{provider.name}}" class="provider-select fa {{provider.icon}} fa-1x"></i>
                    </a>
                    {% endfor %}
                </div>
            </div>
        </div>
    </div>
</div>

{% endblock %}