index.tsx 472 B

1234567891011121314151617181920
  1. type ProgressBarProps = {
  2. percent: number
  3. }
  4. const ProgressBar = ({
  5. percent = 0,
  6. }: ProgressBarProps) => {
  7. return (
  8. <div className='flex items-center'>
  9. <div className='mr-2 w-[100px] bg-gray-100 rounded-lg'>
  10. <div
  11. className='h-1 bg-[#2970FF] rounded-lg'
  12. style={{ width: `${percent}%` }}
  13. />
  14. </div>
  15. <div className='text-xs font-medium text-gray-500'>{percent}%</div>
  16. </div>
  17. )
  18. }
  19. export default ProgressBar