{% extends 'base.html' %}

{% load static %}

{% load crispy_forms_tags %}

{% block content %}
<div class="row">
    <div class="col-sm-12 col-lg-3"></div>
    <div class="col-sm-12 col-lg-6">
        <div class="box__bg">
        <h3 style="border-bottom:5px solid #0c031a" class="my-3">REGISTER TO CONTINUE</h3>
        <form method="post" action="{% url 'register' %}" id="formPage">
            {% csrf_token %}
                    {{form|crispy}}
                    {{form_profile|crispy}}
                <button type="submit" class="btn mt-3 form-control" id="submitBtn" style="background-color: #0c031a;color:white;">REGISTER</button>
            </form>
        </div>
    </div>
    <div class="col-sm-12 col-lg-3"></div>
</div>
    <script>
        document.getElementById("formPage").onsubmit = function() {
                    document.getElementById("submitBtn").disabled = true;
                    document.getElementById("submitBtn").innerText = 'REGISTERING';
                }
    </script>
{% endblock %}