From 70b66834affbde417e2e00c36d4d780d2b4d7a1b Mon Sep 17 00:00:00 2001
From: RadoslavDimchev <RadoslavDimchev111@gmail.com>
Date: Fri, 17 Nov 2023 23:28:29 +0200
Subject: [PATCH] feat: use new css class names with divs

---
 .../ValidatorManagement/ManagementHeader.tsx  | 28 +++++++++++--------
 1 file changed, 16 insertions(+), 12 deletions(-)

diff --git a/src/pages/ValidatorManagement/ManagementHeader.tsx b/src/pages/ValidatorManagement/ManagementHeader.tsx
index c6550e44..3a66480f 100644
--- a/src/pages/ValidatorManagement/ManagementHeader.tsx
+++ b/src/pages/ValidatorManagement/ManagementHeader.tsx
@@ -15,18 +15,22 @@ const ManagementHeader = () => {
     >
       <TitleLogo subtitle="Validator Management" />
       <XStack space={'$2'}>
-        <SyncStatusCard
-          synced={123.524}
-          total={172.503}
-          title="Execution Sync Status"
-          color="#2a4af5"
-        />
-        <SyncStatusCard
-          synced={123.524}
-          total={172.503}
-          title="Consensus Sync Status"
-          color="#ff6161"
-        />
+        <div className="sync-status-card-container-first">
+          <SyncStatusCard
+            synced={123.524}
+            total={172.503}
+            title="Execution Sync Status"
+            color="#2a4af5"
+          />
+        </div>
+        <div className="sync-status-card-container-second">
+          <SyncStatusCard
+            synced={123.524}
+            total={172.503}
+            title="Consensus Sync Status"
+            color="#ff6161"
+          />
+        </div>
       </XStack>
     </XStack>
   )