Improve UI

This commit is contained in:
Adolfo Reyna
2023-08-08 22:28:07 -04:00
parent 0c8aa9fc21
commit e539e05c6e
3 changed files with 16 additions and 19 deletions

View File

@@ -168,6 +168,7 @@ let Media = (props) => {
scale: 1.1 scale: 1.1
}], }],
paddingTop: 5, paddingTop: 5,
paddingBottom: 10,
}} }}
showsHorizontalScrollIndicator={false} showsHorizontalScrollIndicator={false}
/> : /> :

View File

@@ -23,7 +23,7 @@ let Post = (props) => {
let [bookmarked, changeBookmarked] = useState(post.bookmarks && post.bookmarks.includes(viewer._id)); let [bookmarked, changeBookmarked] = useState(post.bookmarks && post.bookmarks.includes(viewer._id));
let toProfileText = post.toProfile && post.toProfile !== post.profileid ? let toProfileText = post.toProfile && post.toProfile !== post.profileid ?
<ProfilePhotoCircle profileid={post.toProfile} small={true} /> : undefined; <ProfilePhotoCircle profileid={post.toProfile} small={true} /> : undefined;
let cleanContent = post.content.replace(/@[A-z]+:.+\w/g, ''); let cleanContent = post.content.replace(/@[A-z]+:.+\w/g, '').trim();
//cleanContent = convertLinks(cleanContent); //cleanContent = convertLinks(cleanContent);
const newComentAdded = (commentData) => { const newComentAdded = (commentData) => {
let newPostObj = { ...post }; let newPostObj = { ...post };
@@ -69,21 +69,15 @@ let Post = (props) => {
{!post.nonOrganicType ? {!post.nonOrganicType ?
<View> <View>
<ProfilePhotoCircle profileid={post.profileid} /> <ProfilePhotoCircle profileid={post.profileid} />
<View style={{ flexDirection: 'row', alignItems: 'center', margin: 0, marginLeft: 37, marginTop: -5, paddingBottom: 2 }}> <View style={{ flexDirection: 'row', alignItems: 'center', margin: 0, marginLeft: 37, marginTop: -14, paddingBottom: 2 }}>
{toProfileText} {toProfileText}
<Text style={{ fontWeight: 'normal', fontSize: 10 }}>
{" " + Moment(post.createdAt).fromNow()}
</Text>
</View> </View>
{cleanContent.length ?
<Text style={{ fontSize: 15, padding: 3 }}>{ <Text style={{ fontSize: 16, padding: 3, paddingLeft: 40 }}>{
cleanContent cleanContent
}</Text> }</Text>
: <></> <Media content={post.content} postId={post._id} post={post} style={{ paddingTop: 2 }} />
}
<View style={{ paddingTop: 2 }}>
<Media content={post.content} postId={post._id} post={post} />
</View>
</View> : </View> :
<View> <View>
<Chip icon="new-releases" style={{ width: 100 }} >{i18n.t("message.news")}</Chip> <Chip icon="new-releases" style={{ width: 100 }} >{i18n.t("message.news")}</Chip>
@@ -93,23 +87,23 @@ let Post = (props) => {
} }
</Hyperlink> </Hyperlink>
</Card.Content> </Card.Content>
<Card.Actions style={{ flexDirection: "row", flow: 4, fontSize: 16, marginLeft: 0 }}> <Card.Actions style={{ flexDirection: "row", flow: 4, fontSize: 16, marginLeft: 36, marginTop: -10 }}>
<Button <Button
icon={post.reactions[viewer._id] ? "favorite" : "favorite-border"} icon={post.reactions[viewer._id] ? "favorite" : "favorite-border"}
labelStyle={{ fontSize: 16 }} labelStyle={{ fontSize: 17 }}
style={{ flow: 1 }} style={{ flow: 1 }}
onPress={newPostReaction} onPress={newPostReaction}
color="#555" color="#555"
> >
{likes} {likes}
</Button> </Button>
<Button icon="forum" labelStyle={{ fontSize: 16 }} style={{ flow: 1 }} <Button icon="forum" labelStyle={{ fontSize: 17 }} style={{ flow: 1 }}
onPress={() => { changeshowCommentsB(!showCommentsB) }} onPress={() => { changeshowCommentsB(!showCommentsB) }}
color="#555" color="#555"
> >
{post.comments.length} {post.comments.length}
</Button> </Button>
<Button icon="ios-share" style={{ flow: 1 }} labelStyle={{ fontSize: 16 }} <Button icon="ios-share" style={{ flow: 1 }} labelStyle={{ fontSize: 17 }}
color="#555" color="#555"
onPress={() => { onPress={() => {
Share.share({ Share.share({
@@ -120,11 +114,14 @@ let Post = (props) => {
<Button <Button
icon={!bookmarked ? "bookmark-outline" : "bookmark"} icon={!bookmarked ? "bookmark-outline" : "bookmark"}
style={{ flow: 1 }} style={{ flow: 1 }}
labelStyle={{ fontSize: 16 }} labelStyle={{ fontSize: 17 }}
onPress={newPostBookmark} onPress={newPostBookmark}
color="#555" color="#555"
> >
</Button> </Button>
<Text style={{ fontWeight: 'normal', fontSize: 12 }}>
{" " + Moment(post.createdAt).fromNow()}
</Text>
</Card.Actions> </Card.Actions>
{showCommentsB && <NewComment postid={post._id} newComentAdded={newComentAdded} />} {showCommentsB && <NewComment postid={post._id} newComentAdded={newComentAdded} />}
{ {

View File

@@ -29,7 +29,7 @@ const ProfileHeader = ({ profileid, withName = false, small = false }) => {
return ( return (
<View style={styles.container}> <View style={styles.container}>
<View style={styles.avatarContainer}> <View style={styles.avatarContainer}>
<Avatar.Image size={small ? 20 : 30} source={{ uri: photoUrl }} onPress={onPress} /> <Avatar.Image size={small ? 20 : 35} source={{ uri: photoUrl }} onPress={onPress} style={{marginLeft:-4}}/>
</View> </View>
<View style={styles.textContainer}> <View style={styles.textContainer}>
<Text style={small ? styles.smallProfileName : styles.profileName} onPress={onPress}>{fullName}</Text> <Text style={small ? styles.smallProfileName : styles.profileName} onPress={onPress}>{fullName}</Text>
@@ -42,7 +42,6 @@ const ProfileHeader = ({ profileid, withName = false, small = false }) => {
const styles = StyleSheet.create({ const styles = StyleSheet.create({
container: { container: {
flexDirection: 'row', flexDirection: 'row',
alignItems: 'center',
}, },
avatarContainer: { avatarContainer: {
marginRight: 5, marginRight: 5,