{% extends 'base.html.twig' %}

{% block body %}

    {% for message in app.flashes('success') %}
    <div class="alert alert-success" role="alert">
        {{ message }}
    </div>
    {% endfor %}

    <h1>Offers</h1>
    {% if offerings|length > 0 %}
        <div class="card-deck d-flex justify-content-around justify-content-sm-around justify-content-md-between flex-wrap">
            {% for offering in offerings %}
            <a href="./offer/{{ offering.id }}" class="mb-5">
                    <div class="card offering h-100">
                        {% if offering.photoFilename %}
                            <img class="card-img-top" src="{{ asset('uploads/photos/' ~ offering.photofilename) }}" />
                        {% endif %}
                        <div class="card-body">
                            <h5 class="card-title">{{ offering.title }}</h5>
                            <p class="card-text">{{ offering.description }}</p>
                        </div>
                        <div class="card-footer">
                            <p class="username">{{ offering.byUser }}</p>
                            <p class="zip">{{ offering.zipCode }}</p>
                        </div>
                    </div>
                </a>
            {% endfor %}
        </div>
    {% else %}
        <div class="alert alert-warning" role="alert">There are currently no active listings.</div>
    {% endif %}
{% endblock %}