Игорь Надеин
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
94 lines
3.9 KiB
SCSS
94 lines
3.9 KiB
SCSS
// =============================================================================
|
||
// Main Application SCSS
|
||
// =============================================================================
|
||
// Главный файл для сборки всех стилей приложения (кроме Bootstrap)
|
||
// Компилируется в css/app.css
|
||
//
|
||
// REORGANIZED: 15 января 2026 - Feature-based architecture
|
||
|
||
// =============================================================================
|
||
// 1. ABSTRACTS - Переменные, миксины, функции
|
||
// =============================================================================
|
||
@import 'abstracts/index';
|
||
|
||
// =============================================================================
|
||
// 2. CORE - UI Kit компоненты (переиспользуемые)
|
||
// =============================================================================
|
||
@import 'core/common';
|
||
@import 'core/buttons';
|
||
@import 'core/buttons-custom'; // ⭐ Новая система кнопок (замена Bootstrap)
|
||
@import 'core/badges';
|
||
@import 'core/cards';
|
||
@import 'core/lists';
|
||
@import 'core/modals';
|
||
@import 'core/comments';
|
||
@import 'core/search';
|
||
@import 'core/ui-elements';
|
||
|
||
// =============================================================================
|
||
// 3. LAYOUT - Структура приложения
|
||
// =============================================================================
|
||
@import 'layout/grid';
|
||
@import 'layout/chat-layout';
|
||
@import 'layout/navbar';
|
||
@import 'layout/page-header';
|
||
@import 'layout/sidebar';
|
||
@import 'layout/rightbar';
|
||
|
||
// =============================================================================
|
||
// 4. UTILITIES - Вспомогательные классы
|
||
// =============================================================================
|
||
@import 'utilities/spacing';
|
||
|
||
// =============================================================================
|
||
// 5. FEATURES - Feature-specific стили
|
||
// =============================================================================
|
||
|
||
// Feed
|
||
@import 'features/feed/layout';
|
||
@import 'features/feed/post-form';
|
||
@import 'features/feed/members-scroller';
|
||
|
||
// Requests
|
||
@import 'features/requests/list';
|
||
@import 'features/requests/detail';
|
||
@import 'features/requests/recipient-picker';
|
||
|
||
// Documents
|
||
@import 'features/documents/list';
|
||
|
||
// Employees
|
||
@import 'features/employees/controls';
|
||
@import 'features/employees/team-viz';
|
||
|
||
// Notifications
|
||
@import 'features/notifications/center';
|
||
|
||
// Chat
|
||
@import 'features/chat/message-inputs';
|
||
@import 'features/chat/chat-detail';
|
||
@import 'features/chat/chat-date-groups';
|
||
@import 'features/chat/chat-list-enhanced';
|
||
@import 'features/chat/chat-enhanced';
|
||
@import 'features/chat/chat-polls';
|
||
@import 'features/chat/chat-new-messages-indicator';
|
||
@import 'features/chat/message-selection';
|
||
@import 'features/chat/message-context-menu';
|
||
@import 'features/chat/message-reactions';
|
||
|
||
// =============================================================================
|
||
// ПРИМЕЧАНИЯ
|
||
// =============================================================================
|
||
// - Bootstrap подключается отдельно через bootstrap-custom.css
|
||
// - CSS переменные (--variable) определены в abstracts/_css-variables.scss
|
||
// - SCSS переменные ($variable) определены в abstracts/_variables.scss
|
||
// - Порядок импортов критичен для CSS каскада
|
||
// - Core компоненты = переиспользуемые UI элементы
|
||
// - Features = специфичные для конкретных функций приложения
|
||
//
|
||
// СТРУКТУРА:
|
||
// core/ - UI Kit (9 файлов)
|
||
// layout/ - Структура приложения (6 файлов)
|
||
// utilities/ - Вспомогательные классы (1 файл)
|
||
// features/ - Feature-specific стили (16 файлов в 6 папках)
|