From 692f36ca96989c0a1375961e04ad3a0eb7044c1f Mon Sep 17 00:00:00 2001
From: Hristo Nedelkov <hristo.nedelkow@gmail.com>
Date: Fri, 26 Jan 2024 10:39:22 +0200
Subject: [PATCH] Make parent responsive

---
 .../ConsensusClient/ConsensusSelection.tsx               | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/pages/ValidatorOnboarding/ValidatorSetup/ConsensusClient/ConsensusSelection.tsx b/src/pages/ValidatorOnboarding/ValidatorSetup/ConsensusClient/ConsensusSelection.tsx
index 0839c4ad..8476c29c 100644
--- a/src/pages/ValidatorOnboarding/ValidatorSetup/ConsensusClient/ConsensusSelection.tsx
+++ b/src/pages/ValidatorOnboarding/ValidatorSetup/ConsensusClient/ConsensusSelection.tsx
@@ -39,7 +39,12 @@ const ConsensusSelection = () => {
         <Text size={27} weight={'semibold'}>
           Client Setup
         </Text>
-        <XStack space={'$2'} flexWrap="wrap">
+        <XStack
+          space={'$2'}
+          flexWrap={windowSize.width < 735 ? 'wrap' : 'nowrap'}
+          marginTop={windowSize.width < 735 ? '20px' : 0}
+           width={windowSize.width < 580 ? '100%' : 'auto'}
+        >
           <PairedDeviceCard />
 
           <ConsensusGaugeCard
@@ -72,7 +77,7 @@ const ConsensusSelection = () => {
 
       <XStack space={'$8'} flexWrap="wrap">
         <ConsensusClientCard name={clients[0].name} icon={clients[0].icon} />
-        <YStack width={windowSize.width<780 ? '100%' : '70%'} space={'$4'}>
+        <YStack width={windowSize.width < 780 ? '100%' : '70%'} space={'$4'}>
           <Text size={19}>The resource efficient Ethereum Clients.</Text>
           <Text size={15}>
             {selectedClient} is a client implementation for both execution and consensus layers that