my fork of the bluesky client

Fix width handling for deactivated screen (#5810)

authored by Eric Bailey and committed by GitHub 6f4703e8 9a82d20b

Changed files
+107 -112
bskyweb
templates
src
screens
web
+1
bskyweb/templates/base.html
··· 67 display: flex; 68 flex: 1 0 auto; 69 min-height: 100%; 70 } 71 #splash { 72 position: fixed;
··· 67 display: flex; 68 flex: 1 0 auto; 69 min-height: 100%; 70 + width: 100%; 71 } 72 #splash { 73 position: fixed;
+105 -112
src/screens/Deactivated.tsx
··· 106 return ( 107 <View style={[a.util_screen_outer, a.flex_1, t.atoms.bg]}> 108 <ScrollView 109 - style={[a.h_full, a.w_full]} 110 - contentContainerStyle={{borderWidth: 0}}> 111 - <View 112 - style={[ 113 - a.px_2xl, 114 - { 115 - paddingTop: isWeb ? 64 : insets.top + 16, 116 - paddingBottom: isWeb ? 64 : insets.bottom, 117 - }, 118 - ]}> 119 - <View style={[a.flex_row, a.justify_center]}> 120 - <View style={[a.w_full, {maxWidth: COL_WIDTH}]}> 121 - <View 122 - style={[a.w_full, a.justify_center, a.align_center, a.pb_5xl]}> 123 - <Logo width={40} /> 124 - </View> 125 126 - <View style={[a.gap_xs, a.pb_3xl]}> 127 - <Text style={[a.text_xl, a.font_bold, a.leading_snug]}> 128 - <Trans>Welcome back!</Trans> 129 - </Text> 130 - <Text style={[a.text_sm, a.leading_snug]}> 131 - <Trans> 132 - You previously deactivated @{currentAccount?.handle}. 133 - </Trans> 134 - </Text> 135 - <Text style={[a.text_sm, a.leading_snug, a.pb_md]}> 136 - <Trans> 137 - You can reactivate your account to continue logging in. Your 138 - profile and posts will be visible to other users. 139 - </Trans> 140 - </Text> 141 142 - <View style={[a.gap_sm]}> 143 - <Button 144 - label={_(msg`Reactivate your account`)} 145 - size="large" 146 - variant="solid" 147 - color="primary" 148 - onPress={handleActivate}> 149 - <ButtonText> 150 - <Trans>Yes, reactivate my account</Trans> 151 - </ButtonText> 152 - {pending && <ButtonIcon icon={Loader} position="right" />} 153 - </Button> 154 - <Button 155 - label={_(msg`Cancel reactivation and log out`)} 156 - size="large" 157 - variant="solid" 158 - color="secondary" 159 - onPress={onPressLogout}> 160 - <ButtonText> 161 - <Trans>Cancel</Trans> 162 - </ButtonText> 163 - </Button> 164 - </View> 165 166 - {error && ( 167 - <View 168 - style={[ 169 - a.flex_row, 170 - a.gap_sm, 171 - a.mt_md, 172 - a.p_md, 173 - a.rounded_sm, 174 - t.atoms.bg_contrast_25, 175 - ]}> 176 - <CircleInfo size="md" fill={t.palette.negative_400} /> 177 - <Text style={[a.flex_1, a.leading_snug]}>{error}</Text> 178 - </View> 179 - )} 180 - </View> 181 - 182 - <View style={[a.pb_3xl]}> 183 - <Divider /> 184 </View> 185 186 - {hasOtherAccounts ? ( 187 - <> 188 - <Text 189 - style={[ 190 - t.atoms.text_contrast_medium, 191 - a.pb_md, 192 - a.leading_snug, 193 - ]}> 194 - <Trans>Or, log into one of your other accounts.</Trans> 195 - </Text> 196 - <AccountList 197 - onSelectAccount={onSelectAccount} 198 - onSelectOther={onPressAddAccount} 199 - otherLabel={_(msg`Add account`)} 200 - pendingDid={pendingDid} 201 - /> 202 - </> 203 - ) : ( 204 - <> 205 - <Text 206 - style={[ 207 - t.atoms.text_contrast_medium, 208 - a.pb_md, 209 - a.leading_snug, 210 - ]}> 211 - <Trans>Or, continue with another account.</Trans> 212 - </Text> 213 - <Button 214 - label={_(msg`Log in or sign up`)} 215 - size="large" 216 - variant="solid" 217 - color="secondary" 218 - onPress={() => setShowLoggedOut(true)}> 219 - <ButtonText> 220 - <Trans>Log in or sign up</Trans> 221 - </ButtonText> 222 - </Button> 223 - </> 224 - )} 225 - </View> 226 </View> 227 </View> 228 </ScrollView> 229 </View>
··· 106 return ( 107 <View style={[a.util_screen_outer, a.flex_1, t.atoms.bg]}> 108 <ScrollView 109 + style={[ 110 + a.h_full, 111 + a.w_full, 112 + a.px_2xl, 113 + { 114 + paddingTop: isWeb ? 64 : insets.top + 16, 115 + paddingBottom: isWeb ? 64 : insets.bottom, 116 + }, 117 + ]} 118 + contentContainerStyle={[ 119 + a.w_full, 120 + a.flex_row, 121 + a.justify_center, 122 + {borderWidth: 0}, 123 + ]}> 124 + <View style={[a.w_full, {maxWidth: COL_WIDTH}]}> 125 + <View style={[a.w_full, a.justify_center, a.align_center, a.pb_5xl]}> 126 + <Logo width={40} /> 127 + </View> 128 129 + <View style={[a.gap_xs, a.pb_3xl]}> 130 + <Text style={[a.text_xl, a.font_bold, a.leading_snug]}> 131 + <Trans>Welcome back!</Trans> 132 + </Text> 133 + <Text style={[a.text_sm, a.leading_snug]}> 134 + <Trans> 135 + You previously deactivated @{currentAccount?.handle}. 136 + </Trans> 137 + </Text> 138 + <Text style={[a.text_sm, a.leading_snug, a.pb_md]}> 139 + <Trans> 140 + You can reactivate your account to continue logging in. Your 141 + profile and posts will be visible to other users. 142 + </Trans> 143 + </Text> 144 145 + <View style={[a.gap_sm]}> 146 + <Button 147 + label={_(msg`Reactivate your account`)} 148 + size="large" 149 + variant="solid" 150 + color="primary" 151 + onPress={handleActivate}> 152 + <ButtonText> 153 + <Trans>Yes, reactivate my account</Trans> 154 + </ButtonText> 155 + {pending && <ButtonIcon icon={Loader} position="right" />} 156 + </Button> 157 + <Button 158 + label={_(msg`Cancel reactivation and log out`)} 159 + size="large" 160 + variant="solid" 161 + color="secondary" 162 + onPress={onPressLogout}> 163 + <ButtonText> 164 + <Trans>Cancel</Trans> 165 + </ButtonText> 166 + </Button> 167 + </View> 168 169 + {error && ( 170 + <View 171 + style={[ 172 + a.flex_row, 173 + a.gap_sm, 174 + a.mt_md, 175 + a.p_md, 176 + a.rounded_sm, 177 + t.atoms.bg_contrast_25, 178 + ]}> 179 + <CircleInfo size="md" fill={t.palette.negative_400} /> 180 + <Text style={[a.flex_1, a.leading_snug]}>{error}</Text> 181 </View> 182 + )} 183 + </View> 184 185 + <View style={[a.pb_3xl]}> 186 + <Divider /> 187 </View> 188 + 189 + {hasOtherAccounts ? ( 190 + <> 191 + <Text 192 + style={[t.atoms.text_contrast_medium, a.pb_md, a.leading_snug]}> 193 + <Trans>Or, log into one of your other accounts.</Trans> 194 + </Text> 195 + <AccountList 196 + onSelectAccount={onSelectAccount} 197 + onSelectOther={onPressAddAccount} 198 + otherLabel={_(msg`Add account`)} 199 + pendingDid={pendingDid} 200 + /> 201 + </> 202 + ) : ( 203 + <> 204 + <Text 205 + style={[t.atoms.text_contrast_medium, a.pb_md, a.leading_snug]}> 206 + <Trans>Or, continue with another account.</Trans> 207 + </Text> 208 + <Button 209 + label={_(msg`Log in or sign up`)} 210 + size="large" 211 + variant="solid" 212 + color="secondary" 213 + onPress={() => setShowLoggedOut(true)}> 214 + <ButtonText> 215 + <Trans>Log in or sign up</Trans> 216 + </ButtonText> 217 + </Button> 218 + </> 219 + )} 220 </View> 221 </ScrollView> 222 </View>
+1
web/index.html
··· 72 display: flex; 73 flex: 1 0 auto; 74 min-height: 100%; 75 } 76 #splash { 77 position: fixed;
··· 72 display: flex; 73 flex: 1 0 auto; 74 min-height: 100%; 75 + width: 100%; 76 } 77 #splash { 78 position: fixed;