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

Merge pull request #1132 from bluesky-social/eric/fix-reply-line 

fix long thread styling
zio/stable
Eric Bailey 2023-08-08 10:21:21 -05:00 committed by GitHub
parent 7bbaccad1c 85b4de701b
commit f7a0ea3e13
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 16 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
src/view/com/posts/FeedSlice.tsx
View File

@ -44,6 +44,7 @@ export const FeedSlice = observer(
item={slice.items[last]} item={slice.items[last]}
isThreadParent={slice.isThreadParentAt(last)} isThreadParent={slice.isThreadParentAt(last)}
isThreadChild={slice.isThreadChildAt(last)} isThreadChild={slice.isThreadChildAt(last)}
isThreadLastChild
/> />
</> </>
) )
@ -75,23 +76,28 @@ function ViewFullThread({slice}: {slice: PostsFeedSliceModel}) {
}, [slice.rootItem.post.uri, slice.rootItem.post.author]) }, [slice.rootItem.post.uri, slice.rootItem.post.author])
return ( return (
<Link style={[pal.view, styles.viewFullThread]} href={itemHref} noFeedback> <Link
style={[pal.view, styles.viewFullThread]}
href={itemHref}
asAnchor
noFeedback>
<View style={styles.viewFullThreadDots}> <View style={styles.viewFullThreadDots}>
<Svg width="4" height="30"> <Svg width="4" height="40">
<Line <Line
x1="2" x1="2"
y1="0" y1="0"
x2="2" x2="2"
y2="8" y2="15"
stroke={pal.colors.replyLine} stroke={pal.colors.replyLine}
strokeWidth="2" strokeWidth="2"
/> />
<Circle cx="2" cy="16" r="1.5" fill={pal.colors.replyLineDot} />
<Circle cx="2" cy="22" r="1.5" fill={pal.colors.replyLineDot} /> <Circle cx="2" cy="22" r="1.5" fill={pal.colors.replyLineDot} />
<Circle cx="2" cy="28" r="1.5" fill={pal.colors.replyLineDot} /> <Circle cx="2" cy="28" r="1.5" fill={pal.colors.replyLineDot} />
<Circle cx="2" cy="34" r="1.5" fill={pal.colors.replyLineDot} />
</Svg> </Svg>
</View> </View>
<Text type="md" style={pal.link}>
<Text type="md" style={[pal.link, {paddingTop: 18, paddingBottom: 4}]}>
View full thread View full thread
</Text> </Text>
</Link> </Link>
@ -100,13 +106,12 @@ function ViewFullThread({slice}: {slice: PostsFeedSliceModel}) {
const styles = StyleSheet.create({ const styles = StyleSheet.create({
viewFullThread: { viewFullThread: {
paddingTop: 14, flexDirection: 'row',
paddingBottom: 6, gap: 10,
paddingLeft: 80, paddingLeft: 18,
}, },
viewFullThreadDots: { viewFullThreadDots: {
position: 'absolute', width: 52,
left: 41, alignItems: 'center',
top: 0,
}, },
}) })