Add progress bar to the stats tables

This commit is contained in:
Ildar Kamalov
2018-10-12 16:02:01 +03:00
parent 1233901822
commit 6ca881ee86
8 changed files with 233 additions and 71 deletions

View File

@@ -0,0 +1,30 @@
import React from 'react';
import PropTypes from 'prop-types';
const Cell = props => (
<div className="stats__row">
<div className="stats__row-value mb-1">
<strong>{props.value}</strong>
<small className="ml-3 text-muted">
{props.percent}%
</small>
</div>
<div className="progress progress-xs">
<div
className="progress-bar"
style={{
width: `${props.percent}%`,
backgroundColor: props.color,
}}
/>
</div>
</div>
);
Cell.propTypes = {
value: PropTypes.number.isRequired,
percent: PropTypes.number.isRequired,
color: PropTypes.string.isRequired,
};
export default Cell;