zio
/
bsky-app
2
0
Fork 0
Code Pull Requests Packages Releases Activity

Fix click targets for post controls (#332) (#363) 

* Fix click targets for post controls (#332)

* Add padding to the right side of the post controls

---------

Co-authored-by: Paul Frazee <pfrazee@gmail.com>
zio/stable
John Fawcett 2023-04-03 12:32:35 -05:00 committed by GitHub
parent 180e373b6f
commit 9652d994dd
1 changed files with 9 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/view/com/util/PostCtrls.tsx
View File

@ -184,7 +184,7 @@ export function PostCtrls(opts: PostCtrlsOpts) {
return ( return (
<View style={[styles.ctrls, opts.style]}> <View style={[styles.ctrls, opts.style]}>
<View style={s.flex1}> <View>
<TouchableOpacity <TouchableOpacity
testID="replyBtn" testID="replyBtn"
style={styles.ctrl} style={styles.ctrl}
@ -202,7 +202,7 @@ export function PostCtrls(opts: PostCtrlsOpts) {
) : undefined} ) : undefined}
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<View style={s.flex1}> <View>
<TouchableOpacity <TouchableOpacity
testID="repostBtn" testID="repostBtn"
hitSlop={HITSLOP} hitSlop={HITSLOP}
@ -243,7 +243,7 @@ export function PostCtrls(opts: PostCtrlsOpts) {
) : undefined} ) : undefined}
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<View style={s.flex1}> <View>
<TouchableOpacity <TouchableOpacity
testID="likeBtn" testID="likeBtn"
style={styles.ctrl} style={styles.ctrl}
@ -293,7 +293,7 @@ export function PostCtrls(opts: PostCtrlsOpts) {
) : undefined} ) : undefined}
</TouchableOpacity> </TouchableOpacity>
</View> </View>
<View style={s.flex1}> <View>
{opts.big ? undefined : ( {opts.big ? undefined : (
<PostDropdownBtn <PostDropdownBtn
testID="postDropdownBtn" testID="postDropdownBtn"
@ -321,6 +321,8 @@ export function PostCtrls(opts: PostCtrlsOpts) {
</PostDropdownBtn> </PostDropdownBtn>
)} )}
</View> </View>
{/* used for adding pad to the right side */}
<View />
</View> </View>
) )
} }
@ -328,10 +330,13 @@ export function PostCtrls(opts: PostCtrlsOpts) {
const styles = StyleSheet.create({ const styles = StyleSheet.create({
ctrls: { ctrls: {
flexDirection: 'row', flexDirection: 'row',
justifyContent: 'space-between',
}, },
ctrl: { ctrl: {
flexDirection: 'row', flexDirection: 'row',
alignItems: 'center', alignItems: 'center',
padding: 5,
margin: -5,
}, },
ctrlIconReposted: { ctrlIconReposted: {
color: colors.green3, color: colors.green3,