feat: добавить лоадеры Dots, Rotating Text и DNA Strain
— Добавлен dots-pulsating (минимализм на CSS-переменных) — Добавлен rotating-text (эффект переворота букв с использованием JS) — Добавлен dna-strain (научная анимация цепочки ДНК) — Обновлен общий README.md: коллекция расширена до 8 элементов
This commit is contained in:
Executable
+15
@@ -0,0 +1,15 @@
|
||||
# ⚪ Dots Pulsating Loader
|
||||
|
||||
Лаконичный и легкий индикатор загрузки из трех пульсирующих точек. Реализован на чистом CSS с использованием переменных для быстрой настройки.
|
||||
|
||||
### Особенности
|
||||
|
||||
- **Pure CSS**: Работает без JavaScript, используя стандартные `@keyframes`.
|
||||
- **CSS Variables**: Цвет фона, цвет точек и их размер легко меняются через `:root` (переменные `--main-color`, `--point-color`, `--size`).
|
||||
- **Smooth Animation**: Эффект «волны» достигается за счет последовательной задержки (`animation-delay`) для каждой точки.
|
||||
|
||||
### Технические детали
|
||||
|
||||
- **Scale Effect**: Анимация плавно увеличивает размер точек в 2 раза (`transform: scale(2)`).
|
||||
- **Flexbox Layout**: Идеальное центрирование по вертикали и горизонтали на весь экран.
|
||||
- **Fixed Position**: Лоадер перекрывает весь контент за счет `position: fixed` и высокого `z-index`.
|
||||
Reference in New Issue
Block a user