From c3d050ea7bb089851d4f3554c3a4cea3c34f3ae8 Mon Sep 17 00:00:00 2001
From: Ynng <44907675+Ynng@users.noreply.github.com>
Date: Sun, 19 Feb 2023 18:15:21 -0500
Subject: [PATCH] Fixed Button's behaviour when loading

---
 src/components/Atoms/Button.tsx | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/components/Atoms/Button.tsx b/src/components/Atoms/Button.tsx
index a6213b755..7e0812d8b 100644
--- a/src/components/Atoms/Button.tsx
+++ b/src/components/Atoms/Button.tsx
@@ -110,12 +110,14 @@ const Button = forwardRef(
         {iconComponent}
         {icon && <FontAwesomeIcon icon={icon} className="w-4 opacity-50" />}
         <div className={`flex grow items-center truncate`}>
-          {loading && (
-            <BeatLoader size={5} color="#6b7280" className="absolute" />
-          )}
-          <span className={clsx(loading && 'opacity-0') + 'truncate'}>
-            {label}
-          </span>
+          <div className="relative h-fit w-fit">
+            {loading && (
+              <BeatLoader size={5} color="#6b7280" className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 transform" />
+            )}
+            <span className={clsx(loading && 'opacity-0', 'truncate')}>
+              {label}
+            </span>
+          </div>
         </div>
 
         {iconRight && (