Files
ncd-fe/app/soapbox/components/ui/progress-bar/progress-bar.tsx
marcin mikołajczak 49ba4c7a9d Fixes, styles improvements, cleanup, enforce classes order for classNames
Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
2023-02-06 18:18:49 +01:00

15 lines
433 B
TypeScript

import React from 'react';
interface IProgressBar {
progress: number,
}
/** A horizontal meter filled to the given percentage. */
const ProgressBar: React.FC<IProgressBar> = ({ progress }) => (
<div className='dark:bg-primary-800 h-2.5 w-full overflow-hidden rounded-full bg-gray-300'>
<div className='bg-secondary-500 h-full' style={{ width: `${Math.floor(progress * 100)}%` }} />
</div>
);
export default ProgressBar;