From 1b81655832976c04aecabf1d6fc6df17050cd576 Mon Sep 17 00:00:00 2001
From: Jeremy <168515712+jeremy-babylonchain@users.noreply.github.com>
Date: Mon, 29 Jul 2024 14:44:32 +0800
Subject: [PATCH] fix balance view (#384)

* fix balance view

* version bump and fix potentional error
---
 package.json                         |  2 +-
 src/app/components/Header/Header.tsx | 44 +++++++++++++++-------------
 2 files changed, 24 insertions(+), 22 deletions(-)

diff --git a/package.json b/package.json
index 8abdcbe4..c3d2c0b8 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "simple-staking",
-  "version": "0.2.19",
+  "version": "0.2.20",
   "private": true,
   "scripts": {
     "dev": "next dev",
diff --git a/src/app/components/Header/Header.tsx b/src/app/components/Header/Header.tsx
index 88317c04..cdbf5ff6 100644
--- a/src/app/components/Header/Header.tsx
+++ b/src/app/components/Header/Header.tsx
@@ -21,29 +21,31 @@ export const Header: React.FC<HeaderProps> = ({
   return (
     <nav>
       <div className="bg-base-300 shadow-sm">
-        <div className="container mx-auto flex w-full items-center justify-between gap-4 p-6 pb-4 md:pb-6">
-          <Logo />
-          <div className="flex flex-1">
-            <div className="hidden flex-1 xl:flex">
-              <TestingInfo />
+        <div className="container mx-auto flex-col">
+          <div className="w-full flex items-center justify-between gap-4 p-6 pb-4 md:pb-6">
+            <Logo />
+            <div className="flex flex-1">
+              <div className="hidden flex-1 xl:flex">
+                <TestingInfo />
+              </div>
             </div>
+            <ConnectSmall
+              onConnect={onConnect}
+              address={address}
+              btcWalletBalanceSat={btcWalletBalanceSat}
+              onDisconnect={onDisconnect}
+            />
+            <ThemeToggle />
+          </div>
+          <div
+            className={`container mx-auto flex w-full items-center gap-4 md:hidden md:p-0 ${address ? "justify-end p-6 pt-0" : ""}`}
+          >
+            <ConnectedSmall
+              address={address}
+              btcWalletBalanceSat={btcWalletBalanceSat}
+              onDisconnect={onDisconnect}
+            />
           </div>
-          <ConnectSmall
-            onConnect={onConnect}
-            address={address}
-            btcWalletBalanceSat={btcWalletBalanceSat}
-            onDisconnect={onDisconnect}
-          />
-          <ThemeToggle />
-        </div>
-        <div
-          className={`${address && "justify-end p-6 pt-0"}container mx-auto flex w-full items-center gap-4 md:hidden md:p-0`}
-        >
-          <ConnectedSmall
-            address={address}
-            btcWalletBalanceSat={btcWalletBalanceSat}
-            onDisconnect={onDisconnect}
-          />
         </div>
       </div>
       <div className="container mx-auto flex w-full items-center p-6 pb-0 xl:hidden">