Игорь Надеин 9f6bb5100d Unify styles for create card button and link in page_header
- Add 'border-0 bg-transparent' classes to create_url link
- Now both create_modal (button) and create_url (link) have identical styling
- Fixes visual inconsistency between employees list (modal) and departments list (link)
2025-11-20 09:42:26 +03:00

132 lines
5.0 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.

{# Универсальный компонент шапки страницы списка. См. документацию в PAGE_HEADER_SUMMARY.md #}
{# ===== ШАПКА СТРАНИЦЫ ===== #}
<div class="page-header d-flex align-items-center gap-2">
{# Иконка #}
{% if icon %}
<i class="{{ icon }} fs-2 text-primary flex-shrink-0"></i>
{% endif %}
{# Заголовок #}
<h2 class="page-title mb-0">{{ title }}</h2>
{# Счётчик (если есть) #}
{% if count is not None %}
<span class="page-count text-secondary">
{{ count_label|default:"Всего:" }} <span class="count-value">{{ count }}</span>
</span>
{% endif %}
{# Правая часть - кнопки и поиск #}
<div class="ms-auto d-flex align-items-center gap-2">
{# Переключатель области (Мои/Все) #}
{% if scope_urls %}
<div class="btn-group page-scope-switch" role="group" aria-label="Область">
<a href="{{ scope_urls.mine }}"
class="btn btn-outline-secondary btn-sm {% if scope == 'mine' %}active{% endif %}">
Мои
</a>
<a href="{{ scope_urls.all }}"
class="btn btn-outline-secondary btn-sm {% if scope == 'all' %}active{% endif %}">
Все
</a>
</div>
{% endif %}
{# Дополнительные кнопки (slot) #}
{% if extra_buttons %}
{{ extra_buttons }}
{% endif %}
{# Поиск iOS-стиль #}
{% if not no_search and search_id %}
<div class="page-search ios-search">
<i class="bi-search"></i>
<input type="search"
id="{{ search_id }}"
class="ios-search-input"
placeholder="{{ search_placeholder|default:'Поиск...' }}"
autocomplete="off">
<button type="button" class="ios-search-clear" aria-label="Очистить">
<i class="bi-x-lg"></i>
</button>
</div>
{% endif %}
{# Кнопка раскрытия фильтров #}
{% if has_filters and filters_target %}
<button class="btn btn-outline-secondary btn-circle page-filter-toggle"
type="button"
data-bs-toggle="collapse"
data-bs-target="#{{ filters_target }}"
aria-expanded="false"
aria-controls="{{ filters_target }}"
aria-label="Показать фильтры">
<i class="bi-funnel"></i>
</button>
{% endif %}
{# Кнопка создания (только если create_as_card не установлен) #}
{% if not no_create and not create_as_card %}
{% if create_modal %}
<button type="button"
class="btn btn-primary btn-sm btn-pill btn-icon page-create-btn"
data-bs-toggle="modal"
data-bs-target="#{{ create_modal }}">
<i class="{{ create_icon|default:'bi-plus-lg' }}"></i>
<span class="btn-text">{{ create_text|default:"Создать" }}</span>
</button>
{% elif create_url %}
<a href="{{ create_url }}"
class="btn btn-primary btn-sm btn-pill btn-icon page-create-btn">
<i class="{{ create_icon|default:'bi-plus-lg' }}"></i>
<span class="btn-text">{{ create_text|default:"Создать" }}</span>
</a>
{% endif %}
{% endif %}
</div>
</div>
{# ===== БЛОК ФИЛЬТРОВ (скрываемый) ===== #}
{% if has_filters and filters_target %}
<div class="collapse page-filters-collapse" id="{{ filters_target }}">
<div class="page-filters">
{% if filters_template %}
{# Включаем внешний шаблон фильтров #}
{% include filters_template %}
{% else %}
{# Или используем переданный HTML #}
{{ filters_html|safe }}
{% endif %}
</div>
</div>
{% endif %}
{# ===== КНОПКА СОЗДАНИЯ В ВИДЕ КАРТОЧКИ ===== #}
{% if not no_create and create_as_card %}
{% if create_modal %}
<div class="feed-card mb-2">
<button type="button"
class="dept-row d-flex w-100 justify-content-center align-items-center gap-2 text-decoration-none border-0 bg-transparent"
data-bs-toggle="modal"
data-bs-target="#{{ create_modal }}"
role="button"
aria-label="{{ create_text|default:'Создать' }}">
<span class="feed-author">{{ create_text|default:"Создать" }}</span>
<i class="{{ create_icon|default:'bi-plus-lg' }}"></i>
</button>
</div>
{% elif create_url %}
<div class="feed-card mb-2">
<a href="{{ create_url }}"
class="dept-row d-flex w-100 justify-content-center align-items-center gap-2 text-decoration-none border-0 bg-transparent"
role="button"
aria-label="{{ create_text|default:'Создать' }}">
<span class="feed-author">{{ create_text|default:"Создать" }}</span>
<i class="{{ create_icon|default:'bi-plus-lg' }}"></i>
</a>
</div>
{% endif %}
{% endif %}