Skip to content
Snippets Groups Projects
Commit 92b1755a authored by lfr20's avatar lfr20
Browse files

Add links to public user page

parent 821fdf3e
No related branches found
No related tags found
4 merge requests!57Merge of develop into master,!56Fixed buttons reportar, seguir, compartilhar, guardar and entrar (in comments...,!39Update admin system,!36Fix perfil into develop
Hide whitespace changes
Inline Side-by-side
src/Components/ContactCard.js
+ 48
− 46
View file @ 92b1755a
......@@ -16,7 +16,7 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
import React, {useState} from 'react';
import React, { useState } from 'react';
import Card from '@material-ui/core/Card';
import CardContent from '@material-ui/core/CardContent';
import noAvatar from "../img/default_profile.png";
......@@ -26,28 +26,30 @@ import Options from './ContactCardOptions.js'
import FollowButton from './ContactButtons/FollowButton.js'
import FollowingButton from './ContactButtons/FollowingButton.js'
import FollowersCountButton from './ContactButtons/FollowersCountButton.js'
import {Link} from 'react-router-dom';
import { Link } from 'react-router-dom';
export default function ImgMediaCard(props) {
const [followedBoolean, setFollowedBoolean] = useState(props.followed)
const toggleFollowed = () => {setFollowedBoolean(!followedBoolean)}
return (
const [followedBoolean, setFollowedBoolean] = useState(props.followed)
const toggleFollowed = () => { setFollowedBoolean(!followedBoolean) }
return (
<StyledCard>
<CardDiv>
<CardAreaDiv>
{/*Top part of contat card (background image, number of followers and avatar)*/}
<Header>
<StyledCardMedia image={props.cover}>
<div style = {{display : "flex", backgroundColor : "inherit", float : "right"}}>
<div style={{ display: "flex", backgroundColor: "inherit", float: "right" }}>
<Link to={props.href} style={{textDecoration : "none"}}>
<FollowersCountButton followCount={props.follow_count} />
</Link>
<Link to={props.href}>
<FollowersCountButton followCount={props.follow_count}/>
<AvatarDiv>
<img src={props.avatar ? props.avatar : noAvatar} alt='user avatar'
style={{ height: "100%", width: "100%", borderRadius: "50%" }} />
</AvatarDiv>
</Link>
<AvatarDiv>
<img src={props.avatar ? props.avatar : noAvatar} alt='user avatar'
style={{height : "100%", width : "100%", borderRadius : "50%"}}/>
</AvatarDiv>
</div>
</StyledCardMedia>
</Header>
......@@ -62,48 +64,48 @@ export default function ImgMediaCard(props) {
</Link>
<Link to={props.href}>
<span style={{fontSize : "14px", fontWeight : "normal"}}>
<b>{props.numCollections}</b> {props.numCollections !== 1? "Coleções" : "Coleção"} | <b>{props.numLearningObjects}</b> {props.numLearningObjects !== 1? "Recursos" : "Recurso"}
<span style={{ fontSize: "14px", fontWeight: "normal" }}>
<b>{props.numCollections}</b> {props.numCollections !== 1 ? "Coleções" : "Coleção"} | <b>{props.numLearningObjects}</b> {props.numLearningObjects !== 1 ? "Recursos" : "Recurso"}
</span>
</Link>
<div style={{display : "flex", justifyContent : "center"}}>
<div style={{ display: "flex", justifyContent: "center" }}>
{
followedBoolean ?
(
<React.Fragment>
<FollowingButton
followedID={props.followerID ? props.followerID : props.followedID}
toggleFollowed={toggleFollowed}/>
<Options
followableID={props.followerID ? props.followerID : props.followedID}
followed={followedBoolean}
toggleFollowed={toggleFollowed}/>
</React.Fragment>
)
:
(
<React.Fragment>
<FollowButton
followerID={props.followedID ? props.followedID : props.followerID}
toggleFollowed={toggleFollowed}/>
<Options
followableID={props.followedID ? props.followedID : props.followerID}
followed={followedBoolean}
toggleFollowed={toggleFollowed}/>
</React.Fragment>
)
(
<React.Fragment>
<FollowingButton
followedID={props.followerID ? props.followerID : props.followedID}
toggleFollowed={toggleFollowed} />
<Options
followableID={props.followerID ? props.followerID : props.followedID}
followed={followedBoolean}
toggleFollowed={toggleFollowed} />
</React.Fragment>
)
:
(
<React.Fragment>
<FollowButton
followerID={props.followedID ? props.followedID : props.followerID}
toggleFollowed={toggleFollowed} />
<Options
followableID={props.followedID ? props.followedID : props.followerID}
followed={followedBoolean}
toggleFollowed={toggleFollowed} />
</React.Fragment>
)
}
</div>
</UserInfo>
</CardContent>
</CardAreaDiv>
</CardDiv>
</StyledCard>
);
</UserInfo>
</CardContent>
</CardAreaDiv>
</CardDiv>
</StyledCard>
);
}
/*Controls top part of Card*/
......@@ -132,7 +134,7 @@ export const CardDiv = styled.div`
/*Override Material UI styling -----------------------------------------------*/
const StyledCardMedia = styled(CardMedia) `
const StyledCardMedia = styled(CardMedia)`
height : 100%;
width : 100%;
background-size : cover;
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment