fix manual refresh mobile padding

components/shared/BalancesTable.tsx

@@ -191,6 +191,8 @@ const Balance = ({ bank }: { bank: BankWithBalance }) => {
   const { selectedMarket } = useSelectedMarket()
   const { asPath } = useRouter()
   const { isUnownedAccount } = useUnownedAccount()
+  const { width } = useViewport()
+  const isMobile = width ? width < breakpoints.md : false
 
   const tokenBank = bank.bank
 
@@ -284,11 +286,11 @@ const Balance = ({ bank }: { bank: BankWithBalance }) => {
     }
   }, [tokenBank, selectedMarket])
 
-  if (!balance) return <p className="flex justify-end">0</p>
+  if (!balance) return <p className="md:flex md:justify-end">0</p>
 
   return (
-    <p className="flex justify-end text-th-fgd-2">
-      {!isUnownedAccount ? (
+    <p className="text-th-fgd-2 md:flex md:justify-end">
+      {!isUnownedAccount && !isMobile ? (
         asPath.includes('/trade') && isBaseOrQuote ? (
           <LinkButton
             className="font-normal underline underline-offset-2 md:underline-offset-4 md:hover:no-underline"

components/trade/TradeAdvancedPage.tsx

@@ -101,7 +101,7 @@ const TradeAdvancedPage = () => {
           x: balancesXPos[tradeLayout].xxxl,
           y: 2,
           w: 16,
-          h: getHeight(innerHeight, 0, 640 + marketHeaderHeight),
+          h: getHeight(innerHeight, 0, 640),
         },
         {
           i: 'orderbook',
@@ -126,7 +126,7 @@ const TradeAdvancedPage = () => {
           x: balancesXPos[tradeLayout].xxl,
           y: 2,
           w: 15,
-          h: getHeight(innerHeight, 0, 488 + marketHeaderHeight),
+          h: getHeight(innerHeight, 0, 488),
         },
         {
           i: 'orderbook',
@@ -151,7 +151,7 @@ const TradeAdvancedPage = () => {
           x: balancesXPos[tradeLayout].xl,
           y: 2,
           w: 15,
-          h: getHeight(innerHeight, 0, 488 + marketHeaderHeight),
+          h: getHeight(innerHeight, 0, 488),
         },
         {
           i: 'orderbook',
@@ -176,7 +176,7 @@ const TradeAdvancedPage = () => {
           x: balancesXPos[tradeLayout].lg,
           y: 2,
           w: 13,
-          h: getHeight(innerHeight, 0, 456 + marketHeaderHeight),
+          h: getHeight(innerHeight, 0, 456),
         },
         {
           i: 'orderbook',

pages/index.tsx

@@ -27,7 +27,7 @@ export async function getStaticProps({ locale }: { locale: string }) {
 
 const Index: NextPage = () => {
   return (
-    <div className="min-h-[calc(100vh-64px)] pb-20 md:pb-0">
+    <div className="min-h-[calc(100vh-64px)] pb-32 md:pb-20 lg:pb-0">
       <AccountPage />
     </div>
   )

pages/swap.tsx

@@ -24,7 +24,7 @@ export async function getStaticProps({ locale }: { locale: string }) {
 
 const Swap: NextPage = () => {
   return (
-    <div className="pb-20 md:pb-0">
+    <div className="pb-32 md:pb-20 lg:pb-0">
       <SwapPage />
     </div>
   )