Fix width handling for deactivated screen (#5810)
This commit is contained in:
@@ -67,6 +67,7 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex: 1 0 auto;
|
flex: 1 0 auto;
|
||||||
min-height: 100%;
|
min-height: 100%;
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
#splash {
|
#splash {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
|
|||||||
+110
-117
@@ -106,124 +106,117 @@ export function Deactivated() {
|
|||||||
return (
|
return (
|
||||||
<View style={[a.util_screen_outer, a.flex_1, t.atoms.bg]}>
|
<View style={[a.util_screen_outer, a.flex_1, t.atoms.bg]}>
|
||||||
<ScrollView
|
<ScrollView
|
||||||
style={[a.h_full, a.w_full]}
|
style={[
|
||||||
contentContainerStyle={{borderWidth: 0}}>
|
a.h_full,
|
||||||
<View
|
a.w_full,
|
||||||
style={[
|
a.px_2xl,
|
||||||
a.px_2xl,
|
{
|
||||||
{
|
paddingTop: isWeb ? 64 : insets.top + 16,
|
||||||
paddingTop: isWeb ? 64 : insets.top + 16,
|
paddingBottom: isWeb ? 64 : insets.bottom,
|
||||||
paddingBottom: isWeb ? 64 : insets.bottom,
|
},
|
||||||
},
|
]}
|
||||||
]}>
|
contentContainerStyle={[
|
||||||
<View style={[a.flex_row, a.justify_center]}>
|
a.w_full,
|
||||||
<View style={[a.w_full, {maxWidth: COL_WIDTH}]}>
|
a.flex_row,
|
||||||
<View
|
a.justify_center,
|
||||||
style={[a.w_full, a.justify_center, a.align_center, a.pb_5xl]}>
|
{borderWidth: 0},
|
||||||
<Logo width={40} />
|
]}>
|
||||||
</View>
|
<View style={[a.w_full, {maxWidth: COL_WIDTH}]}>
|
||||||
|
<View style={[a.w_full, a.justify_center, a.align_center, a.pb_5xl]}>
|
||||||
<View style={[a.gap_xs, a.pb_3xl]}>
|
<Logo width={40} />
|
||||||
<Text style={[a.text_xl, a.font_bold, a.leading_snug]}>
|
|
||||||
<Trans>Welcome back!</Trans>
|
|
||||||
</Text>
|
|
||||||
<Text style={[a.text_sm, a.leading_snug]}>
|
|
||||||
<Trans>
|
|
||||||
You previously deactivated @{currentAccount?.handle}.
|
|
||||||
</Trans>
|
|
||||||
</Text>
|
|
||||||
<Text style={[a.text_sm, a.leading_snug, a.pb_md]}>
|
|
||||||
<Trans>
|
|
||||||
You can reactivate your account to continue logging in. Your
|
|
||||||
profile and posts will be visible to other users.
|
|
||||||
</Trans>
|
|
||||||
</Text>
|
|
||||||
|
|
||||||
<View style={[a.gap_sm]}>
|
|
||||||
<Button
|
|
||||||
label={_(msg`Reactivate your account`)}
|
|
||||||
size="large"
|
|
||||||
variant="solid"
|
|
||||||
color="primary"
|
|
||||||
onPress={handleActivate}>
|
|
||||||
<ButtonText>
|
|
||||||
<Trans>Yes, reactivate my account</Trans>
|
|
||||||
</ButtonText>
|
|
||||||
{pending && <ButtonIcon icon={Loader} position="right" />}
|
|
||||||
</Button>
|
|
||||||
<Button
|
|
||||||
label={_(msg`Cancel reactivation and log out`)}
|
|
||||||
size="large"
|
|
||||||
variant="solid"
|
|
||||||
color="secondary"
|
|
||||||
onPress={onPressLogout}>
|
|
||||||
<ButtonText>
|
|
||||||
<Trans>Cancel</Trans>
|
|
||||||
</ButtonText>
|
|
||||||
</Button>
|
|
||||||
</View>
|
|
||||||
|
|
||||||
{error && (
|
|
||||||
<View
|
|
||||||
style={[
|
|
||||||
a.flex_row,
|
|
||||||
a.gap_sm,
|
|
||||||
a.mt_md,
|
|
||||||
a.p_md,
|
|
||||||
a.rounded_sm,
|
|
||||||
t.atoms.bg_contrast_25,
|
|
||||||
]}>
|
|
||||||
<CircleInfo size="md" fill={t.palette.negative_400} />
|
|
||||||
<Text style={[a.flex_1, a.leading_snug]}>{error}</Text>
|
|
||||||
</View>
|
|
||||||
)}
|
|
||||||
</View>
|
|
||||||
|
|
||||||
<View style={[a.pb_3xl]}>
|
|
||||||
<Divider />
|
|
||||||
</View>
|
|
||||||
|
|
||||||
{hasOtherAccounts ? (
|
|
||||||
<>
|
|
||||||
<Text
|
|
||||||
style={[
|
|
||||||
t.atoms.text_contrast_medium,
|
|
||||||
a.pb_md,
|
|
||||||
a.leading_snug,
|
|
||||||
]}>
|
|
||||||
<Trans>Or, log into one of your other accounts.</Trans>
|
|
||||||
</Text>
|
|
||||||
<AccountList
|
|
||||||
onSelectAccount={onSelectAccount}
|
|
||||||
onSelectOther={onPressAddAccount}
|
|
||||||
otherLabel={_(msg`Add account`)}
|
|
||||||
pendingDid={pendingDid}
|
|
||||||
/>
|
|
||||||
</>
|
|
||||||
) : (
|
|
||||||
<>
|
|
||||||
<Text
|
|
||||||
style={[
|
|
||||||
t.atoms.text_contrast_medium,
|
|
||||||
a.pb_md,
|
|
||||||
a.leading_snug,
|
|
||||||
]}>
|
|
||||||
<Trans>Or, continue with another account.</Trans>
|
|
||||||
</Text>
|
|
||||||
<Button
|
|
||||||
label={_(msg`Log in or sign up`)}
|
|
||||||
size="large"
|
|
||||||
variant="solid"
|
|
||||||
color="secondary"
|
|
||||||
onPress={() => setShowLoggedOut(true)}>
|
|
||||||
<ButtonText>
|
|
||||||
<Trans>Log in or sign up</Trans>
|
|
||||||
</ButtonText>
|
|
||||||
</Button>
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</View>
|
|
||||||
</View>
|
</View>
|
||||||
|
|
||||||
|
<View style={[a.gap_xs, a.pb_3xl]}>
|
||||||
|
<Text style={[a.text_xl, a.font_bold, a.leading_snug]}>
|
||||||
|
<Trans>Welcome back!</Trans>
|
||||||
|
</Text>
|
||||||
|
<Text style={[a.text_sm, a.leading_snug]}>
|
||||||
|
<Trans>
|
||||||
|
You previously deactivated @{currentAccount?.handle}.
|
||||||
|
</Trans>
|
||||||
|
</Text>
|
||||||
|
<Text style={[a.text_sm, a.leading_snug, a.pb_md]}>
|
||||||
|
<Trans>
|
||||||
|
You can reactivate your account to continue logging in. Your
|
||||||
|
profile and posts will be visible to other users.
|
||||||
|
</Trans>
|
||||||
|
</Text>
|
||||||
|
|
||||||
|
<View style={[a.gap_sm]}>
|
||||||
|
<Button
|
||||||
|
label={_(msg`Reactivate your account`)}
|
||||||
|
size="large"
|
||||||
|
variant="solid"
|
||||||
|
color="primary"
|
||||||
|
onPress={handleActivate}>
|
||||||
|
<ButtonText>
|
||||||
|
<Trans>Yes, reactivate my account</Trans>
|
||||||
|
</ButtonText>
|
||||||
|
{pending && <ButtonIcon icon={Loader} position="right" />}
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
label={_(msg`Cancel reactivation and log out`)}
|
||||||
|
size="large"
|
||||||
|
variant="solid"
|
||||||
|
color="secondary"
|
||||||
|
onPress={onPressLogout}>
|
||||||
|
<ButtonText>
|
||||||
|
<Trans>Cancel</Trans>
|
||||||
|
</ButtonText>
|
||||||
|
</Button>
|
||||||
|
</View>
|
||||||
|
|
||||||
|
{error && (
|
||||||
|
<View
|
||||||
|
style={[
|
||||||
|
a.flex_row,
|
||||||
|
a.gap_sm,
|
||||||
|
a.mt_md,
|
||||||
|
a.p_md,
|
||||||
|
a.rounded_sm,
|
||||||
|
t.atoms.bg_contrast_25,
|
||||||
|
]}>
|
||||||
|
<CircleInfo size="md" fill={t.palette.negative_400} />
|
||||||
|
<Text style={[a.flex_1, a.leading_snug]}>{error}</Text>
|
||||||
|
</View>
|
||||||
|
)}
|
||||||
|
</View>
|
||||||
|
|
||||||
|
<View style={[a.pb_3xl]}>
|
||||||
|
<Divider />
|
||||||
|
</View>
|
||||||
|
|
||||||
|
{hasOtherAccounts ? (
|
||||||
|
<>
|
||||||
|
<Text
|
||||||
|
style={[t.atoms.text_contrast_medium, a.pb_md, a.leading_snug]}>
|
||||||
|
<Trans>Or, log into one of your other accounts.</Trans>
|
||||||
|
</Text>
|
||||||
|
<AccountList
|
||||||
|
onSelectAccount={onSelectAccount}
|
||||||
|
onSelectOther={onPressAddAccount}
|
||||||
|
otherLabel={_(msg`Add account`)}
|
||||||
|
pendingDid={pendingDid}
|
||||||
|
/>
|
||||||
|
</>
|
||||||
|
) : (
|
||||||
|
<>
|
||||||
|
<Text
|
||||||
|
style={[t.atoms.text_contrast_medium, a.pb_md, a.leading_snug]}>
|
||||||
|
<Trans>Or, continue with another account.</Trans>
|
||||||
|
</Text>
|
||||||
|
<Button
|
||||||
|
label={_(msg`Log in or sign up`)}
|
||||||
|
size="large"
|
||||||
|
variant="solid"
|
||||||
|
color="secondary"
|
||||||
|
onPress={() => setShowLoggedOut(true)}>
|
||||||
|
<ButtonText>
|
||||||
|
<Trans>Log in or sign up</Trans>
|
||||||
|
</ButtonText>
|
||||||
|
</Button>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
</View>
|
</View>
|
||||||
</ScrollView>
|
</ScrollView>
|
||||||
</View>
|
</View>
|
||||||
|
|||||||
@@ -72,6 +72,7 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex: 1 0 auto;
|
flex: 1 0 auto;
|
||||||
min-height: 100%;
|
min-height: 100%;
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
#splash {
|
#splash {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
|
|||||||
Reference in New Issue
Block a user