fix: Remove Stack component from body

src/components/app-icon/index.tsx

@@ -1,17 +1,17 @@
 import React from 'react';
 import { Box, BoxProps } from '@blockstack/ui';
-import { Image } from '@components/image';
 import { useSelector } from 'react-redux';
+
+import { Image } from '@components/image';
 import { AppState } from '@store';
 import { selectAppName, selectAppIcon } from '@store/onboarding/selectors';
 
-const AppIcon = (props: BoxProps) => {
+export const AppIcon = ({ ...rest }: BoxProps) => {
   const appIcon = useSelector((state: AppState) => selectAppIcon(state));
   const appName = useSelector((state: AppState) => selectAppName(state));
   return (
-    <Box size={['48px', '78px']} mx="auto" {...props}>
+    <Box size={['48px', '78px']} mx="auto" {...rest}>
       <Image src={appIcon} alt={appName} />
     </Box>
   );
 };
-export { AppIcon };

src/components/onboarding/screens/sign-in.tsx

@@ -26,14 +26,15 @@ export const SignIn: React.FC<SignInProps> = props => {
   const appName = useSelector((state: AppState) => selectAppName(state));
 
   return (
-    <Screen isLoading={isLoading} textAlign="center">
-      <ScreenHeader title="Continue with Data Vault" />
-      <AppIcon size={72} mt={6} />
+    <Screen isLoading={isLoading} spacing={0} textAlign="center">
+      <ScreenHeader title="Continue with Data Vault" hideIcon />
+      <AppIcon mt={10} />
       <ScreenBody
         title={`Sign into ${appName}`}
+        mt={4}
         body={[
-          'Enter your Data Vault’s Secret Key to continue',
-          <Box textAlign="left">
+          <Box mt={2}>Enter your Data Vault’s Secret Key to continue</Box>,
+          <Box textAlign="left" mt={6}>
             {/*Validate: track SIGN_IN_INCORRECT*/}
             <Input
               autoFocus