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

More spacing and sizing tweaks, including larger post controls

zio/stable
Paul Frazee 2023-01-16 16:54:35 -06:00
parent 1a69235cf0
commit 158945bbf6
2 changed files with 15 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/view/com/posts/FeedItem.tsx
View File

@ -142,9 +142,14 @@ export const FeedItem = observer(function ({
}> }>
<FontAwesomeIcon <FontAwesomeIcon
icon="retweet" icon="retweet"
style={[styles.includeReasonIcon, s.gray4]} style={[styles.includeReasonIcon, s.gray5]}
/> />
<Text type="body2" style={{color: pal.colors.textLight}}> <Text
type="body2"
style={{
fontWeight: '600',
color: pal.colors.textLight,
}}>
Reposted by{' '} Reposted by{' '}
{item.reasonRepost.by.displayName || item.reasonRepost.by.handle} {item.reasonRepost.by.displayName || item.reasonRepost.by.handle}
</Text> </Text>
@ -283,7 +288,6 @@ const styles = StyleSheet.create({
}, },
outerSmallTop: { outerSmallTop: {
borderTopWidth: 0, borderTopWidth: 0,
paddingTop: 8,
}, },
outerNoBottom: { outerNoBottom: {
paddingBottom: 2, paddingBottom: 2,
@ -305,6 +309,7 @@ const styles = StyleSheet.create({
includeReason: { includeReason: {
flexDirection: 'row', flexDirection: 'row',
paddingLeft: 40, paddingLeft: 40,
marginTop: 2,
marginBottom: 2, marginBottom: 2,
}, },
includeReasonIcon: { includeReasonIcon: {
@ -312,6 +317,7 @@ const styles = StyleSheet.create({
}, },
layout: { layout: {
flexDirection: 'row', flexDirection: 'row',
marginTop: 1,
}, },
layoutAvi: { layoutAvi: {
width: 60, width: 60,
@ -338,7 +344,7 @@ const styles = StyleSheet.create({
marginBottom: 6, marginBottom: 6,
}, },
ctrls: { ctrls: {
marginTop: 2, marginTop: 4,
}, },
viewFullThread: { viewFullThread: {
paddingTop: 12, paddingTop: 12,

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

@ -35,7 +35,7 @@ interface PostCtrlsOpts {
const redgray = '#7A6161' const redgray = '#7A6161'
const sRedgray = {color: redgray} const sRedgray = {color: redgray}
const HITSLOP = {top: 5, left: 5, bottom: 5, right: 5} const HITSLOP = {top: 2, left: 2, bottom: 2, right: 2}
export function PostCtrls(opts: PostCtrlsOpts) { export function PostCtrls(opts: PostCtrlsOpts) {
const interp1 = useAnimatedValue(0) const interp1 = useAnimatedValue(0)
@ -137,7 +137,7 @@ export function PostCtrls(opts: PostCtrlsOpts) {
opts.isReposted ? styles.ctrlIconReposted : styles.ctrlIcon opts.isReposted ? styles.ctrlIconReposted : styles.ctrlIcon
} }
icon="retweet" icon="retweet"
size={opts.big ? 22 : 17} size={opts.big ? 22 : 19}
/> />
</Animated.View> </Animated.View>
{typeof opts.repostCount !== 'undefined' ? ( {typeof opts.repostCount !== 'undefined' ? (
@ -161,12 +161,12 @@ export function PostCtrls(opts: PostCtrlsOpts) {
{opts.isUpvoted ? ( {opts.isUpvoted ? (
<UpIconSolid <UpIconSolid
style={[styles.ctrlIconUpvoted]} style={[styles.ctrlIconUpvoted]}
size={opts.big ? 22 : 17} size={opts.big ? 22 : 19}
/> />
) : ( ) : (
<UpIcon <UpIcon
style={[styles.ctrlIcon]} style={[styles.ctrlIcon]}
size={opts.big ? 22 : 17} size={opts.big ? 22 : 19}
strokeWidth={1.5} strokeWidth={1.5}
/> />
)} )}
@ -194,7 +194,7 @@ export function PostCtrls(opts: PostCtrlsOpts) {
onDeletePost={opts.onDeletePost}> onDeletePost={opts.onDeletePost}>
<FontAwesomeIcon <FontAwesomeIcon
icon="ellipsis-h" icon="ellipsis-h"
size={16} size={18}
style={[s.mt2, s.mr5, {color: colors.gray3}]} style={[s.mt2, s.mr5, {color: colors.gray3}]}
/> />
</PostDropdownBtn> </PostDropdownBtn>