From abda7859c03cfb3b4031a5f267cef103166b0ae4 Mon Sep 17 00:00:00 2001
From: RadoslavDimchev <RadoslavDimchev111@gmail.com>
Date: Fri, 11 Aug 2023 14:08:55 +0300
Subject: [PATCH] fix: update width and space

---
 src/components/HealthInfoSection.tsx          |  2 +-
 .../DeviceHealthCheck/DeviceHealthCheck.tsx   | 27 ++++++++++---------
 2 files changed, 15 insertions(+), 14 deletions(-)

diff --git a/src/components/HealthInfoSection.tsx b/src/components/HealthInfoSection.tsx
index 6144735e..87edee70 100644
--- a/src/components/HealthInfoSection.tsx
+++ b/src/components/HealthInfoSection.tsx
@@ -30,7 +30,7 @@ const HealthInfoSection = (props: HealthInfoSectionProps) => {
   const networkLatencyPercentage = networkLatency > 100 ? 100 : 0
 
   return (
-    <YStack space={'$2'}>
+    <YStack space={'$3'}>
       <StatusIconText
         percentage={usedStoragePercentage}
         threshold={80}
diff --git a/src/pages/DeviceHealthCheck/DeviceHealthCheck.tsx b/src/pages/DeviceHealthCheck/DeviceHealthCheck.tsx
index 5534bdf7..03499fa8 100644
--- a/src/pages/DeviceHealthCheck/DeviceHealthCheck.tsx
+++ b/src/pages/DeviceHealthCheck/DeviceHealthCheck.tsx
@@ -24,15 +24,18 @@ const DeviceHeanlthCheckContent = () => {
     <div className="container-inner landing-page">
       <YStack
         space={'$4'}
-        style={{ justifyContent: 'end', alignItems: 'start', marginBottom: '2rem' }}
+        style={{
+          justifyContent: 'end',
+          alignItems: 'start',
+          marginBottom: '2rem',
+          maxWidth: '100%',
+        }}
       >
         <NimbusLogo />
-        <Stack style={{ width: '39%' }}>
-          <Titles
-            title="Device Health Check"
-            subtitle="Configure your device to start Staking on Nimbus"
-          />
-        </Stack>
+        <Titles
+          title="Device Health Check"
+          subtitle="Configure your device to start Staking on Nimbus"
+        />
         <XStack space={'$4'}>
           <DeviceStorageHealth storage={1} maxStorage={2} />
           <DeviceStorageHealth storage={2} maxStorage={1} />
@@ -49,12 +52,10 @@ const DeviceHeanlthCheckContent = () => {
           cpuClockRate={2.5}
           networkLatency={75}
         />
-        <Stack style={{ width: '39%' }}>
-          <InformationBox
-            icon={<Icon src="/icons/close.png" width={11} height={11} />}
-            message="The information provided in the Nodes Health Check is meant to utilized as a guide to guage the readiness of your device, however please do your own due diligence prior to commiting any funds. Read our Health Check Disclosure for more information."
-          />
-        </Stack>
+        <InformationBox
+          icon={<Icon src="/icons/close.png" width={11} height={11} />}
+          message="The information provided in the Nodes Health Check is meant to utilized as a guide to guage the readiness of your device, however please do your own due diligence prior to commiting any funds. Read our Health Check Disclosure for more information."
+        />
         <Stack style={{ marginTop: '1rem' }}>
           <Button>Continue</Button>
         </Stack>