Files
santeh-ray/templates/catalog/_fragments/item-card.html
Azimkin 1188cef7be
All checks were successful
Build and Push Docker Image / build (push) Successful in 27s
Make product cards fully clickable
2026-06-16 00:06:21 +02:00

67 lines
4.5 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
{% url 'detail' item.category.slug item.slug as item_url %}
<article class="item-card{% if item.id in favorite_item_ids %} is-favorite{% endif %}" data-item-card="{{ item.id }}">
<a class="item-card-overlay" href="{{ item_url }}" aria-label="Открыть товар {{ item.name }}" tabindex="-1" aria-hidden="true"></a>
<a class="item-card-media-link" href="{{ item_url }}" aria-label="Открыть товар {{ item.name }}">
{% with primary_image=item.primary_image %}
<div class="item-card-image">
{% if primary_image %}
<img src="{{ primary_image.image.url }}" alt="{{ primary_image.alt|default:item.name }}">
{% else %}
<div class="item-card-placeholder">Нет фото</div>
{% endif %}
</div>
{% endwith %}
</a>
<div class="item-card-body">
<div class="item-card-header">
<div class="item-card-category">
{{ item.category.name }}{% if item.subcategory %} / {{ item.subcategory.name }}{% endif %}
</div>
{% if request.user.is_authenticated %}
<form class="item-card-favorite-form" method="post" action="{% url 'favorites:toggle' %}" data-favorite-form>
{% csrf_token %}
<input type="hidden" name="item_id" value="{{ item.id }}">
<input type="hidden" name="next" value="{{ request.get_full_path }}">
<button
class="item-card-favorite-button{% if item.id in favorite_item_ids %} is-active{% endif %}"
type="submit"
title="{% if item.id in favorite_item_ids %}Удалить из избранного{% else %}Добавить в избранное{% endif %}"
aria-label="{% if item.id in favorite_item_ids %}Удалить из избранного{% else %}Добавить в избранное{% endif %}"
data-favorite-button
data-label-add="Добавить в избранное"
data-label-remove="Удалить из избранного"
>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" focusable="false">
<path d="m8 2.748-.717-.737C5.6.281 2.514.878 1.4 3.053c-.523 1.023-.641 2.5.314 4.385.92 1.815 2.834 3.989 6.286 6.357 3.452-2.368 5.365-4.542 6.286-6.357.955-1.886.838-3.362.314-4.385C13.486.878 10.4.28 8.717 2.01z"></path>
</svg>
</button>
</form>
{% else %}
<a class="item-card-favorite-button item-card-favorite-button--login" href="{% url 'users:login' %}?next={{ request.get_full_path|urlencode }}" title="Войдите, чтобы добавить в избранное" aria-label="Войдите, чтобы добавить в избранное" data-favorite-button data-label-add="Добавить в избранное" data-label-remove="Удалить из избранного">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true" focusable="false">
<path d="m8 2.748-.717-.737C5.6.281 2.514.878 1.4 3.053c-.523 1.023-.641 2.5.314 4.385.92 1.815 2.834 3.989 6.286 6.357 3.452-2.368 5.365-4.542 6.286-6.357.955-1.886.838-3.362.314-4.385C13.486.878 10.4.28 8.717 2.01z"></path>
</svg>
</a>
{% endif %}
</div>
<a class="item-card-title-link" href="{{ item_url }}" aria-label="Открыть товар {{ item.name }}">
<h2 class="item-card-title">{{ item.name }}</h2>
</a>
<div class="item-card-footer">
<div class="item-card-price-block">
<span class="item-card-price{% if item.has_discount %} item-card-price--discount{% endif %}">
{{ item.display_price }} руб.
</span>
{% if item.has_discount %}
<span class="item-card-price-original">{{ item.price }} руб.</span>
{% endif %}
</div>
<span class="item-card-availability {% if item.is_available %}available{% else %}unavailable{% endif %}">
{% if item.is_available %}В наличии{% else %}Нет в наличии{% endif %}
</span>
</div>
</div>
</article>