Some more UI changes for circle profile

This commit is contained in:
Adolfo Reyna
2023-07-22 22:52:24 -04:00
parent 919cd4be3b
commit 0c8aa9fc21
7 changed files with 65 additions and 46 deletions

View File

@@ -6,6 +6,7 @@ import API from './../API.js';
import { useNavigation } from '@react-navigation/native';
import AsyncStorage from '@react-native-async-storage/async-storage';
import FollowButton from './basics/FollowButton.js';
import ProfilePhotoCircle from './ProfilePhotoCircle.js';
const DefaultPhoto = "https://social.emmint.com/uploads/e6f9be6d665dc43417701bf16a90122c.png";
@@ -54,39 +55,39 @@ let ProfileCardHorizontal = ({ profileid, hideIcon, profileObj, skipFollow, skip
let photoUrl = profile.profile?.photo ? 'https://social.emmint.com/' + profile.profile.photo : DefaultPhoto;
const onPress = () => {
if(skiptOnPress) return 0;
if (skiptOnPress) return 0;
return navigation.navigate('Profile', { profileid: profile._id })
}
//console.log(profile)
return (
<Card style={styles.content} mode="elevated">
<Card.Content>
<View style={{ flexDirection: "row", alignItems: "center" }}>
<View onPress={onPress}>
<Avatar.Image size={75} source={{ uri: photoUrl }} />
</View>
<View style={{ paddingLeft: 10 }}>
<Title onPress={onPress} numberOfLines={1}>
<Text>
{profile.profile && profile.profile.firstName} {profile.profile && profile.profile.lastName}
</Text>
</Title>
<Paragraph lineBreakMode="clip" numberOfLines={3} style={{ width: 250 }}>{profile.profile?.description}</Paragraph>
</View>
<Card.Content style={{
marginLeft: -8,
marginTop: -8,
marginBottom: -4
}}>
<View style={{ flexDirection: "row", alignItems: "center", marginBottom: -8 }}>
<ProfilePhotoCircle profileid={profile._id} />
</View>
<Paragraph lineBreakMode="clip" numberOfLines={2} style={{ marginLeft: 40, top: 0, fontSize: 13, lineHeight: 0 }} color={"#FFF"}>{profile.profile?.description}</Paragraph>
{
profile.subscribed && Object.keys(profile.subscribed).length ?
<Text style={{ marginLeft: 40, top: 0, fontSize: 11, marginTop: 0, fontSize: 10, fontWeight: "500" }} >{Object.keys(profile.subscribed).length} Following</Text>
: <></>
}
{skipFollow ? <></> :
<View style={{
position: "absolute",
top: 0,
right: 0,
width: 50,
height: 50,
backgroundColor:"#ddd",
top: 15,
right: 10,
width: 30,
height: 30,
backgroundColor: "#ddd",
borderRadius: 25,
opacity: 0.7
opacity: 0.5,
}}>
<FollowButton profile={profile._id ? profile : { _id: profileid }} />
<FollowButton profile={profile._id ? profile : { _id: profileid }} iconSize={14} />
</View>
}
</Card.Content>
@@ -98,6 +99,11 @@ export default React.memo(ProfileCardHorizontal);
const styles = StyleSheet.create({
content: {
margin: 4,
margin: 0,
marginBottom: 1,
padding: 0,
//backgroundColor: "rgba(0,0,0,0)"
marginLeft: -5,
marginRight: -5,
},
});