fix: logo styling and value string

This commit is contained in:
Sérgio Salgado 2021-03-04 14:10:11 +00:00 committed by Josh Harvey
parent 3da4904d56
commit 29d3aad25c
2 changed files with 23 additions and 33 deletions

View file

@ -1,6 +1,7 @@
/* eslint-disable no-unused-vars */ /* eslint-disable no-unused-vars */
import { Paper } from '@material-ui/core' import { Paper } from '@material-ui/core'
import { makeStyles } from '@material-ui/core/styles' import { makeStyles } from '@material-ui/core/styles'
import classnames from 'classnames'
import * as R from 'ramda' import * as R from 'ramda'
import React from 'react' import React from 'react'
@ -75,19 +76,25 @@ const WalletInfoChip = ({ wallet, currency }) => {
const getLogo = cryptoCode => { const getLogo = cryptoCode => {
switch (cryptoCode) { switch (cryptoCode) {
case 'BTC': case 'BTC':
return <BitcoinLogo className={classes.btcLogo} /> return <BitcoinLogo className={classes.logo} />
case 'ETH': case 'ETH':
return <EthereumLogo className={classes.ethLogo} /> return <EthereumLogo className={classes.logo} />
case 'LTC': case 'LTC':
return <LitecoinLogo className={classes.ltcLogo} /> return <LitecoinLogo className={classes.logo} />
case 'ZEC': case 'ZEC':
return <ZCashLogo className={classes.zecLogo} /> return (
<ZCashLogo className={classnames(classes.logo, classes.zecLogo)} />
)
case 'BCH': case 'BCH':
return <BitcoinCashLogo className={classes.bchLogo} /> return (
<BitcoinCashLogo
className={classnames(classes.logo, classes.bchLogo)}
/>
)
case 'DASH': case 'DASH':
return <DashLogo className={classes.dashLogo} /> return <DashLogo className={classes.logo} />
default: default:
return <BitcoinLogo className={classes.btcLogo} /> return <BitcoinLogo className={classes.logo} />
} }
} }
@ -103,7 +110,7 @@ const WalletInfoChip = ({ wallet, currency }) => {
<div className={classes.walletValueWrapper}> <div className={classes.walletValueWrapper}>
<Label2 className={classes.fieldHeader}>{wallet.name} value</Label2> <Label2 className={classes.fieldHeader}>{wallet.name} value</Label2>
<Label2 className={classes.walletValue}> <Label2 className={classes.walletValue}>
{wallet.amount.toLocaleString('en-US', { {wallet.amount.toFixed(1).toLocaleString('en-US', {
maximumFractionDigits: 2 maximumFractionDigits: 2
})}{' '} })}{' '}
{wallet.cryptoCode} {wallet.cryptoCode}

View file

@ -54,37 +54,20 @@ const styles = ({ numberOfChips }) => ({
walletHeader: { walletHeader: {
display: 'flex', display: 'flex',
flexDirection: 'row', flexDirection: 'row',
justifyContent: 'space-between' justifyContent: 'space-between',
height: 50
}, },
btcLogo: { logo: {
transform: `scale(0.4, 0.4)`, transform: `scale(0.4, 0.4)`,
margin: [[-8, 0, 0, -26]] height: 80,
}, maxWidth: 110,
ethLogo: { margin: [[-14, 0, 0, -26]]
transform: `scale(0.35, 0.35)`,
margin: [[-16, 0, -7, -15]],
maxHeight: 80,
maxWidth: 80
},
ltcLogo: {
transform: `scale(0.4, 0.4)`,
margin: [[-8, 0, 0, -26]]
}, },
zecLogo: { zecLogo: {
transform: `scale(0.4, 0.4)`, margin: [[-15, 0, 0, -10]]
margin: [[-15, 0, -9, -14]],
maxHeight: 80,
maxWidth: 80
}, },
bchLogo: { bchLogo: {
transform: `scale(0.4, 0.4)`, margin: [[-12, 0, 0, -18]]
margin: [[-8, 0, 0, -15]]
},
dashLogo: {
transform: `scale(0.4, 0.4)`,
margin: [[-13, 0, -10, -10]],
maxHeight: 80,
maxWidth: 80
}, },
hedgedText: { hedgedText: {
color: offColor, color: offColor,