Игорь Надеин
8159c6f472
### 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
42 lines
2.3 KiB
HTML
42 lines
2.3 KiB
HTML
{# Мобильная версия календаря - offcanvas без плавающей кнопки #}
|
||
<div class="offcanvas offcanvas-end d-lg-none" id="rightbarOffcanvas" tabindex="-1"
|
||
data-bs-scroll="true" data-dept-id="{{ dept_ids|default:'' }}"
|
||
style="--bs-offcanvas-width: min(92vw, 420px);">
|
||
<div class="offcanvas-header d-flex align-items-center justify-content-between flex-wrap gap-2">
|
||
<div class="d-flex align-items-center gap-2 flex-shrink-1 min-w-0">
|
||
<h5 class="offcanvas-title mb-0" id="rightbarOffcanvasLabel">Календарь</h5>
|
||
|
||
{# Выпадающий выбор: Личный / Компания / Отделы #}
|
||
<div class="dropdown">
|
||
<button class="button button--sm button--outline button--secondary dropdown-toggle text-truncate" type="button"
|
||
id="calendarChooserBtnMobile" data-bs-toggle="dropdown" aria-expanded="false"
|
||
style="max-width: 120px;">
|
||
Компания
|
||
</button>
|
||
<ul class="dropdown-menu" aria-labelledby="calendarChooserBtnMobile" id="calendarChooserMenuMobile">
|
||
<li><button class="dropdown-item" type="button" data-cal="personal">Личный</button></li>
|
||
<li><hr class="dropdown-divider"></li>
|
||
<li><button class="dropdown-item" type="button" data-cal="company">Компания</button></li>
|
||
<li><hr class="dropdown-divider"></li>
|
||
{# пункты отделов добавим из JS по data-dept-id #}
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="d-flex align-items-center gap-2 flex-shrink-0">
|
||
<button class="button button--sm button--primary" type="button" data-bs-toggle="modal" data-bs-target="#eventCreateModal"
|
||
aria-label="Создать событие"><i class="bi-plus-lg"></i></button>
|
||
<button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Закрыть"></button>
|
||
</div>
|
||
</div>
|
||
<div class="offcanvas-body">
|
||
<div id="calendarRightMobile" class="calendar-wrap"></div>
|
||
|
||
<div class="week-strip-header">
|
||
<span><i class="bi-calendar-week me-1"></i> На этой неделе</span>
|
||
<span id="weekRangeMobile" class="text-muted"></span>
|
||
</div>
|
||
<div id="weekListMobile" class="week-vertical" aria-live="polite"></div>
|
||
</div>
|
||
</div>
|