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

{% block step-counter %}
    <div class="steps-form">
        <div class="steps-row setup-panel">
            <div class="steps-step">
                <button name="wizard_goto_step" class="btn btn-secondary btn-circle" type="submit" value="user">1</button>
                <p>Student Information</p>
            </div>
            <div class="steps-step">
                <button name="wizard_goto_step" class="btn btn-primary btn-circle" type="disabled"
                    value="activity">2</button>
                <p>Activity Information</p>
            </div>
        </div>
    </div>
{% endblock %}

{% block content %}
    <form method="POST">
        {% csrf_token %}
        {{ wizard.management_form }}

        <div class="mb-3">
            <label for="activity1" class="form-label">Activity 1:</label>
            {{ form.activity1 }}
        </div>
        <div class="mb-3">
            <label for="activity2" class="form-label">Activity 2:</label>
            {{ form.activity2 }}
        </div>

        <div class="form-group d-flex justify-content-center">
            <button name="wizard_goto_step" class="btn btn-outline-primary btn-50" type="submit" value="{{ wizard.steps.prev }}">Previous Step</button>
            <input id='submit' class="btn btn-outline-primary btn-50" type="submit" value="Submit" />
        </div>
    </form>
{% endblock %}