fix: module progress bar (#535)

This commit is contained in:
Aaryan Khandelwal 2023-03-26 11:37:06 +05:30 committed by GitHub
parent 5dd5fe2d09
commit 21dd2e703b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -250,20 +250,17 @@ export const SingleModuleCard: React.FC<Props> = ({ module, handleEditModule })
</div> </div>
</div> </div>
<div className="flex h-full items-end"> <div className="flex h-full items-end">
<div className="flex w-full items-center gap-2 justify-self-end bg-gray-100 p-4"> <div className="flex w-full items-center justify-between gap-2 justify-self-end bg-gray-100 p-4">
<span>Progress</span> <span>Progress</span>
<Tooltip <div className="bar relative h-1 w-full rounded bg-gray-300">
tooltipContent={`Progress ${ <div
isNaN(completionPercentage) ? 0 : completionPercentage.toFixed(0) className="absolute top-0 left-0 h-1 rounded bg-green-500 duration-300"
}%`} style={{
> width: `${isNaN(completionPercentage) ? 0 : completionPercentage.toFixed(0)}%`,
<div className="bar relative h-1 w-full rounded bg-gray-300"> }}
<div />
className="absolute top-0 left-0 h-1 rounded bg-green-500 duration-300" </div>
style={{ width: `${completionPercentage}%` }} <span>{isNaN(completionPercentage) ? 0 : completionPercentage.toFixed(0)}%</span>
/>
</div>
</Tooltip>
</div> </div>
</div> </div>
</div> </div>