{% extends "base.html" %}

{% block page_title %}Check-in - Select your mood{% endblock %}

{% block content %}
<div class="container mt-5">
    <div class="row justify-content-center">
        <div class="col-md-8">
            <h2 class="mb-4">Select your mood</h2>
            <form method="post">
                {% csrf_token %}
                <div class="d-grid gap-3">
                    {% for mood in moods %}
                    <button type="submit" name="mood" value="{{ mood.id }}"
                            class="btn btn-outline-secondary btn-lg">
                        {% if mood.title %}{{ mood.title }}{% else %}{{ mood.uuid }}{% endif %}
                        {% if mood.description %}<br><small class="text-muted">{{ mood.description }}</small>{% endif %}
                    </button>
                    {% endfor %}
                </div>
            </form>
            <div class="mt-3">
                <a href="{% url 'moods:checkin' %}" class="btn btn-link">Back to quality selection</a>
            </div>
        </div>
    </div>
</div>
{% endblock %}