From 34fd3e73745118a26711fdd589b51470149a74fc Mon Sep 17 00:00:00 2001
From: sehyunc <41171808+sehyunc@users.noreply.github.com>
Date: Tue, 8 Oct 2024 19:34:33 -0700
Subject: [PATCH] move tooltips to the right

---
 .../dialogs/transfer/transfer-status-display.tsx       |  2 +-
 components/dialogs/transfer/usdc-form.tsx              | 10 ++++++++--
 components/dialogs/transfer/weth-form.tsx              | 10 ++++++++--
 3 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/components/dialogs/transfer/transfer-status-display.tsx b/components/dialogs/transfer/transfer-status-display.tsx
index 968a9f4a..49bd4ff9 100644
--- a/components/dialogs/transfer/transfer-status-display.tsx
+++ b/components/dialogs/transfer/transfer-status-display.tsx
@@ -51,7 +51,7 @@ export function TransferStatusDisplay({
         const Content = () => {
           if (isTask) {
             return (
-              <div className="text-xs text-muted">
+              <div className="space-y-0.5 text-xs text-muted">
                 {TASK_STATES.map((state) => (
                   <div
                     key={state}
diff --git a/components/dialogs/transfer/usdc-form.tsx b/components/dialogs/transfer/usdc-form.tsx
index fb3bd364..b8aa4202 100644
--- a/components/dialogs/transfer/usdc-form.tsx
+++ b/components/dialogs/transfer/usdc-form.tsx
@@ -640,7 +640,10 @@ export function USDCForm({
                           </div>
                         </Button>
                       </ResponsiveTooltipTrigger>
-                      <ResponsiveTooltipContent>
+                      <ResponsiveTooltipContent
+                        side="right"
+                        sideOffset={10}
+                      >
                         {`${formattedUsdcBalance} ${baseToken?.ticker}`}
                       </ResponsiveTooltipContent>
                     </ResponsiveTooltip>
@@ -666,7 +669,10 @@ export function USDCForm({
                         </div>
                       </Button>
                     </ResponsiveTooltipTrigger>
-                    <ResponsiveTooltipContent>
+                    <ResponsiveTooltipContent
+                      side="right"
+                      sideOffset={10}
+                    >
                       {`${formattedUsdceBalance} USDC.e`}
                     </ResponsiveTooltipContent>
                   </ResponsiveTooltip>
diff --git a/components/dialogs/transfer/weth-form.tsx b/components/dialogs/transfer/weth-form.tsx
index 06d48869..9b71e081 100644
--- a/components/dialogs/transfer/weth-form.tsx
+++ b/components/dialogs/transfer/weth-form.tsx
@@ -691,7 +691,10 @@ export function WETHForm({
                           </div>
                         </Button>
                       </ResponsiveTooltipTrigger>
-                      <ResponsiveTooltipContent>
+                      <ResponsiveTooltipContent
+                        side="right"
+                        sideOffset={10}
+                      >
                         {`${balance} ${baseToken.ticker}`}
                       </ResponsiveTooltipContent>
                     </ResponsiveTooltip>
@@ -738,7 +741,10 @@ export function WETHForm({
                         </div>
                       </Button>
                     </ResponsiveTooltipTrigger>
-                    <ResponsiveTooltipContent>
+                    <ResponsiveTooltipContent
+                      side="right"
+                      sideOffset={10}
+                    >
                       {ethBalance?.value &&
                       minEthToKeepUnwrapped > ethBalance.value
                         ? "Not enough ETH to wrap"