You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
61 lines
2.2 KiB
61 lines
2.2 KiB
import React, { useState } from 'react'
|
|
import Connexion from './Connexion';
|
|
import Inscription from './Inscription';
|
|
import '../../styles/pages/_profil.scss'
|
|
|
|
const Log = ( props ) => {
|
|
const [signUpModal, setSignUpModal] = useState(props.signup);
|
|
const [signInModal, setSignInModal] = useState(props.signin);
|
|
|
|
const handleModals = (e) => {
|
|
if (e.target.id === "register") {
|
|
setSignInModal(false);
|
|
setSignUpModal(true);
|
|
} else if (e.target.id === "login") {
|
|
setSignUpModal(false);
|
|
setSignInModal(true);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div className="connection-form">
|
|
<div className="form-container">
|
|
<div className="info-form-container">
|
|
<ul>
|
|
<li className='info-form-right'>Bienvenue !</li>
|
|
<li className='info-form-right'>
|
|
<div className='description-type-connection'>
|
|
<p>Vous ne disposez pas</p>
|
|
<p>de compte</p>
|
|
</div>
|
|
</li>
|
|
<li
|
|
onClick={handleModals}
|
|
id="register"
|
|
className={signUpModal ? "active-btn button-form" : "button-form"}
|
|
>
|
|
S'inscrire
|
|
</li>
|
|
<li className='info-form-right'>
|
|
<div className='description-type-connection'>
|
|
<p>Vous possédez déjà</p>
|
|
<p>un compte</p>
|
|
</div>
|
|
</li>
|
|
<li
|
|
onClick={handleModals}
|
|
id="login"
|
|
className={signInModal ? "active-btn button-form" : "button-form"}
|
|
>
|
|
Se connecter
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
{signUpModal && <Inscription />}
|
|
{signInModal && <Connexion />}
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default Log; |