11.1. Шаблон модуля install (application installation)

Вкладки панели:

Общие данные о системе/ обращения в службу поддержки
Последние записи/загрузки/регистрации/комментарии
Настройка приложения
Редактор пользователей
Редактор постов
Редактор книг

Фоновое изображение

Градиент от белого к небесно-голубому

Рекомендуемые варианты фона: Мягкий градиент:Переход от белого к небесно-голубому. Это добавит глубины, не перегружая визуальное восприятие.

Салатовый градиент

Природный «землистый» фон:Светло-бежевый хорошо гармонируют с зеленым, создавая более мягкое и дружелюбное впечатление от интерфейса.

Светло бежевый с частицами

Градиент от белого к небесно - голубому

Градиент от белого к светло - серому

Чистый белый или светло-серый:Классический выбор для ИТ-интерфейсов. Белый цвет (#FFFFFF) или очень светлый серый (#F5F5F5) создаст эффект «чистого холста» и сделает акцент на самом информационном блоке.

particles-js настройка

Настройка particles.js включает подключение библиотеки, создание контейнера (HTML) и инициализацию (JSON-конфиг). Ключевые параметры: плотность (number), размер (size), скорость (move), взаимодействие (interactivity). Для работы как фона важно задать position: absolute и z-index. Используйте генератор для визуальной настройки. 1. Подключение и HTML
Скачайте particles.min.js и подключите его в HTML. Создайте блок для анимации:

index.html

<div id="particles-js"></div>
<script src="particles.min.js"></script>

2. Стили (CSS) Чтобы частицы работали как фон:

style.css

#particles-js {
  position: absolute; /* или fixed */
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: -1; /* под контент */
}

3. Инициализация (JS)

script.js

javascriptparticlesJS.load('particles-js', 'particles.json', function() {
  console.log('particles.js loaded');
});

4. Основные настройки (particles.json)

particles.number: value - количество частиц
particles.color: value - цвет (hex, rgb)
particles.shape: тип (circle, edge, triangle)
particles.opacity: прозрачность
particles.size: размер частиц
particles.line_linked: настройки линий между частицами (enable: true/false)
particles.move: speed (скорость), direction (направление)
interactivity: onhover (реакция на наведение), onclick (на клик).

Дополнения и Файлы

см. также: