{% extends "base.html" %}
{% block content %}
    <h3>Login</h3>
    <form class="form-horizontal" method="POST"> {% csrf_token %}
        <fieldset class="col-md-offset-3 col-md-6">
            {% include "dojo/form_fields.html" with form=form %}
            <!-- Button -->
            <div class="form-group">
                <div class="col-sm-offset-1 col-sm-4" id="toggleBox" onclick="togglePassVisibility()">
                    <i class="fa fa-eye"></i>
                    <span><b>Show Password</b></span>
                </div>
                {% if GOOGLE_ENABLED == False and OKTA_ENABLED == False %}
                    <div class="col-sm-offset-1 col-sm-1">
                        <button class="btn btn-success">Login</button>
                    </div>
                {% endif %}
            </div>
            <div class="form-group">
                {% if GOOGLE_ENABLED == True or OKTA_ENABLED == True %}
                    <div class="col-sm-offset-1 col-sm-1">
                            <button class="btn btn-success">Login</button>
                    </div>
                {% endif %}
                {% if GOOGLE_ENABLED == True %}
                    <div class="col-sm-offset-1 col-sm-3">
                        <button class="btn btn-success" type="button">
                            <a href="{% url 'social:begin' 'google-oauth2' %}?next={{ request.GET.next }}" style="color: rgb(255,255,255)">Login with Google</a>
                        </button>
                    </div>
                {% endif %}

                {% if OKTA_ENABLED == True %}
                    <div class="col-sm-offset-1 col-sm-1">
                        <button class="btn btn-success" type="button">
                            <a href="{% url 'social:begin' 'okta-oauth2' %}?next={{ request.GET.next }}" style="color: rgb(255,255,255)">Login with OKTA</a>
                        </button>
                    </div>
                {% endif %}
            </div>
        </fieldset>
    </form>
{% endblock %}