Timeline и шаги прогресса для Angular | ng-hub-ui-milestones
Компонент timeline и шагов прогресса для Angular: вертикальный или горизонтальный, полностью настраиваемые узлы, контент внутри и рядом с каждым шагом, тематизация через CSS-переменные.
Интерактивные примеры
Изучите живые примеры, показывающие, как библиотека ведёт себя в типичных сценариях использования Angular.
Вертикальная временная шкала
Information
Account details captured and verified.
Shipping
Delivery address confirmed.
Payment
Enter your payment method to continue.
Review
Place the order once everything looks right.
Горизонтальные шаги прогресса
Information
Account verified.
Shipping
Address confirmed.
Payment
In progress.
Review
Last step.
Горизонтальный с пульсацией активного узла
Ordered
Payment received.
Packed
Ready to ship.
In transit
Out for delivery now.
Delivered
Arriving soon.
Состояния узлов
Complete
A finished step.
Active
The current step, highlighted with a ring.
Error
Something needs attention here.
Pending
Not started yet.
Пользовательские узлы и цвет каждого узла
Drafted
Article written and saved.
Reviewed
Approved by the editor.
Publishing
Going live across channels.
Promotion
Scheduled for next week.
Темизация через переменные CSS
Kickoff
Project scoped and approved.
Build
Core features shipped.
Launch
Rolling out to production.