### 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
62 lines
2.1 KiB
HTML
62 lines
2.1 KiB
HTML
{# templates/registration/logout.html #}
|
|
{% extends "base.html" %}
|
|
{% load static %}
|
|
|
|
{% block title %}Выход{% endblock %}
|
|
|
|
{% block extra_css %}{% endblock %}
|
|
|
|
{% block content %}
|
|
{# Перекрываем основной контент полноэкранным диалогом #}
|
|
<div class="ios-overlay" role="dialog" aria-modal="true" aria-labelledby="logoutTitle" aria-describedby="logoutText">
|
|
<div class="ios-sheet">
|
|
<div class="ios-grip" aria-hidden="true"></div>
|
|
<div class="ios-body">
|
|
{# аватар если есть, иначе красивая иконка выхода #}
|
|
{% if user.avatar %}
|
|
<div class="ios-ava">
|
|
<img src="{{ user.avatar.url }}" alt="">
|
|
</div>
|
|
{% else %}
|
|
<div class="ios-ico">
|
|
<i class="bi-box-arrow-right fs-3"></i>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<h1 id="logoutTitle" class="ios-title">Выйти из аккаунта?</h1>
|
|
<p id="logoutText" class="ios-sub">
|
|
{{ user.get_short_name|default:"Вы" }}, вы уверены, что хотите завершить сеанс?<br>
|
|
Вы всегда можете войти снова — данные не удаляются.
|
|
</p>
|
|
|
|
<form method="post" class="ios-actions" autocomplete="off">
|
|
{% csrf_token %}
|
|
<input type="hidden" name="next" value="{{ next|default:'' }}">
|
|
|
|
|
|
<button type="submit" class="button ios-button ios-button--danger" id="confirmBtn">
|
|
Выйти
|
|
</button>
|
|
|
|
<a href="javascript:void(0)" class="button ios-button ios-button--ghost text-decoration-none text-center" id="cancelBtn">
|
|
Отмена
|
|
</a>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block extra_js %}
|
|
<script type="module">
|
|
import { initLogoutModal } from "{% static 'js/components/logoutModalHandler.js' %}";
|
|
|
|
initLogoutModal({
|
|
cancelButtonId: 'cancelBtn',
|
|
confirmButtonId: 'confirmBtn',
|
|
overlaySelector: '.ios-overlay',
|
|
loginUrl: "{% url 'auth_front:login' %}"
|
|
});
|
|
</script>
|
|
{% endblock %}
|