{% extends "project/base.html" %}

{% load i18n %}

{% block content %}

    <div class="bg-body-tertiary p-4 rounded mb-4">
        <h1>{% translate "django-crud-views examples" %}</h1>
        <p class="lead">
            {% blocktranslate trimmed %}One self-contained example app per feature.
            Every page shows the code behind it.{% endblocktranslate %}
        </p>
        <a class="btn btn-primary" href="https://django-crud-views.readthedocs.io/en/latest">
            {% translate "Documentation" %} &raquo;
        </a>
    </div>

    <div class="row row-cols-1 row-cols-md-3 g-3">
        {% for feature in features %}
            <div class="col">
                <div class="card h-100">
                    <div class="card-body">
                        <h5 class="card-title">
                            <i class="{{ feature.icon }}"></i> {{ feature.title }}
                            {% if feature.badge %}
                                <span class="badge text-bg-success ms-2">{{ feature.badge }}</span>
                            {% endif %}
                        </h5>
                        <p class="card-text">{{ feature.description }}</p>
                    </div>
                    <div class="card-footer">
                        <a class="btn btn-sm btn-outline-primary" href="{% url feature.url_name %}">{% translate "Open" %}</a>
                    </div>
                </div>
            </div>
        {% endfor %}
    </div>

    <div class="alert alert-info mt-4">
        {% blocktranslate trimmed %}Demo users (created by <code>manage.py seed</code>): <code>alice/alice</code> and
        <code>bob/bob</code> (regular users — the Guardian example shows them different documents).{% endblocktranslate %}
    </div>

{% endblock content %}