smaa/octopus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects 1 Releases Wiki Activity

Компактная компоновка фильтров в одну строку

Browse Source 
- Фильтры теперь в одну строку с flexbox
- Убраны обёртки col-auto, используется d-flex gap-2
- Селекты с width: auto для компактности
- Чекбокс 'Только в наличии' прижат к правому краю (ms-auto)
- Более компактный и чистый UI
- Убран класс product-picker-filters и удалён комментарий про счётчик
This commit is contained in:
Andrey Smakotin
2025-12-11 00:43:09 +03:00
parent b550b459dc
commit 608ac25d43
1 changed files with 23 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
myproject/products/templates/products/components/product_search_picker.html
View File

@@ -82,47 +82,39 @@ ProductSearchPicker.init('#writeoff-products', {
{% if show_filters|default:True %}
<!-- Фильтры -->
<div class="card-body border-bottom py-2 product-picker-filters">
<div class="row g-2 align-items-center">
<div class="card-body border-bottom py-2">
<div class="d-flex gap-2 align-items-center flex-wrap">
{% if categories %}
<!-- Фильтр по категории -->
<div class="col-auto">
<select class="form-select form-select-sm product-picker-category">
<option value="">Все категории</option>
{% for cat in categories %}
<option value="{{ cat.id }}">{{ cat.name }}</option>
{% endfor %}
</select>
</div>
<select class="form-select form-select-sm product-picker-category" style="width: auto;">
<option value="">Все категории</option>
{% for cat in categories %}
<option value="{{ cat.id }}">{{ cat.name }}</option>
{% endfor %}
</select>
{% endif %}
{% if tags %}
<!-- Фильтр по тегам -->
<div class="col-auto">
<select class="form-select form-select-sm product-picker-tag">
<option value="">Все теги</option>
{% for tag in tags %}
<option value="{{ tag.id }}">{{ tag.name }}</option>
{% endfor %}
</select>
</div>
<select class="form-select form-select-sm product-picker-tag" style="width: auto;">
<option value="">Все теги</option>
{% for tag in tags %}
<option value="{{ tag.id }}">{{ tag.name }}</option>
{% endfor %}
</select>
{% endif %}
<!-- Фильтр по наличию -->
<div class="col-auto">
<div class="form-check form-switch">
<input class="form-check-input product-picker-in-stock"
type="checkbox"
id="{{ container_id|default:'product-search-picker' }}-in-stock"
{% if filter_in_stock_only|default:False %}checked{% endif %}>
<label class="form-check-label small"
for="{{ container_id|default:'product-search-picker' }}-in-stock">
Только в наличии
</label>
</div>
<div class="form-check form-switch ms-auto">
<input class="form-check-input product-picker-in-stock"
type="checkbox"
id="{{ container_id|default:'product-search-picker' }}-in-stock"
{% if filter_in_stock_only|default:False %}checked{% endif %}>
<label class="form-check-label small"
for="{{ container_id|default:'product-search-picker' }}-in-stock">
Только в наличии
</label>
</div>
<!-- Счетчик выбранных - УБРАН в single-select режиме -->
</div>
</div>
{% endif %}