use prop to toggle clickable balance on trade page only

components/BalancesTable.tsx

@@ -23,6 +23,7 @@ import { useRouter } from 'next/router'
 const BalancesTable = ({
   showZeroBalances = false,
   showDepositWithdraw = false,
+  clickToPopulateTradeForm = false,
 }) => {
   const { t } = useTranslation('common')
   const [showDepositModal, setShowDepositModal] = useState(false)
@@ -398,7 +399,7 @@ const BalancesTable = ({
                         {marketConfig.kind === 'spot' &&
                         marketConfig.name.includes(balance.symbol) &&
                         selectedMarket &&
-                        decodeURIComponent(asPath).includes(`name`) ? ( // disable this in account page
+                        clickToPopulateTradeForm ? (
                           <span
                             className={
                               balance.net.toNumber() != 0

components/UserInfo.tsx

@@ -55,7 +55,7 @@ const TabContent = ({ activeTab }) => {
     case 'Orders':
       return <OpenOrdersTable />
     case 'Balances':
-      return <BalancesTable />
+      return <BalancesTable clickToPopulateTradeForm />
     case 'Trade History':
       return <TradeHistoryTable numTrades={100} />
     case 'Positions':
@@ -63,7 +63,7 @@ const TabContent = ({ activeTab }) => {
     case 'Fee Discount':
       return <FeeDiscountsTable />
     default:
-      return <BalancesTable />
+      return <BalancesTable clickToPopulateTradeForm />
   }
 }
 

tailwind.config.js

@@ -56,7 +56,7 @@ module.exports = {
           'fgd-2': '#C8C8C8',
           'fgd-3': '#B3B3B3',
           'fgd-4': '#878787',
-          'bkg-button': '#52514E',
+          'bkg-button': '#4E5152',
         },
         'mango-theme': {
           yellow: {