{% extends 'cards/base.html' %}
{% load duration i18n %}

{% block header %}
    <a href="{% url "core:feeding-list" %}">
        {% trans "Recent Feedings" %}
    </a>
{% endblock %}

{% block title %}
{% if feedings|length > 0 %}
<div id="feeding-days-carousel" class="carousel slide" data-bs-interval="false">
    <div class="carousel-inner">
        {% for feeding in feedings %}
            <div class="carousel-item{% if forloop.counter == 1 %} active{% endif %}">
                <div class="last-feeding-method text-center">
                    {% if feeding.total %}
                        {{ feeding.total|floatformat }}
                    {% else %}
                        {% trans "None" %}
                    {% endif %}
                </div>
                <div class="text-center small">
                    {% if feeding.count > 0 %}
                        {% blocktrans trimmed count counter=feeding.count %}
                            {{ counter }} feeding
                        {% plural %}
                            {{ counter }} feedings
                        {% endblocktrans %}
                    {% endif %}
                </div>
                {% blocktrans trimmed with since=feeding.date.date|dayssince %}
                    <div class="text-center small text-body-secondary">
                        {{ since }}
                    </div>
                {% endblocktrans %}
                </div>
        {% endfor %}
    </div>
    {% if feedings|length > 1 %}
    <a class="carousel-control-prev"
       href="#feeding-days-carousel"
       role="button"
       data-bs-slide="prev">
        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
        <span class="visually-hidden">{% trans "Previous" %}</span>
    </a>
    <a class="carousel-control-next"
       href="#feeding-days-carousel"
       role="button"
       data-bs-slide="next">
        <span class="carousel-control-next-icon" aria-hidden="true"></span>
        <span class="visually-hidden">{% trans "Next" %}</span>
    </a>
    {% endif %}
</div>
{% else %}
{% trans "None" %}
{% endif %}

{% endblock %}