Spacing fixes
parent
c659f0ef9f
commit
6d4431b777
|
@ -160,7 +160,7 @@ export const Post = observer(function Post({
|
||||||
timestamp={item.post.indexedAt}
|
timestamp={item.post.indexedAt}
|
||||||
/>
|
/>
|
||||||
{replyHref !== '' && (
|
{replyHref !== '' && (
|
||||||
<View style={[s.flexRow, s.mb2, {alignItems: 'center'}]}>
|
<View style={[s.flexRow, s.mb5, {alignItems: 'center'}]}>
|
||||||
<FontAwesomeIcon
|
<FontAwesomeIcon
|
||||||
icon="reply"
|
icon="reply"
|
||||||
size={9}
|
size={9}
|
||||||
|
|
|
@ -183,7 +183,7 @@ export const FeedItem = observer(function ({
|
||||||
timestamp={item.post.indexedAt}
|
timestamp={item.post.indexedAt}
|
||||||
/>
|
/>
|
||||||
{!isChild && replyHref !== '' && (
|
{!isChild && replyHref !== '' && (
|
||||||
<View style={[s.flexRow, s.mb2, {alignItems: 'center'}]}>
|
<View style={[s.flexRow, s.mb5, {alignItems: 'center'}]}>
|
||||||
<FontAwesomeIcon
|
<FontAwesomeIcon
|
||||||
icon="reply"
|
icon="reply"
|
||||||
size={9}
|
size={9}
|
||||||
|
@ -219,8 +219,9 @@ export const FeedItem = observer(function ({
|
||||||
) : (
|
) : (
|
||||||
<View style={{height: 5}} />
|
<View style={{height: 5}} />
|
||||||
)}
|
)}
|
||||||
<PostEmbeds embed={item.post.embed} style={styles.postEmbeds} />
|
<PostEmbeds embed={item.post.embed} style={styles.embed} />
|
||||||
<PostCtrls
|
<PostCtrls
|
||||||
|
style={styles.ctrls}
|
||||||
itemHref={itemHref}
|
itemHref={itemHref}
|
||||||
itemTitle={itemTitle}
|
itemTitle={itemTitle}
|
||||||
isAuthor={item.post.author.did === store.me.did}
|
isAuthor={item.post.author.did === store.me.did}
|
||||||
|
@ -330,8 +331,11 @@ const styles = StyleSheet.create({
|
||||||
flexWrap: 'wrap',
|
flexWrap: 'wrap',
|
||||||
paddingBottom: 4,
|
paddingBottom: 4,
|
||||||
},
|
},
|
||||||
postEmbeds: {
|
embed: {
|
||||||
marginBottom: 0,
|
marginBottom: 6,
|
||||||
|
},
|
||||||
|
ctrls: {
|
||||||
|
marginTop: 2,
|
||||||
},
|
},
|
||||||
viewFullThread: {
|
viewFullThread: {
|
||||||
paddingTop: 12,
|
paddingTop: 12,
|
||||||
|
|
|
@ -1,5 +1,12 @@
|
||||||
import React from 'react'
|
import React from 'react'
|
||||||
import {Animated, StyleSheet, TouchableOpacity, View} from 'react-native'
|
import {
|
||||||
|
Animated,
|
||||||
|
StyleProp,
|
||||||
|
StyleSheet,
|
||||||
|
TouchableOpacity,
|
||||||
|
View,
|
||||||
|
ViewStyle,
|
||||||
|
} from 'react-native'
|
||||||
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
|
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
|
||||||
import ReactNativeHapticFeedback from 'react-native-haptic-feedback'
|
import ReactNativeHapticFeedback from 'react-native-haptic-feedback'
|
||||||
import {Text} from './text/Text'
|
import {Text} from './text/Text'
|
||||||
|
@ -13,6 +20,7 @@ interface PostCtrlsOpts {
|
||||||
itemTitle: string
|
itemTitle: string
|
||||||
isAuthor: boolean
|
isAuthor: boolean
|
||||||
big?: boolean
|
big?: boolean
|
||||||
|
style?: StyleProp<ViewStyle>
|
||||||
replyCount?: number
|
replyCount?: number
|
||||||
repostCount?: number
|
repostCount?: number
|
||||||
upvoteCount?: number
|
upvoteCount?: number
|
||||||
|
@ -102,7 +110,7 @@ export function PostCtrls(opts: PostCtrlsOpts) {
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<View style={styles.ctrls}>
|
<View style={[styles.ctrls, opts.style]}>
|
||||||
<View style={s.flex1}>
|
<View style={s.flex1}>
|
||||||
<TouchableOpacity
|
<TouchableOpacity
|
||||||
style={styles.ctrl}
|
style={styles.ctrl}
|
||||||
|
@ -187,7 +195,7 @@ export function PostCtrls(opts: PostCtrlsOpts) {
|
||||||
<FontAwesomeIcon
|
<FontAwesomeIcon
|
||||||
icon="ellipsis-h"
|
icon="ellipsis-h"
|
||||||
size={16}
|
size={16}
|
||||||
style={[s.mt2, s.mr5, sRedgray]}
|
style={[s.mt2, s.mr5, {color: colors.gray3}]}
|
||||||
/>
|
/>
|
||||||
</PostDropdownBtn>
|
</PostDropdownBtn>
|
||||||
)}
|
)}
|
||||||
|
|
|
@ -31,7 +31,7 @@ export function PostEmbeds({
|
||||||
}
|
}
|
||||||
if (embed.images.length === 4) {
|
if (embed.images.length === 4) {
|
||||||
return (
|
return (
|
||||||
<View style={styles.imagesContainer}>
|
<View style={[styles.imagesContainer, style]}>
|
||||||
<ImageLayoutGrid
|
<ImageLayoutGrid
|
||||||
type="four"
|
type="four"
|
||||||
uris={embed.images.map(img => img.thumb)}
|
uris={embed.images.map(img => img.thumb)}
|
||||||
|
@ -41,7 +41,7 @@ export function PostEmbeds({
|
||||||
)
|
)
|
||||||
} else if (embed.images.length === 3) {
|
} else if (embed.images.length === 3) {
|
||||||
return (
|
return (
|
||||||
<View style={styles.imagesContainer}>
|
<View style={[styles.imagesContainer, style]}>
|
||||||
<ImageLayoutGrid
|
<ImageLayoutGrid
|
||||||
type="three"
|
type="three"
|
||||||
uris={embed.images.map(img => img.thumb)}
|
uris={embed.images.map(img => img.thumb)}
|
||||||
|
@ -51,7 +51,7 @@ export function PostEmbeds({
|
||||||
)
|
)
|
||||||
} else if (embed.images.length === 2) {
|
} else if (embed.images.length === 2) {
|
||||||
return (
|
return (
|
||||||
<View style={styles.imagesContainer}>
|
<View style={[styles.imagesContainer, style]}>
|
||||||
<ImageLayoutGrid
|
<ImageLayoutGrid
|
||||||
type="two"
|
type="two"
|
||||||
uris={embed.images.map(img => img.thumb)}
|
uris={embed.images.map(img => img.thumb)}
|
||||||
|
@ -61,7 +61,7 @@ export function PostEmbeds({
|
||||||
)
|
)
|
||||||
} else {
|
} else {
|
||||||
return (
|
return (
|
||||||
<View style={styles.imagesContainer}>
|
<View style={[styles.imagesContainer, style]}>
|
||||||
<AutoSizedImage
|
<AutoSizedImage
|
||||||
uri={embed.images[0].thumb}
|
uri={embed.images[0].thumb}
|
||||||
onPress={() => openLightbox(0)}
|
onPress={() => openLightbox(0)}
|
||||||
|
@ -82,7 +82,7 @@ export function PostEmbeds({
|
||||||
{link.thumb ? (
|
{link.thumb ? (
|
||||||
<AutoSizedImage uri={link.thumb} containerStyle={{borderRadius: 4}} />
|
<AutoSizedImage uri={link.thumb} containerStyle={{borderRadius: 4}} />
|
||||||
) : undefined}
|
) : undefined}
|
||||||
<Text type="h5" numberOfLines={1} style={pal.text}>
|
<Text type="h5" numberOfLines={2} style={pal.text}>
|
||||||
{link.title || link.uri}
|
{link.title || link.uri}
|
||||||
</Text>
|
</Text>
|
||||||
<Text type="body2" numberOfLines={1} style={pal.textLight}>
|
<Text type="body2" numberOfLines={1} style={pal.textLight}>
|
||||||
|
@ -105,11 +105,12 @@ export function PostEmbeds({
|
||||||
const styles = StyleSheet.create({
|
const styles = StyleSheet.create({
|
||||||
imagesContainer: {
|
imagesContainer: {
|
||||||
marginTop: 4,
|
marginTop: 4,
|
||||||
marginBottom: 6,
|
|
||||||
},
|
},
|
||||||
extOuter: {
|
extOuter: {
|
||||||
padding: 10,
|
padding: 10,
|
||||||
borderWidth: 1,
|
borderWidth: 1,
|
||||||
|
borderRadius: 4,
|
||||||
|
marginTop: 4,
|
||||||
},
|
},
|
||||||
extDescription: {
|
extDescription: {
|
||||||
marginTop: 4,
|
marginTop: 4,
|
||||||
|
|
|
@ -67,6 +67,6 @@ const styles = StyleSheet.create({
|
||||||
paddingRight: 5,
|
paddingRight: 5,
|
||||||
},
|
},
|
||||||
maxWidth: {
|
maxWidth: {
|
||||||
maxWidth: '70%',
|
maxWidth: '80%',
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
|
|
@ -62,7 +62,9 @@ export function UserInfoText({
|
||||||
)
|
)
|
||||||
} else if (profile) {
|
} else if (profile) {
|
||||||
inner = (
|
inner = (
|
||||||
<Text type={type} style={style}>{`${prefix || ''}${profile[attr]}`}</Text>
|
<Text type={type} style={style}>{`${prefix || ''}${
|
||||||
|
profile[attr] || profile.handle
|
||||||
|
}`}</Text>
|
||||||
)
|
)
|
||||||
} else {
|
} else {
|
||||||
inner = (
|
inner = (
|
||||||
|
|
Loading…
Reference in New Issue