{% load reviews_tags %}
{% load thumbnail %}
{% load i18n %}
{% load display_tags %}
{% load staticfiles %}

{% block product %}
    <article data-product-id="{{ product.pk }}" class="card product-card shadow text-center">
        <div class="card-header">
            {% block product_title %}
                <h3><a href="{{ product.get_absolute_url }}"
                       title="{{ product.get_title }}">{{ product.get_title|truncatewords:4 }}</a></h3>
            {% endblock %}
        </div>
        <div class="card-img card-img-top">
            {% block product_image %}
                <div class="image_container">
                    {% with image=product.primary_image %}
                        {% thumbnail image.original "300x300" upscale=True crop="center" as thumb %}
                            <a href="{{ product.get_absolute_url }}"><img src="{{ thumb.url }}"
                                                                          alt="{{ product.get_title }}"
                                                                          class="thumbnail img-fluid"></a>
                        {% endthumbnail %}
                    {% endwith %}
                </div>
            {% endblock %}
        </div>
        <div class="card-body">
            {% block product_review %}
                {% iffeature "reviews" %}
                    <p class="star-rating {{ product.rating|as_stars }}">
                        <i class="icon-star"></i>
                        <i class="icon-star"></i>
                        <i class="icon-star"></i>
                        <i class="icon-star"></i>
                        <i class="icon-star"></i>
                    </p>
                {% endiffeature %}
            {% endblock %}

            <div class="row flex-row">
                <div class="col-6 d-flex align-self-center">
                    {% block product_price %}
                        <div class="product_price">
                            {% include "catalogue/partials/stock_record.html" %}
                            {% comment %}
                    {% if not product.is_parent and not product.has_options %}
                        {% include "catalogue/partials/add_to_basket_form_compact.html" %}
                    {% endif %}
                    {% endcomment %}
                        </div>
                    {% endblock %}
                </div>
                <div class="col-6 d-flex align-self-center">
                    <a href="{{ product.get_absolute_url }}" class="btn btn-primary shadow-sm">More info</a>
                </div>
            </div>
        </div>
    </article>
    <div class="space-2"></div>
{% endblock %}