Maxence LANONE 3 years ago
commit ab738a6086

@ -13,34 +13,28 @@ const Admin = () => {
<form className="form"> <form className="form">
<table className="Formulaire_de_connexion"> <table className="Formulaire_de_connexion">
<tr> <tr>
<p className="texte">Nom :</p> <div className="texte_côté">
<input id="nom" className="texte_zone" type="text" placeholder="Nom..."/> <p>Nom :</p>
<p>Prénom :</p>
<p>Rôle :</p>
<p>Identifiant :</p>
<p>Mot de passe :</p>
</div>
</tr> </tr>
<tr> <tr>
<p className="texte">Prénom :</p> <input id="nom" className="texte_zone" type="text" placeholder="Nom..."/>
<input id="prénom" className="texte_zone" type="text" placeholder="Prénom..."/> <input id="prénom" className="texte_zone" type="text" placeholder="Prénom..."/>
</tr>
<tr>
<p className="texte">Rôle dans l'entreprise :</p>
<input id="rôle" className="texte_zone" type="text" placeholder="Rôle..."/> <input id="rôle" className="texte_zone" type="text" placeholder="Rôle..."/>
</tr>
<tr>
<p className="texte">Identifiant :</p>
<input id="identifiant" className="texte_zone" type="text" placeholder="Identifiant..."/> <input id="identifiant" className="texte_zone" type="text" placeholder="Identifiant..."/>
</tr>
<tr>
<p className="texte">Mot de passe (par défaut) :</p>
<input id="password" className="texte_zone" type="password" placeholder="Mot de passe (par default)..."/> <input id="password" className="texte_zone" type="password" placeholder="Mot de passe (par default)..."/>
</tr> </tr>
<tr>
<div className='bouton_submit'>
<button className="bouton_val" type="submit">Valider</button>
<button className="bouton_ann" type="submit">Annuler</button>
</div>
</tr>
</table> </table>
</form> </form>
</div> </div>
<tr className="bouton_submit">
<button className="bouton_val" type="submit">Valider</button>
<button className="bouton_ann" type="submit">Annuler</button>
</tr>
</div> </div>
</div> </div>
); );

