From 6c0795acd61a448b6e3a5a4d20bbf931ceea7e12 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?In=C3=A8s=20Yeterian?= <ines.yeterian@student-cs.fr> Date: Mon, 10 Jan 2022 22:25:03 +0100 Subject: [PATCH] added Fb and instagram buttons for computer and mobile --- front/src/view/PageHeader.js | 19 ++++++++++++------- 1 file changed, 12 insertions(+), 7 deletions(-) diff --git a/front/src/view/PageHeader.js b/front/src/view/PageHeader.js index a91e76d..c4f107a 100644 --- a/front/src/view/PageHeader.js +++ b/front/src/view/PageHeader.js @@ -1,32 +1,37 @@ import React from 'react'; import {Image, Button} from 'semantic-ui-react' import LogoutButton from '../utils/LogoutButton' -import {Link} from 'react-router-dom' import logo from '../image/logo.png' import env from './../.env' const PageHeader = (props) => { + console.table(env) return ( [ // Si le format est celui d'un Pc - <div class="desktopItem" style={{textAlign:"center"}}> {console.log(props.isLogged)} + <div className="desktopItem" style={{textAlign:"center"}}> {console.log(props.isLogged)} <Image src={logo} alt="Logo" href="/" style={{ width:'40%'}} /> {props.isLogged ? <LogoutButton style={{position:"absolute",top:'2em' ,right:"2em"}}/>: <Button icon="male" content="Espace admin" style={{position:"absolute",top:'2em' ,right:"2em"}} onClick={() =>window.location=`${env.backURL}/oauth/login`}/> } - <Button icon="facebook" content="Facebook" style={{position:"absolute",top:'2em' ,left:"2em", color: "white", backgroundColor:"#3b5998"}} onClick={() =>window.location.assign("https://www.facebook.com/LeToucanDechaine")}/> - <Button icon="instagram" content="Insta" style={{position:"absolute",top:'5em' ,left:"2em", color: "white", backgroundColor:"#c13584"}} onClick={() =>window.location.assign("https://www.instagram.com/le.toucan.dechaine/")}/> + <a href={"https://www.facebook.com/LeToucanDechaine/"}> <Button icon="facebook" content="Facebook" style={{position:"absolute",top:'2em' ,left:"2em", color: "white", backgroundColor:"#3b5998"}}/></a> + <a href={"https://instagram.com/le.toucan.dechaine"}><Button icon="instagram" content="Insta" style={{position:"absolute",top:'5em' ,left:"2em", color: "white", backgroundColor:"#c13584"}}/></a> + </div>, // Si le format est celui d'un téléphone - <div class="phoneItem" style={{textAlign:"center"}}> + <div className="phoneItem" style={{textAlign:"center"}}> <Image src={logo} alt="Logo" href="/" style={{ margin: "2em"}} /> <br/> - {props.isLogged ? <LogoutButton style={{margin:"1em"}}/>: - <Button icon="male" content="Espace admin" style={{margin:"1em"}} onClick={() =>window.location=`${env.backURL}/oauth/login`}/> + <div style={{padding:"0.7em"}}> + <a href={"https://www.facebook.com/LeToucanDechaine/"}> <Button icon="facebook" style={{position:"absolute", left:"3em", color: "white", backgroundColor:"#3b5998"}}/></a> + <a href={"https://instagram.com/le.toucan.dechaine"}><Button icon="instagram" style={{position:"absolute", left:"6em", backgroundColor:"#c13584"}}/></a> + {props.isLogged ? <LogoutButton/>: + <Button icon="male" content="Espace admin" style={{position:"absolute", right:"3em"}} onClick={() =>window.location=`${env.backURL}/oauth/login`}/> } + </div> </div> ] ) -- GitLab