{% extends "admin/change_form.html" %}

{% block content %}
    {{ block.super }}
    <hr>
    <br>
    <div>
        <h2>Project services info</h2>
        <br>

        {% for region, data in service_data %}
            <form method="post" action="{% url 'admin:project-activate-service' %}">
            {% csrf_token %}
                <hr>
                <h3>Region {{ region }}</h3>
                <input type="hidden" name="project_slug" value="{{ project_slug }}">
                <input type="hidden" name="region_name" value="{{ region }}">
                <br>
                <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1rem;">
                    {% for service, active in data.items %}
                        <div style="display: inline-flex; align-items: center; gap: 10px; margin-right: 25px;">
                            <input type="checkbox" name="services" value="{{ service }}" {% if active %}checked disabled{% endif %}>
                            <label for="services" style="margin: 0;">{{ service }}</label>
                        </div>
                    {% endfor %}
                </div>
                <br>
                <br>
                <input type="submit" value="Activate">
            </form>
            <br>
            <br>

        {% endfor %}
    </div>


{% endblock %}