initial android fixes · bwc9876.dev/witchsky.app@70f4deb

+5 -2

src/view/com/composer/ComposePost.tsx

··· 3 3 import { 4 4 ActivityIndicator, 5 5 KeyboardAvoidingView, 6 + Platform, 6 7 SafeAreaView, 7 8 ScrollView, 8 9 StyleSheet, ··· 175 176 }, [text]) 176 177 177 178 return ( 178 - <KeyboardAvoidingView behavior="padding" style={styles.outer}> 179 + <KeyboardAvoidingView 180 + behavior={Platform.OS === 'ios' ? 'padding' : 'height'} 181 + style={styles.outer}> 179 182 <SafeAreaView style={s.flex1}> 180 183 <View style={styles.topbar}> 181 184 <TouchableOpacity onPress={onPressCancel}> ··· 345 348 topbar: { 346 349 flexDirection: 'row', 347 350 alignItems: 'center', 348 - paddingTop: 10, 349 351 paddingBottom: 10, 350 352 paddingHorizontal: 5, 351 353 height: 55, ··· 398 400 padding: 5, 399 401 fontSize: 18, 400 402 marginLeft: 8, 403 + alignSelf: 'flex-start', 401 404 }, 402 405 replyToLayout: { 403 406 flexDirection: 'row',

+13 -2

src/view/com/modals/ServerInput.tsx

··· 1 1 import React, {useState} from 'react' 2 - import {StyleSheet, Text, TextInput, TouchableOpacity, View} from 'react-native' 2 + import {Platform, StyleSheet, Text, TouchableOpacity, View} from 'react-native' 3 3 import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' 4 4 import {BottomSheetScrollView, BottomSheetTextInput} from '@gorhom/bottom-sheet' 5 5 import {useStores} from '../../../state' ··· 76 76 onPress={() => doSelect(customUrl)}> 77 77 <FontAwesomeIcon 78 78 icon="check" 79 - style={[s.black, {position: 'relative', top: 2}]} 79 + style={[s.black, styles.checkIcon]} 80 80 size={18} 81 81 /> 82 82 </TouchableOpacity> ··· 132 132 fontSize: 18, 133 133 fontWeight: '500', 134 134 color: colors.white, 135 + }, 136 + checkIcon: { 137 + position: 'relative', 138 + ...Platform.select({ 139 + android: { 140 + top: 8, 141 + }, 142 + ios: { 143 + top: 2, 144 + }, 145 + }), 135 146 }, 136 147 })

+1

src/view/com/posts/FeedItem.tsx

··· 331 331 fontFamily: 'System', 332 332 fontSize: 16, 333 333 lineHeight: 20.8, // 1.3 of 16px 334 + color: colors.black, 334 335 }, 335 336 postEmbeds: { 336 337 marginBottom: 10,

+7 -7

src/view/com/profile/ProfileHeader.tsx

··· 168 168 <TouchableOpacity 169 169 onPress={onPressEditProfile} 170 170 style={[styles.btn, styles.mainBtn]}> 171 - <Text style={[s.fw400, s.f14]}>Edit Profile</Text> 171 + <Text style={[s.fw400, s.f14, s.black]}>Edit Profile</Text> 172 172 </TouchableOpacity> 173 173 ) : ( 174 174 <> ··· 177 177 onPress={onPressToggleFollow} 178 178 style={[styles.btn, styles.mainBtn]}> 179 179 <FontAwesomeIcon icon="check" style={[s.mr5]} size={14} /> 180 - <Text style={[s.fw400, s.f14]}>Following</Text> 180 + <Text style={[s.fw400, s.f14, s.black]}>Following</Text> 181 181 </TouchableOpacity> 182 182 ) : ( 183 183 <TouchableOpacity onPress={onPressToggleFollow}> ··· 202 202 ) : undefined} 203 203 </View> 204 204 <View style={styles.displayNameLine}> 205 - <Text style={styles.displayName}> 205 + <Text style={[styles.displayName, s.black]}> 206 206 {view.displayName || view.handle} 207 207 </Text> 208 208 </View> ··· 218 218 <TouchableOpacity 219 219 style={[s.flexRow, s.mr10]} 220 220 onPress={onPressFollowers}> 221 - <Text style={[s.bold, s.mr2, styles.metricsText]}> 221 + <Text style={[s.bold, s.mr2, styles.metricsText, s.black]}> 222 222 {view.followersCount} 223 223 </Text> 224 224 <Text style={[s.gray5, styles.metricsText]}> ··· 229 229 <TouchableOpacity 230 230 style={[s.flexRow, s.mr10]} 231 231 onPress={onPressFollows}> 232 - <Text style={[s.bold, s.mr2, styles.metricsText]}> 232 + <Text style={[s.bold, s.mr2, styles.metricsText, s.black]}> 233 233 {view.followsCount} 234 234 </Text> 235 235 <Text style={[s.gray5, styles.metricsText]}>following</Text> ··· 239 239 <TouchableOpacity 240 240 style={[s.flexRow, s.mr10]} 241 241 onPress={onPressMembers}> 242 - <Text style={[s.bold, s.mr2, styles.metricsText]}> 242 + <Text style={[s.bold, s.mr2, styles.metricsText, s.black]}> 243 243 {view.membersCount} 244 244 </Text> 245 245 <Text style={[s.gray5, styles.metricsText]}> ··· 248 248 </TouchableOpacity> 249 249 ) : undefined} 250 250 <View style={[s.flexRow, s.mr10]}> 251 - <Text style={[s.bold, s.mr2, styles.metricsText]}> 251 + <Text style={[s.bold, s.mr2, styles.metricsText, s.black]}> 252 252 {view.postsCount} 253 253 </Text> 254 254 <Text style={[s.gray5, styles.metricsText]}>

