Fix weird button wrapping on splash (#5507)

* Fix weird button wrapping on splash * Web
bluesky-social · Sep 26, 2024 · 175df72 · 175df72
1 parent 863764b
commit 175df72
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 10 deletions.
diff --git a/src/view/com/auth/SplashScreen.tsx b/src/view/com/auth/SplashScreen.tsx
@@ -39,21 +39,21 @@ export const SplashScreen = ({
             <Trans>What's up?</Trans>
           </Text>
         </View>
-        <View testID="signinOrCreateAccount">
+        <View
+          testID="signinOrCreateAccount"
+          style={[a.px_xl, a.gap_md, a.pb_2xl]}>
           <Button
             testID="createAccountButton"
             onPress={onPressCreateAccount}
-            accessibilityRole="button"
             label={_(msg`Create new account`)}
             accessibilityHint={_(
               msg`Opens flow to create a new Bluesky account`,
             )}
-            style={[a.mx_xl, a.mb_xl]}
             size="large"
             variant="solid"
             color="primary">
             <ButtonText>
-              <Trans>Create a new account</Trans>
+              <Trans>Create account</Trans>
             </ButtonText>
           </Button>
           <Button
@@ -63,7 +63,6 @@ export const SplashScreen = ({
             accessibilityHint={_(
               msg`Opens flow to sign into your existing Bluesky account`,
             )}
-            style={[a.mx_xl, a.mb_xl]}
             size="large"
             variant="solid"
             color="secondary">

diff --git a/src/view/com/auth/SplashScreen.web.tsx b/src/view/com/auth/SplashScreen.web.tsx
@@ -85,21 +85,19 @@ export const SplashScreen = ({
 
             <View
               testID="signinOrCreateAccount"
-              style={[a.w_full, {maxWidth: 320}]}>
+              style={[a.w_full, a.px_xl, a.gap_md, a.pb_2xl, {maxWidth: 320}]}>
               <Button
                 testID="createAccountButton"
                 onPress={onPressCreateAccount}
-                accessibilityRole="button"
                 label={_(msg`Create new account`)}
                 accessibilityHint={_(
                   msg`Opens flow to create a new Bluesky account`,
                 )}
-                style={[a.mx_xl, a.mb_xl]}
                 size="large"
                 variant="solid"
                 color="primary">
                 <ButtonText>
-                  <Trans>Create a new account</Trans>
+                  <Trans>Create account</Trans>
                 </ButtonText>
               </Button>
               <Button
@@ -109,7 +107,6 @@ export const SplashScreen = ({
                 accessibilityHint={_(
                   msg`Opens flow to sign into your existing Bluesky account`,
                 )}
-                style={[a.mx_xl, a.mb_xl]}
                 size="large"
                 variant="solid"
                 color="secondary">