/
DevDenzo
/
ERP
Обзор
Документация
Войти
/
DevDenzo
/
ERP
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
master
src/tools/Trees/TreeProduction/_tree-production-node.less
137 строк
5 KB
Denis Sklyarskij
Инициализирован репозиторий
14 янв 2026, 23:32
14 янв 2026, 23:32
1df3d47
Код
Авторство
О чём код?
// Стили кнопок управления узлами .tree-products-nodes-control { // Включаем интерактивность элемента pointer-events: auto; // Назначаем левый отступ padding-left: 20px; // Стили кнопки управления ветками &__button { // Назначаем фон кнопок background-color: #007bff; // Задаем цвет текста кнопкам color: #e0e0e0; // Назначаем скругление углов кнопкам border-radius: 16px; // Стили первого элемента &:first-child { // Задаем отступ справа margin-right: 12px; } // Стили при наведении &:hover { // Устанавливаем фон при наведении background-color: #007bff; // Задаем цвет текста при наведении color: #e0e0e0; } // Стили кнопки при фокусе &:focus { // Задаем фон кнопки в фокусе background-color: #007bff; // Назначаем цвет текста кнопки color: #e0e0e0; } // Стили кнопки раскрытия узлов &--expanded { // Задаем фиксированные размеры кнопке показа узлов // Назначаем фиксированную ширину width: 60px; // Назначаем фиксированную высоту height: 40px; } // Стили кнопки закрытия узлов &--collapsed { // Устанавливаем фиксированные размеры для элемента скрытия узлов // Устанавливаем фиксированную ширину width: 60px; // Устанавливаем фиксированную высоту height: 40px; } } } // Стили узла дерева производства изделий .tree-products-node { // Убираем внешнюю границу у элементов border: none; // Стили главной ветки &__space { display: flex; // Устанавливаем расстояние для элементов gap: 20px; // Обнуляем левый отступ padding-left: 0; } // Стили кнопки показа содержимого &__toggle-icon { // Задаем фиксированные размеры кнопке переключателю // Назначаем ширину width: 28px; // Задаем высоту height: 28px; // Задаем внутренние отступы padding: 1px 4px; // Создаем круглую форму переключателю border-radius: 50%; // Назначаем цвет иконки color: #007bff; // Задаем стили переключателю при наведении &:hover { // Назначаем фон при наведении background-color: #e0e0e0; } } // Стили главного контейнера чекбокса &__checkbox { padding-left: 0; } // Стили браузерного чекбокса &__check-input { // Прячем браузерный чекбокс // Устанавливаем минимальную ширину width: 1px; // Задаем минимальную высоту height: 1px; // Задаем полную прозрачность opacity: 0; // Обнуляем левый отступ margin-left: 0; } // Стили кастомного чекбокса &__check-label { // Задаем фиксированные размеры чекбоксу // Назначаем фиксированную ширину width: 28px; // Задаем фиксированную высоту height: 28px; // Задаем внутренние отступы padding: 1px 4px; // Добавляем светло-серую границу border: 1px solid #e0e0e0; // Задаем цвет текста color: #007bff; // Назначаем тень вокруг границ box-shadow: 0 1px 3px rgba(0, 0, 0, .2); // Устанавливаем скругление углов border-radius: 8px; // Задаем правый отступ margin-right: 12px; } // Стили текста для чекбокса &__check-text { // Задаем размер шрифта font-size: 18px; // Задаем темный текст color: #212529; } // Задаем дочерний контейнер вложенного дерева &__children { // Задаем верхний отступ родителю дочернего дерева margin-top: 12px; } }