fix: cashbox label styling

This commit is contained in:
Sérgio Salgado 2021-02-17 17:46:17 +00:00 committed by Josh Harvey
parent 8f1f321758
commit 7be120ef3a
3 changed files with 13 additions and 10 deletions

View file

@ -17,7 +17,8 @@ const Cashbox = ({
percent = 0, percent = 0,
cashOut = false, cashOut = false,
className, className,
emptyPartClassName emptyPartClassName,
labelClassName
}) => { }) => {
const classes = cashboxClasses({ percent, cashOut }) const classes = cashboxClasses({ percent, cashOut })
const threshold = 51 const threshold = 51
@ -25,10 +26,14 @@ const Cashbox = ({
return ( return (
<div className={classnames(className, classes.cashbox)}> <div className={classnames(className, classes.cashbox)}>
<div className={classnames(emptyPartClassName, classes.emptyPart)}> <div className={classnames(emptyPartClassName, classes.emptyPart)}>
{percent <= threshold && <Label2>{percent.toFixed(0)}%</Label2>} {percent <= threshold && (
<Label2 className={labelClassName}>{percent.toFixed(0)}%</Label2>
)}
</div> </div>
<div className={classes.fullPart}> <div className={classes.fullPart}>
{percent > threshold && <Label2>{percent.toFixed(0)}%</Label2>} {percent > threshold && (
<Label2 className={labelClassName}>{percent.toFixed(0)}%</Label2>
)}
</div> </div>
</div> </div>
) )

View file

@ -77,7 +77,7 @@ const FiatBalance = ({
<div className={classes.first}> <div className={classes.first}>
<div className={classes.row}> <div className={classes.row}>
<Cashbox <Cashbox
className={classes.cashbox} labelClassName={classes.cashboxLabel}
emptyPartClassName={classes.cashboxEmptyPart} emptyPartClassName={classes.cashboxEmptyPart}
percent={fiatBalanceCassette1Percent} percent={fiatBalanceCassette1Percent}
cashOut cashOut
@ -97,7 +97,7 @@ const FiatBalance = ({
</div> </div>
<div className={classes.row}> <div className={classes.row}>
<Cashbox <Cashbox
className={classes.cashbox} labelClassName={classes.cashboxLabel}
emptyPartClassName={classes.cashboxEmptyPart} emptyPartClassName={classes.cashboxEmptyPart}
percent={fiatBalanceCassette2Percent} percent={fiatBalanceCassette2Percent}
cashOut cashOut

View file

@ -24,11 +24,9 @@ export default {
col2: { col2: {
width: 136 width: 136
}, },
cashbox: { cashboxLabel: {
'& p': { marginRight: 4,
marginRight: 4, fontSize: 20
fontSize: 20
}
}, },
cashboxEmptyPart: { cashboxEmptyPart: {
backgroundColor: `${backgroundColor}` backgroundColor: `${backgroundColor}`