blockworks-foundation
/
mango-v4-ui
mirror of https://github.com/blockworks-foundation/mango-v4-ui.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

review trade font size

This commit is contained in:
saml33 2022-08-03 20:02:18 +10:00
parent 210e96237d
commit b6168b9089
2 changed files with 17 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
components/TokenList.tsx
View File

@ -123,8 +123,8 @@ const TokenList = () => {
<div className="mr-2.5 flex flex-shrink-0 items-center"> <div className="mr-2.5 flex flex-shrink-0 items-center">
<Image <Image
alt="" alt=""
width="32" width="24"
height="32" height="24"
src={`/icons/${bank.value.name.toLowerCase()}.svg`} src={`/icons/${bank.value.name.toLowerCase()}.svg`}
/> />
</div> </div>

30
components/swap/RouteFeeInfo.tsx
View File

@ -44,7 +44,7 @@ const RouteFeeInfo = ({
}, [selectedRoute, connected]) }, [selectedRoute, connected])
return ( return (
<div className="space-y-4 px-1"> <div className="space-y-3 px-1">
<div className="mb-4 flex items-center justify-between"> <div className="mb-4 flex items-center justify-between">
<h3>{t('trade:review-trade')}</h3> <h3>{t('trade:review-trade')}</h3>
</div> </div>
@ -75,10 +75,10 @@ const RouteFeeInfo = ({
</div> */} </div> */}
{amountOut && amountIn ? ( {amountOut && amountIn ? (
<div className="flex justify-between"> <div className="flex justify-between">
<p className="text-th-fgd-3">{t('trade:rate')}</p> <p className="text-sm text-th-fgd-3">{t('trade:rate')}</p>
<div> <div>
<div className="flex items-center justify-end"> <div className="flex items-center justify-end">
<p className="text-right font-bold text-th-fgd-1"> <p className="text-right text-sm text-th-fgd-1">
{swapRate ? ( {swapRate ? (
<> <>
1 {inputTokenSymbol} ≈{' '} 1 {inputTokenSymbol} ≈{' '}
@ -134,9 +134,9 @@ const RouteFeeInfo = ({
</div> </div>
) : null} ) : null}
<div className="flex justify-between"> <div className="flex justify-between">
<p className="text-th-fgd-3">{t('trade:minimum-received')}</p> <p className="text-sm text-th-fgd-3">{t('trade:minimum-received')}</p>
{outputTokenInfo?.decimals ? ( {outputTokenInfo?.decimals ? (
<p className="text-right font-bold text-th-fgd-1"> <p className="text-right text-sm text-th-fgd-1">
{formatDecimal( {formatDecimal(
selectedRoute?.outAmountWithSlippage / selectedRoute?.outAmountWithSlippage /
10 ** outputTokenInfo.decimals || 1, 10 ** outputTokenInfo.decimals || 1,
@ -147,16 +147,16 @@ const RouteFeeInfo = ({
) : null} ) : null}
</div> </div>
<div className="flex justify-between"> <div className="flex justify-between">
<p className="text-th-fgd-3">{t('trade:health-impact')}</p> <p className="text-sm text-th-fgd-3">{t('trade:health-impact')}</p>
<p className="text-right font-bold text-th-fgd-1">0%</p> <p className="text-right text-sm text-th-fgd-1">0%</p>
</div> </div>
<div className="flex justify-between"> <div className="flex justify-between">
<p className="text-th-fgd-3">{t('trade:est-liq-price')}</p> <p className="text-sm text-th-fgd-3">{t('trade:est-liq-price')}</p>
<p className="text-right font-bold text-th-fgd-1">N/A</p> <p className="text-right text-sm text-th-fgd-1">N/A</p>
</div> </div>
<div className="flex justify-between"> <div className="flex justify-between">
<p className="text-th-fgd-3">{t('trade:slippage')}</p> <p className="text-sm text-th-fgd-3">{t('trade:slippage')}</p>
<p className="text-right font-bold text-th-fgd-1"> <p className="text-right text-sm text-th-fgd-1">
{selectedRoute?.priceImpactPct * 100 < 0.1 {selectedRoute?.priceImpactPct * 100 < 0.1
? '< 0.1%' ? '< 0.1%'
: `~ ${(selectedRoute?.priceImpactPct * 100).toFixed(4)}%`} : `~ ${(selectedRoute?.priceImpactPct * 100).toFixed(4)}%`}
@ -164,9 +164,9 @@ const RouteFeeInfo = ({
</div> </div>
{typeof feeValue === 'number' ? ( {typeof feeValue === 'number' ? (
<div className="flex justify-between"> <div className="flex justify-between">
<p className="text-th-fgd-3">{t('fee')}</p> <p className="text-sm text-th-fgd-3">{t('fee')}</p>
<div className="flex items-center"> <div className="flex items-center">
<p className="text-right font-bold text-th-fgd-1"> <p className="text-right text-sm text-th-fgd-1">
≈ ${feeValue?.toFixed(2)} ≈ ${feeValue?.toFixed(2)}
</p> </p>
</div> </div>
@ -178,13 +178,13 @@ const RouteFeeInfo = ({
) )
return ( return (
<div className="flex justify-between" key={index}> <div className="flex justify-between" key={index}>
<p className="text-th-fgd-3"> <p className="text-sm text-th-fgd-3">
{t('trade:fees-paid-to', { {t('trade:fees-paid-to', {
route: info?.amm?.label, route: info?.amm?.label,
})} })}
</p> </p>
{feeToken?.decimals && ( {feeToken?.decimals && (
<p className="text-right font-bold text-th-fgd-1"> <p className="text-right text-sm text-th-fgd-1">
{( {(
info.lpFee?.amount / Math.pow(10, feeToken.decimals) info.lpFee?.amount / Math.pow(10, feeToken.decimals)
).toFixed(6)}{' '} ).toFixed(6)}{' '}