feat: make keystore backups card responsive

src/pages/ValidatorOnboarding/KeyGeneration/KeystoreFiles/KeystoreBackupsCard.tsx

@@ -17,7 +17,6 @@ const KeystoreBackupsCard = () => {
         border: '1px solid #DCE0E5',
         borderRadius: '16px',
         padding: '12px 16px',
-        width: '32%',
         marginTop: '3.4%',
         cursor: 'pointer',
       }}

src/pages/ValidatorOnboarding/KeyGeneration/KeystoreFiles/KeystoreFiles.tsx

@@ -58,11 +58,8 @@ const KeystoreFiles = () => {
 
   return (
     <YStack space={'$4'}>
-      <StackComponent
-        space={'$2'}
-        style={{ justifyContent: 'space-between', width: '100%' }}
-      >
-        <YStack space={'$4'} style={{ width: '66%' }}>
+      <StackComponent space={'$2'} style={{ justifyContent: 'space-between', width: '100%' }}>
+        <YStack space={'$4'} style={{ width: media.sm ? '100%' : '66%' }}>
           <YStack space={'$4'}>
             <Text size={15} color={'#647084'}>
               Encryption Password
@@ -102,7 +99,9 @@ const KeystoreFiles = () => {
             />
           </YStack>
         </YStack>
-        <KeystoreBackupsCard />
+        <div style={{ width: media.sm ? '100%' : '32%', paddingTop: media.sm ? 0 : '1.2%' }}>
+          <KeystoreBackupsCard />
+        </div>
       </StackComponent>
       <Stack style={{ width: 'fit-content' }}>
         <Button onPress={generateKeystoreFilesHandler}>Generate Key files</Button>