cpvalente/ontime
1
0
Fork 0
mirror of https://github.com/cpvalente/ontime.git synced 2026-08-16 04:43:35 +00:00
Code Issues Packages Projects Releases 10 Wiki Activity

fix: prevent css collision (#404)

Browse Source
This commit is contained in:
Carlos Valente
2023-05-20 22:48:14 +02:00
committed by GitHub
parent a5a6ca3229
commit 4612829e5b
2 changed files with 10 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/client/src/common/components/multi-part-progress-bar/MultiPartProgressBar.tsx
+5 -5
View File
@@ -23,11 +23,11 @@ export default function MultiPartProgressBar(props: MultiPartProgressBar) {
const warningWidth = clamp((warning / complete) * 100, 0, 100);
return (
<div className={`progress-bar ${hidden ? 'progress-bar--hidden' : ''} ${className}`}>
<div className='progress-bar__bg-normal' style={{ backgroundColor: normalColor }} />
<div className='progress-bar__bg-warning' style={{ width: `${warningWidth}%`, backgroundColor: warningColor }} />
<div className='progress-bar__bg-danger' style={{ width: `${dangerWidth}%`, backgroundColor: dangerColor }} />
<div className='progress-bar__indicator' style={{ width: `${percentComplete}%` }} />
<div className={`multiprogress-bar ${hidden ? 'multiprogress-bar--hidden' : ''} ${className}`}>
<div className='multiprogress-bar__bg-normal' style={{ backgroundColor: normalColor }} />
<div className='multiprogress-bar__bg-warning' style={{ width: `${warningWidth}%`, backgroundColor: warningColor }} />
<div className='multiprogress-bar__bg-danger' style={{ width: `${dangerWidth}%`, backgroundColor: dangerColor }} />
<div className='multiprogress-bar__indicator' style={{ width: `${percentComplete}%` }} />
</div>
);
}