@ -1,41 +1,45 @@
import React from 'react'; import React from 'react';
import NavigationAdmin from '../components/NavigationAdmin.js'; import NavigationAdmin from '../components/NavigationAdmin.js';
import Admin from './Admin.js';
const Admin_modif = () => { const Admin_modif = () => {
return ( return (
<div className="page_admin"> <div className="page_admin">
{/* Create a page to delete an user in the admin page*/} <NavigationAdmin />
<NavigationAdmin/> {/* Create a admin page */}
<div className="Formulaire"> <div className="Titre_Formulaire">
<p className="Titre">Admin</p> <p className="Titre">Admin</p>
<form className="form"> <div className="Formulaire">
<table className="Formulaire_de_connexion"> <form className="form">
<tr> <table className="Formulaire_de_connexion">
<p className="texte">Nom :</p> <tr>
<input id="nom" className="texte_zone" type="text"/> <div className="texte_côté">
</tr> <p>Nom :</p>
<tr> <p>Prénom :</p>
<p className="texte">Prénom :</p> <p>Rôle :</p>
<input id="prénom" className="texte_zone" type="text"/> <p>Identifiant :</p>
</tr> <p>Mot de passe :</p>
<tr> </div>
<p className="texte">Rôle dans l'entreprise :</p> </tr>
<input id="rôle" className="texte_zone" type="text"/> <tr>
</tr> <div className="button_submit">
<tr> <button className="bouton_réini">Réinitialiser le mot de passe</button>
<p className="texte">Identifiant :</p> </div>
<input id="identifiant" className="texte_zone" type="text"/> </tr>
</tr> <tr>
<tr> <input id="nom" className="texte_zone" type="text" placeholder="Nom..."/>
<p className="texte">Mot de passe (par défaut) :</p> <input id="prénom" className="texte_zone" type="text" placeholder="Prénom..."/>
<input id="password" className="texte_zone" type="text"/> <input id="rôle" className="texte_zone" type="text" placeholder="Rôle..."/>
</tr> <input id="identifiant" className="texte_zone" type="text" placeholder="Identifiant..."/>
<tr> <input id="password" className="texte_zone" type="password" placeholder="Mot de passe (par default)..."/>
<button className="bouton_val_ann" type="submit">Valider</button> </tr>
<button className="bouton_val_ann" type="submit">Annuler</button> </table>
</tr> </form>
</table> </div>
</form> <tr className="bouton_submit">
<button className="bouton_val" type="submit">Valider</button>
<button className="bouton_ann" type="submit">Annuler</button>
</tr>
</div> </div>
</div> </div>
); );

@ -59,18 +59,44 @@ const Compte = () => {
</div> </div>
</div> </div>
<div className="name"> <div className="name">
<p className="def">Nom Complet :</p> <div className="presentationNom">
<p className="nom">Mateo Centeno</p> <p className="def">Nom Complet :</p>
<p className="nom">Mateo Centeno</p>
</div>
<div className='bouton_submit'> <div className='bouton_submit'>
<button className="bouton_modifierNom" type="submit">Modifier le nom</button> <button className="bouton_modifierNom" type="submit">Modifier le nom</button>
</div> </div>
</div> </div>
</div> </div>
<div className="infoPerso"> <div className="infoPerso">
<p>infoPerso</p> <p className="description">Informations personnel</p>
<div className="parti_mail">
<p className="def">Mail :</p>
<p className="mail">coucou@gmail.com</p>
</div>
<div className="parti_pays">
<p className="def">Pays ou Région :</p>
<p className="pays_region">France</p>
</div>
<div className="parti_tel">
<p className="def">Tel :</p>
<p className="tel">0745632114</p>
</div>
</div> </div>
<div className="infoEntreprise"> <div className="infoEntreprise">
<p>infoEntreprise</p> <p className="description">Informations entreprise</p>
<div className="parti_name">
<p className="def">Nom de l'entreprise</p>
<p className="name">entreprise name</p>
</div>
<div className="parti_secteurAct">
<p className="def">Secteur d'activité :</p>
<p className="secteurAct">Coiffure</p>
</div>
<div className="parti_nbClient">
<p className="def">Nombre clients :</p>
<p className="nbClient">200</p>
</div>
</div> </div>
</div> </div>
</div> </div>

@ -76,11 +76,11 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
flex-basis: 100%; flex-basis: 100%;
/*background: rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.3);
border-radius: 15px; border-radius: 15px;
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37); box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
backdrop-filter: blur(3px); backdrop-filter: blur(3px);
-webkit-backdrop-filter: blur(15px);*/ -webkit-backdrop-filter: blur(15px);
margin: 10px; margin: 10px;
padding: 10px; padding: 10px;
@ -110,10 +110,48 @@
margin-right: 10px; margin-right: 10px;
} }
.Formulaire_de_connexion {
display: flex;
flex-direction: row;
margin-top: 10%;
/*background: rgba(255, 255, 255, 0.3);
border-radius: 15px;
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
backdrop-filter: blur(3px);
-webkit-backdrop-filter: blur(15px);*/
.texte_côté {
display:flex;
flex-direction: column;
justify-content: space-around;
height: 100%;
}
input {
display: flex;
flex-direction: column;
margin: 10px;
}
.button_submit {
display: flex;
margin-top: 150%;
margin-bottom: 2%;
padding-left: 10px;
.bouton_réini{
background-color: rgb(190, 189, 189);
border-radius: 5px;
border: 1px solid black;
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
}
}
}
.texte { .texte {
align-self: center; align-self: center;
font-weight: bold; font-size: 15px;
font-size: 30px;
padding: 10px 10px 10px 0; padding: 10px 10px 10px 0;
} }
@ -123,21 +161,23 @@
background-color: transparent; background-color: transparent;
border-radius: 5px; border-radius: 5px;
border: 0.5px solid; border: 0.5px solid;
justify-content: center;
padding: 0 10px 0 15px; padding: 0 10px 0 15px;
//padding-left: 10px; padding-left: 10px;
//padding-right: 10px; padding-right: 10px;
} }
.bouton_submit { .bouton_submit {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: space-between; justify-content: space-around;
align-self: center;
width: 600px; width: 600px;
height: 30px; height: 30px;
margin: 5px 5px 5px 0; margin-top: 5%;
.bouton_val{ .bouton_val{
display: flex; //display: flex;
background-color: grey; background-color: grey;
border: 1px solid rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.1);
backdrop-filter: blur(30px); backdrop-filter: blur(30px);
@ -161,7 +201,7 @@
} }
.bouton_ann{ .bouton_ann{
display: flex; //display: flex;
background-color: grey; background-color: grey;
border: 1px solid rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.1);
backdrop-filter: blur(30px); backdrop-filter: blur(30px);
@ -196,7 +236,6 @@
backdrop-filter: blur(3px); backdrop-filter: blur(3px);
-webkit-backdrop-filter: blur(15px);*/ -webkit-backdrop-filter: blur(15px);*/
margin: 10px; margin: 10px;
padding: 10px;
.Titre { .Titre {
display: flex; display: flex;
@ -205,7 +244,7 @@
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37); box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
backdrop-filter: blur(3px); backdrop-filter: blur(3px);
-webkit-backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px);
margin: 10px; //margin: 10px;
font-size: 70px; font-size: 70px;
font-weight: bold; font-weight: bold;
} }
@ -219,8 +258,8 @@
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37); box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
backdrop-filter: blur(3px); backdrop-filter: blur(3px);
-webkit-backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px);
margin: 10px; //margin: 10px;
padding: 10px; //padding: 10px;
align-items: center; align-items: center;
.input_box { .input_box {

@ -124,6 +124,7 @@ body {
.Compte { .Compte {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-evenly;
width: 94.3%; width: 94.3%;
height: auto; height: auto;
margin: 5px 10px 10px 5px; margin: 5px 10px 10px 5px;
@ -138,7 +139,7 @@ body {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-evenly; justify-content: space-evenly;
margin: 30px; margin: 13px;
width: auto; width: auto;
height: 30%; height: 30%;
@ -152,12 +153,14 @@ body {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: left; justify-content: left;
margin-right: 25px;
margin-left: 25px; margin-left: 25px;
border-bottom: 1px solid grey;
.photo_profil { .photo_profil {
display: flex; display: flex;
height: 150px; height: 135px;
width: 150px; width: 135px;
} }
.bouton_submit { .bouton_submit {
@ -168,7 +171,7 @@ body {
.bouton_ajoutPhoto { .bouton_ajoutPhoto {
height: 40px; height: 40px;
width: 150px; width: 150px;
background-color: grey; background-color: rgb(190, 189, 189);
border-radius: 5px; border-radius: 5px;
border: 1px solid black; border: 1px solid black;
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37); box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
@ -183,18 +186,27 @@ body {
.name { .name {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: space-between;
margin: 0 25px;
.def { .presentationNom {
display: flex; display: flex;
} flex-direction: row;
justify-content: space-evenly;
.nom { .def {
display: flex; display: flex;
font-weight: bold;
}
.nom {
display: flex;
margin-left: 125px;;
}
} }
.bouton_submit { .bouton_submit {
display: flex; display: flex;
justify-content: right;
} }
} }
} }
@ -202,8 +214,9 @@ body {
.infoPerso { .infoPerso {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
margin-left: 30px; justify-content: space-evenly;
margin-right: 30px; margin-left: 13px;
margin-right: 13px;
width: auto; width: auto;
height: 30%; height: 30%;
@ -212,12 +225,73 @@ body {
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37); box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
backdrop-filter: blur(3px); backdrop-filter: blur(3px);
-webkit-backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px);
.description {
display: flex;
margin: 0 25px;
border-bottom: 1px solid grey;
padding: 0 0 10px 0;
font-weight: bold;
}
.parti_mail {
display: flex;
flex-direction: row;
margin: 0 25px;
border-bottom: 1px solid grey;
padding: 0 0 15px 0;
.def {
display: flex;
font-weight: bold;
}
.mail {
display: flex;
margin-left: 199px;
}
}
.parti_pays {
display: flex;
flex-direction: row;
margin: 0 25px;
border-bottom: 1px solid grey;
padding: 0 0 15px 0;
.def {
display: flex;
font-weight: bold;
}
.pays_region {
display: flex;
margin-left: 110px;
}
}
.parti_tel {
display: flex;
flex-direction: row;
margin: 0 25px;
.def {
display: flex;
font-weight: bold;
}
.tel {
display: flex;
margin-left: 207px;
}
}
} }
.infoEntreprise { .infoEntreprise {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
margin: 30px; justify-content: space-evenly;
margin: 13px;
width: auto; width: auto;
height: 30%; height: 30%;
@ -226,6 +300,66 @@ body {
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37); box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
backdrop-filter: blur(3px); backdrop-filter: blur(3px);
-webkit-backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px);
.description {
display: flex;
margin: 0 25px;
border-bottom: 1px solid grey;
padding: 0 0 10px 0;
font-weight: bold;
}
.parti_name {
display: flex;
flex-direction: row;
margin: 0 25px;
border-bottom: 1px solid grey;
padding: 0 0 15px 0;
.def {
display: flex;
font-weight: bold;
}
.name {
display: flex;
margin-left: 92px;
}
}
.parti_secteurAct{
display: flex;
flex-direction: row;
margin: 0 25px;
border-bottom: 1px solid grey;
padding: 0 0 15px 0;
.def {
display: flex;
font-weight: bold;
}
.secteurAct {
display: flex;
margin-left: 98px;
}
}
.parti_nbClient {
display: flex;
flex-direction: row;
margin: 0 25px;
.def {
display: flex;
font-weight: bold;
}
.nbClient {
display: flex;
margin-left: 115px;
}
}
} }
} }
} }

Loading…
Cancel
Save