import React from 'react';
import { ProgressBarBox, ProgressBarBelt, ProgressBall } from './ProgressBar.css';

const ProgressBar = (props: {progress: number}) => {
  return (
    <ProgressBarBox>
      <ProgressBarBelt id="belt">
        <ProgressBall style={{width: (props.progress > 100 ? 100 : props.progress) + "%"}} id="ball" />
      </ProgressBarBelt>
    </ProgressBarBox>
  );
};

export default ProgressBar;