argo-cd

1
import * as React from 'react';
2
import {COLORS} from '../colors';
3

4
export const ProgressBar = (props: {percentage: number}) => {
5
    return (
6
        <div
7
            style={{
8
                width: '90%',
9
                height: '10px',
10
                margin: '15px auto',
11
                background: COLORS.sync.unknown,
12
                borderRadius: '5px'
13
            }}>
14
            <div
15
                style={{
16
                    background: COLORS.sync.synced,
17
                    height: '100%',
18
                    width: Math.min(100, 100 * props.percentage) + '%',
19
                    borderRadius: 'inherit',
20
                    transition: 'width 0.1s ease-in'
21
                }}
22
            />
23
        </div>
24
    );
25
};
26