{% extends 'base.html' %}
{% load socialaccount %}

{% block title %}Sign Up - Django Boilerplate{% endblock %}

{% block content %}
<div class="row justify-content-center">
    <div class="col-md-6">
        <div class="card">
            <div class="card-header">
                <h4 class="mb-0">Create Your Account</h4>
            </div>
            <div class="card-body">
                <form method="post">
                    {% csrf_token %}
                    {{ form.as_p }}
                    <button type="submit" class="btn btn-primary">Sign Up</button>
                </form>
                
                <hr class="my-4">
                
                <div class="text-center">
                    <h6>Or sign up with:</h6>
                    <div class="d-grid gap-2 d-md-flex justify-content-md-center">
                        <a href="{% provider_login_url 'google' %}" class="btn btn-outline-danger">
                            Google
                        </a>
                        <a href="{% provider_login_url 'facebook' %}" class="btn btn-outline-primary">
                            Facebook
                        </a>
                    </div>
                </div>
                
                <hr class="my-4">
                
                <div class="text-center">
                    <p>
                        Already have an account? 
                        <a href="{% url 'account_login' %}">Login here</a>
                    </p>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}