token balance fix

ui/address/tokens/TokenBalances.tsx

@@ -45,7 +45,7 @@ const TokenBalances = () => {
   const totalUsd = nativeUsd.plus(tokensInfo.usd);
   const tokensNumText = tokensInfo.num > 0 ?
     `${ prefix }${ tokensInfo.num } ${ tokensInfo.num > 1 ? 'tokens' : 'token' }` :
-    '';
+    '0';
 
   return (
     <Flex columnGap={ 3 } rowGap={ 3 } mt={{ base: '6px', lg: 0 }} flexDirection={{ base: 'column', lg: 'row' }}>
@@ -53,7 +53,7 @@ const TokenBalances = () => {
         name="Net Worth"
         value={ addressData?.exchange_rate ? `${ prefix }$${ totalUsd.toFormat(2) }` : 'N/A' }
         isLoading={ addressQuery.isPending || tokenQuery.isPending }
-        icon={ <IconSvg name="wallet" boxSize="24px" flexShrink={ 0 }/> }
+        icon={ <IconSvg name="wallet" boxSize="24px" flexShrink={ 0 } color="text_secondary"/> }
       />
       <TokenBalancesItem
         name={ `${ currencyUnits.ether } Balance` }
@@ -67,7 +67,7 @@ const TokenBalances = () => {
         value={ tokensNumText }
         valueSecondary={ `${ prefix }$${ tokensInfo.usd.toFormat(2) }` }
         isLoading={ addressQuery.isPending || tokenQuery.isPending }
-        icon={ <IconSvg name="tokens" boxSize="20px" flexShrink={ 0 }/> }
+        icon={ <IconSvg name="tokens" boxSize="20px" flexShrink={ 0 } color="text_secondary"/> }
       />
     </Flex>
   );

ui/address/tokens/TokenBalancesItem.tsx

@@ -15,7 +15,7 @@ const TokenBalancesItem = ({ name, icon, value, valueSecondary, isLoading }: Pro
 
   return (
     <Box px="12px" py="10px" bgColor={ bgColor } borderRadius="base">
-      <Text variant="secondary" fontSize="xs">{ name }</Text>
+      <Text variant="secondary" fontSize="xs" fontWeight={ 500 } mb={ 1 }>{ name }</Text>
       <Flex alignItems="center">
         { icon }
         <Skeleton isLoaded={ !isLoading } fontWeight="500" whiteSpace="pre-wrap" wordBreak="break-word" display="flex" ml={ 2 }>