fix: cashbox label styling
This commit is contained in:
parent
8f1f321758
commit
7be120ef3a
3 changed files with 13 additions and 10 deletions
|
|
@ -17,7 +17,8 @@ const Cashbox = ({
|
|||
percent = 0,
|
||||
cashOut = false,
|
||||
className,
|
||||
emptyPartClassName
|
||||
emptyPartClassName,
|
||||
labelClassName
|
||||
}) => {
|
||||
const classes = cashboxClasses({ percent, cashOut })
|
||||
const threshold = 51
|
||||
|
|
@ -25,10 +26,14 @@ const Cashbox = ({
|
|||
return (
|
||||
<div className={classnames(className, classes.cashbox)}>
|
||||
<div className={classnames(emptyPartClassName, classes.emptyPart)}>
|
||||
{percent <= threshold && <Label2>{percent.toFixed(0)}%</Label2>}
|
||||
{percent <= threshold && (
|
||||
<Label2 className={labelClassName}>{percent.toFixed(0)}%</Label2>
|
||||
)}
|
||||
</div>
|
||||
<div className={classes.fullPart}>
|
||||
{percent > threshold && <Label2>{percent.toFixed(0)}%</Label2>}
|
||||
{percent > threshold && (
|
||||
<Label2 className={labelClassName}>{percent.toFixed(0)}%</Label2>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -77,7 +77,7 @@ const FiatBalance = ({
|
|||
<div className={classes.first}>
|
||||
<div className={classes.row}>
|
||||
<Cashbox
|
||||
className={classes.cashbox}
|
||||
labelClassName={classes.cashboxLabel}
|
||||
emptyPartClassName={classes.cashboxEmptyPart}
|
||||
percent={fiatBalanceCassette1Percent}
|
||||
cashOut
|
||||
|
|
@ -97,7 +97,7 @@ const FiatBalance = ({
|
|||
</div>
|
||||
<div className={classes.row}>
|
||||
<Cashbox
|
||||
className={classes.cashbox}
|
||||
labelClassName={classes.cashboxLabel}
|
||||
emptyPartClassName={classes.cashboxEmptyPart}
|
||||
percent={fiatBalanceCassette2Percent}
|
||||
cashOut
|
||||
|
|
|
|||
|
|
@ -24,11 +24,9 @@ export default {
|
|||
col2: {
|
||||
width: 136
|
||||
},
|
||||
cashbox: {
|
||||
'& p': {
|
||||
marginRight: 4,
|
||||
fontSize: 20
|
||||
}
|
||||
cashboxLabel: {
|
||||
marginRight: 4,
|
||||
fontSize: 20
|
||||
},
|
||||
cashboxEmptyPart: {
|
||||
backgroundColor: `${backgroundColor}`
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue