Содержание
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 (на клик).
Дополнения и Файлы
см. также: