From 9547f9438585ded0654558ad787b35cdb033a706 Mon Sep 17 00:00:00 2001
From: shadab-taiko <108871478+shadab-taiko@users.noreply.github.com>
Date: Mon, 20 Feb 2023 21:19:37 +0530
Subject: [PATCH] fix(bridge-ui): max button css (#13192)

---
 .../src/components/form/BridgeForm.svelte     | 21 ++++++++++++-------
 packages/bridge-ui/src/i18n.js                |  3 ++-
 2 files changed, 16 insertions(+), 8 deletions(-)

diff --git a/packages/bridge-ui/src/components/form/BridgeForm.svelte b/packages/bridge-ui/src/components/form/BridgeForm.svelte
index c1565c949bc..e6b09c0a734 100644
--- a/packages/bridge-ui/src/components/form/BridgeForm.svelte
+++ b/packages/bridge-ui/src/components/form/BridgeForm.svelte
@@ -348,13 +348,20 @@
     <span class="label-text">{$_("bridgeForm.fieldLabel")}</span>
 
     {#if $signer && tokenBalance}
-      <button class="label-text" on:click={useFullAmount}
-        >{$_("bridgeForm.maxLabel")}
-        {tokenBalance.length > 10
-          ? `${truncateString(tokenBalance, 6)}...`
-          : tokenBalance}
-        {$token.symbol}
-      </button>{/if}
+      <div class="label-text ">
+        <span>
+          {$_("bridgeForm.balance")}:
+          {tokenBalance.length > 10
+            ? `${truncateString(tokenBalance, 6)}...`
+            : tokenBalance}
+          {$token.symbol}
+        </span>
+
+        <button class="btn btn-xs rounded-md hover:border-accent text-xs ml-1 h-[20px]" on:click={useFullAmount}>
+          {$_("bridgeForm.maxLabel")}
+        </button>
+      </div>
+    {/if}
   </label>
 
   <label
diff --git a/packages/bridge-ui/src/i18n.js b/packages/bridge-ui/src/i18n.js
index 8f994bd81b8..0b74a127e59 100644
--- a/packages/bridge-ui/src/i18n.js
+++ b/packages/bridge-ui/src/i18n.js
@@ -12,7 +12,8 @@ function setupI18n({ withLocale: _locale } = { withLocale: "en" }) {
       },
       bridgeForm: {
         fieldLabel: "Amount",
-        maxLabel: "Max:",
+        maxLabel: "Max",
+        balance: "Balance",
         processingFeeLabel: "Processing Fee",
         bridge: "Bridge",
         approve: "Approve",