41 lines
1.6 KiB
HTML
41 lines
1.6 KiB
HTML
{% load i18n %}
|
|
<article>
|
|
<div
|
|
class="rounded-lg border border-gray-200 bg-white p-6 shadow-sm dark:border-gray-700 dark:bg-gray-800">
|
|
<div class="h-56 w-full">
|
|
<a href="{% url 'web:product_detail' pk=product.pk slug=product.slug %}">
|
|
<img class="mx-auto h-full dark:hidden" src="{{ product.images.all|first }}"
|
|
alt="{{ product.name }}"/>
|
|
<img class="mx-auto hidden h-full dark:block" src="{{ product.images.all|first }}"
|
|
alt="{{ product.name }}"/>
|
|
</a>
|
|
</div>
|
|
<div class="pt-6">
|
|
|
|
<a href="{% url 'web:product_detail' pk=product.pk slug=product.slug %}"
|
|
class="text-lg font-semibold leading-tight text-gray-900 hover:underline dark:text-white">{{ product.name }}</a>
|
|
|
|
<div class="mt-2 flex items-center gap-2">
|
|
<div class="flex items-center">
|
|
{% include 'components/icons/star.svg' %}
|
|
{% include 'components/icons/star.svg' %}
|
|
{% include 'components/icons/star.svg' %}
|
|
{% include 'components/icons/star.svg' %}
|
|
{% include 'components/icons/star.svg' %}
|
|
</div>
|
|
|
|
<p class="text-sm font-medium text-gray-900 dark:text-white">5.0</p>
|
|
<p class="text-sm font-medium text-gray-500 dark:text-gray-400">(455)</p>
|
|
</div>
|
|
<div class="mt-4 flex gap-4">
|
|
<p class="text-2xl font-extrabold leading-tight text-gray-900 dark:text-white">
|
|
{{ product.price.price_with_tax }}€
|
|
</p>
|
|
</div>
|
|
<div class="mt-4">
|
|
{% include 'components/cart/add_to_cart.html' %}
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</article> |