+2 -2

src/view/com/util/PostMeta.tsx

··· 25 25 style={styles.metaItem} 26 26 href={opts.authorHref} 27 27 title={opts.authorHandle}> 28 - <Text style={[s.f17, s.bold]} numberOfLines={1}> 28 + <Text style={[s.f17, s.bold, s.black]} numberOfLines={1}> 29 29 {opts.authorDisplayName || opts.authorHandle} 30 - <Text style={[s.f15, s.gray5, s.normal]} numberOfLines={1}> 30 + <Text style={[s.f15, s.gray5, s.normal, s.black]} numberOfLines={1}> 31 31  {opts.authorHandle} 32 32 </Text> 33 33 </Text>

+3 -3

src/view/com/util/RichText.tsx

··· 28 28 fontSize: 26, 29 29 lineHeight: 30, 30 30 } 31 - return <Text style={style}>{text}</Text> 31 + return <Text style={[style]}>{text}</Text> 32 32 } 33 - return <Text style={style}>{text}</Text> 33 + return <Text style={[style]}>{text}</Text> 34 34 } 35 35 if (!style) style = [] 36 36 else if (!Array.isArray(style)) style = [style] ··· 65 65 key++ 66 66 } 67 67 return ( 68 - <Text style={style} numberOfLines={numberOfLines}> 68 + <Text style={[style]} numberOfLines={numberOfLines}> 69 69 {els} 70 70 </Text> 71 71 )

+6 -1

src/view/com/util/ViewHeader.tsx

··· 56 56 hitSlop={BACK_HITSLOP} 57 57 style={canGoBack ? styles.backIcon : styles.backIconWide}> 58 58 {canGoBack ? ( 59 - <FontAwesomeIcon size={18} icon="angle-left" style={{marginTop: 6}} /> 59 + <FontAwesomeIcon 60 + size={18} 61 + icon="angle-left" 62 + style={{marginTop: 6, color: colors.black}} 63 + /> 60 64 ) : ( 61 65 <UserAvatar 62 66 size={30} ··· 138 142 title: { 139 143 fontSize: 21, 140 144 fontWeight: '600', 145 + color: colors.black, 141 146 }, 142 147 subtitle: { 143 148 fontSize: 18,

+6 -2

src/view/shell/mobile/Composer.tsx

··· 1 1 import React, {useEffect} from 'react' 2 2 import {observer} from 'mobx-react-lite' 3 - import {Animated, Easing, StyleSheet, View} from 'react-native' 3 + import {Animated, Easing, Platform, StyleSheet, View} from 'react-native' 4 4 import {ComposePost} from '../../com/composer/ComposePost' 5 5 import {ComposerOpts} from '../../../state/models/shell-ui' 6 6 import {useAnimatedValue} from '../../lib/useAnimatedValue' ··· 69 69 bottom: 0, 70 70 width: '100%', 71 71 backgroundColor: '#fff', 72 - paddingTop: 24, 72 + ...Platform.select({ 73 + ios: { 74 + paddingTop: 24, 75 + }, 76 + }), 73 77 }, 74 78 })

Configure Feed

Configure Feed