From d9e50bdd281ae03c93dd299c7c21783f9069ca2c Mon Sep 17 00:00:00 2001
From: snoopy1412 <snoopy1412.su@gmail.com>
Date: Thu, 12 Sep 2024 20:54:30 +0800
Subject: [PATCH] Refactor styling in deposit and stake components

---
 src/view/deposit/_components/records.tsx                  | 3 ++-
 src/view/stake/_components/manage/index.tsx               | 8 +++++++-
 .../_components/new/collator-active-selection-table.tsx   | 3 ++-
 .../_components/new/collator-waiting-selection-table.tsx  | 3 ++-
 4 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/src/view/deposit/_components/records.tsx b/src/view/deposit/_components/records.tsx
index f651405..547773f 100644
--- a/src/view/deposit/_components/records.tsx
+++ b/src/view/deposit/_components/records.tsx
@@ -214,7 +214,8 @@ const DepositRecordsModal = ({
               color="primary"
               layout="fixed"
               classNames={{
-                wrapper: 'overflow-auto max-h-[50vh] rounded-medium  p-0 bg-secondary',
+                wrapper:
+                  'overflow-auto max-h-[50vh] rounded-medium  p-0 shadow-none bg-background dark:bg-secondary',
                 td: 'text-foreground'
               }}
               bottomContentPlacement="outside"
diff --git a/src/view/stake/_components/manage/index.tsx b/src/view/stake/_components/manage/index.tsx
index d8dddff..40124a0 100644
--- a/src/view/stake/_components/manage/index.tsx
+++ b/src/view/stake/_components/manage/index.tsx
@@ -200,7 +200,13 @@ const StakeManagementModal = ({
             Manage Stake
           </ModalHeader>
           <Divider />
-          <ModalBody className="relative flex w-full flex-col items-center justify-center gap-5 px-0 py-5">
+          <ModalBody
+            className="relative flex w-full flex-col items-center justify-center gap-5 px-0 py-5"
+            style={{
+              pointerEvents:
+                isLoading || isCollatorLoading || isCollatorRefetching ? 'none' : 'auto'
+            }}
+          >
             {(isLoading || isCollatorLoading || isCollatorRefetching) && (
               <div className="absolute inset-0 flex items-center justify-center bg-background/50">
                 <Spinner />
diff --git a/src/view/stake/_components/new/collator-active-selection-table.tsx b/src/view/stake/_components/new/collator-active-selection-table.tsx
index c88679f..cf54d1f 100644
--- a/src/view/stake/_components/new/collator-active-selection-table.tsx
+++ b/src/view/stake/_components/new/collator-active-selection-table.tsx
@@ -115,7 +115,8 @@ const CollatorSelectionTable = ({
         selectedKeys={selectedCollator?.address}
         bottomContentPlacement="outside"
         classNames={{
-          wrapper: 'overflow-auto max-h-[50vh] rounded-medium  p-0 bg-secondary',
+          wrapper:
+            'overflow-auto max-h-[50vh] rounded-medium  p-0 shadow-none bg-background dark:bg-secondary',
           td: 'text-foreground'
         }}
         layout="fixed"
diff --git a/src/view/stake/_components/new/collator-waiting-selection-table.tsx b/src/view/stake/_components/new/collator-waiting-selection-table.tsx
index 37ce4f4..9181e92 100644
--- a/src/view/stake/_components/new/collator-waiting-selection-table.tsx
+++ b/src/view/stake/_components/new/collator-waiting-selection-table.tsx
@@ -125,7 +125,8 @@ const CollatorWaitingSelectionTable = ({
         selectedKeys={selectedCollator?.address}
         bottomContentPlacement="outside"
         classNames={{
-          wrapper: 'overflow-auto max-h-[50vh] rounded-medium  p-0 bg-secondary',
+          wrapper:
+            'overflow-auto max-h-[50vh] rounded-medium p-0 shadow-none bg-background dark:bg-secondary',
           td: 'text-foreground'
         }}
         bottomContent={