### Custom Button System Implementation Created modern button system to replace Bootstrap buttons: - ✅ Created core/_buttons-custom.scss (550+ lines) - ✅ CSS Custom Properties for easy customization - ✅ 8 color variants (primary, secondary, success, danger, warning, info, light, dark) - ✅ Outline and Ghost variants - ✅ 4 sizes (sm, md, lg, xl) - ✅ Special variants (block, icon, circle, link) - ✅ Loading state with spinner animation - ✅ Button groups support - ✅ Modern animations (hover, active, focus) ### Template Migration Migrated 65 HTML templates using automated Python script: - Replaced .btn → .button - Replaced .btn-primary → .button--primary - Replaced .btn-outline-* → .button--outline button--* - Replaced size classes .btn-sm → .button--sm - Total changes: 354 → 347 button usages ### Results - app.css: 137 KB → 148 KB (+11 KB for custom buttons) - Templates changed: 65 files - Remaining .btn classes: 133 (mostly btn-close for modals) - New .button classes: 347 ### Backward Compatibility Kept @extend rules in _buttons-custom.scss for gradual migration. Can be removed after complete migration. Next step: Remove Bootstrap button imports from custom-bootstrap.scss
43 lines
1.5 KiB
HTML
43 lines
1.5 KiB
HTML
{# includes/components/chat_menu.html #}
|
|
{# Меню действий для карточки чата в списке #}
|
|
{% load static %}
|
|
|
|
<div class="chat-actions-menu position-relative">
|
|
<button class="button button--sm button--link text-secondary p-1" type="button"
|
|
data-chat-menu-button
|
|
data-bs-toggle="dropdown"
|
|
data-bs-auto-close="true"
|
|
data-bs-boundary="viewport"
|
|
data-bs-display="dynamic"
|
|
aria-expanded="false">
|
|
<i class="bi-three-dots-vertical"></i>
|
|
</button>
|
|
<ul class="dropdown-menu dropdown-menu-end shadow-sm" data-bs-popper="static">
|
|
<li>
|
|
<a class="dropdown-item" href="#" data-action="pin">
|
|
<i class="bi-pin me-2"></i><span data-pin-text>Закрепить</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a class="dropdown-item" href="#" data-action="notifications">
|
|
<i class="bi-bell me-2"></i>Уведомления
|
|
</a>
|
|
</li>
|
|
|
|
{# Редактирование и удаление - не для основных чатов #}
|
|
{% if not chat.is_main %}
|
|
<li>
|
|
<a class="dropdown-item" href="#" data-action="edit">
|
|
<i class="bi-pencil me-2"></i>Редактировать
|
|
</a>
|
|
</li>
|
|
<li><hr class="dropdown-divider"></li>
|
|
<li>
|
|
<a class="dropdown-item text-danger" href="#" data-action="delete">
|
|
<i class="bi-trash me-2"></i>Удалить
|
|
</a>
|
|
</li>
|
|
{% endif %}
|
|
</ul>
|
|
</div>
|