{% load staticfiles %}

<div class="background">
    <div class="grid-worksheets col-sm-8 col-center">
        {% for card in cards %}
            <div class="card">
                <div class="card__images">
                    <img class="card__image" src="{% static card.image %}">
                    {% if card.thumbnail_text %}
                        <h3 class="card__thumbnail">{{ card.thumbnail_text }}</h3>
                    {% elif card.thumbnail_image %}
                        <img class="card__thumbnail" src="{% static card.thumbnail_image %}">
                    {% endif %}
                </div>
                <div class="card__text">
                    <h3 class="card__title">{{ card.title }}</h3>
                    {% if card.description %}
                        <p>{{ card.description }}</p>
                    {% elif card.button_text %}
                        <div class="button-group">
                            <a href="{% url card.button_link %}" class="button button--primary--general-play">
                                {{ card.button_text }}
                            </a>
                        </div>
                    {% endif %}
                </div>
            </div>
        {% endfor %}
    </div>
</div>
