Игорь Надеин
8363cbd541
- Migrated all 28 CSS components to SCSS architecture
- Deleted 29 source CSS files (kept only compiled app.css & bootstrap-custom.css)
- Created 30 SCSS component modules in scss/components/
- Cleaned 24 templates from duplicate CSS links
- Updated main.scss with new imports (layout-spacing, spacing-utils, rightbar-calendar)
- Filled empty _navbar.scss with content
- Refactored css/ folder: removed obsolete files, updated README.md
- Created comprehensive documentation (migration complete, quick reference, reports)
Migration Statistics:
- Components migrated: 28 (~4,768 lines SCSS)
- CSS files deleted: 29
- Templates cleaned: 24
- app.css size: 95 KB (compiled from SCSS)
- bootstrap-custom.css: 301 KB
- Total: 396 KB
Phase 6 Complete: 100% SCSS architecture achieved ✅
43 lines
2.0 KiB
SCSS
43 lines
2.0 KiB
SCSS
/**
|
||
* layout-spacing.scss
|
||
*
|
||
* Централизованное управление отступами в app-layout
|
||
* Все отступы контролируются через CSS переменные в variables.css
|
||
*
|
||
* ПРИНЦИП: Контейнеры занимают 100% пространства ячейки (без padding).
|
||
* Все отступы между колонками управляются ТОЛЬКО через grid gap.
|
||
*
|
||
* Переменные для настройки (в variables.css):
|
||
* --layout-gap: расстояние между sidebar, main, rightbar (по умолчанию 16px)
|
||
* --layout-padding-y: вертикальные отступы layout (по умолчанию 24px)
|
||
* --layout-padding-x: горизонтальные отступы layout (по умолчанию 0)
|
||
*
|
||
* Примеры изменения отступов:
|
||
*
|
||
* Увеличить расстояние между колонками до 24px:
|
||
* :root { --layout-gap: var(--space-3); }
|
||
*
|
||
* Уменьшить расстояние между колонками до 8px:
|
||
* :root { --layout-gap: var(--space-1); }
|
||
*
|
||
* Уменьшить вертикальные отступы до 16px:
|
||
* :root { --layout-padding-y: var(--space-2); }
|
||
*
|
||
* Убрать вертикальные отступы:
|
||
* :root { --layout-padding-y: 0; }
|
||
*/
|
||
|
||
/* =====================================
|
||
APP LAYOUT SPACING
|
||
===================================== */
|
||
|
||
// Применяем вертикальные отступы к layout
|
||
.app-layout {
|
||
padding-top: var(--layout-padding-y);
|
||
padding-bottom: var(--layout-padding-y);
|
||
}
|
||
|
||
// Горизонтальные отступы управляются через container-xxl px-2 px-lg-3 в base.html
|
||
// Grid gap между колонками управляется через --layout-gap в base-app.scss
|
||
// Колонки (sidebar, main, rightbar) НЕ имеют собственных padding - занимают 100% ячейки
|