/
TimurIsm
/
OpenEyes
Обзор
Документация
Войти
/
TimurIsm
/
OpenEyes
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
main
front/src/components/ProgressIndicator.jsx
37 строк
2 KB
IsmTimur
Initial commit: added backend (Express) and frontend (React Vite)
19 июн 2025, 18:32
19 июн 2025, 18:32
6cf6155
Код
Авторство
О чём код?
import React from 'react'; const ProgressIndicator = ({ totalPages, currentPage, isPageAnswered }) => { return ( <div className="w-full mb-8 px-4"> <ol className="flex items-center justify-between w-full"> {Array.from({ length: totalPages }).map((_, index) => { const isCompleted = isPageAnswered(index); const isCurrent = index === currentPage; return ( <React.Fragment key={index}> <li className="flex items-center"> <div className={`z-10 flex items-center justify-center w-8 h-8 rounded-full ring-2 ring-white shrink-0 ${ isCompleted ? 'bg-blue-600' : isCurrent ? 'bg-blue-300' : 'bg-gray-200' }`}> {isCompleted ? ( <svg className="w-4 h-4 text-white" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 16 12"> <path stroke="currentColor" strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M1 5.917 5.724 10.5 15 1.5"/> </svg> ) : ( <span className="text-sm font-medium text-gray-900">{index + 1}</span> )} </div> </li> {index < totalPages - 1 && ( <div className={`flex-1 h-1 mx-1 ${isCompleted ? 'bg-blue-600' : 'bg-gray-200'}`}></div> )} </React.Fragment> ); })} </ol> </div> ); }; export default ProgressIndicator;