Jeremy DUCOURTHIAL 3 years ago
commit 4a2234fedc

@ -55,6 +55,7 @@ function Admin() {
{/* Create a admin page */}
<div className="Titre_Formulaire">
<p className="Titre">Admin</p>
<p className="Sous-titre">Création d'utilisateur</p>
<div className="Formulaire">
<form className="form" onSubmit={checkAdd}>
<table className="Formulaire_de_connexion">

@ -9,6 +9,7 @@ const Admin_modif = () => {
{/* Create a admin page */}
<div className="Titre_Formulaire">
<p className="Titre">Admin</p>
<p className="Sous-titre">Modification d'utilisateur</p>
<div className="Formulaire">
<form className="form">
<table className="Formulaire_de_connexion">

@ -31,6 +31,7 @@ const Admin_supp = () => {
<NavigationAdmin />
<div className="Titre_Formulaire_Rech">
<p className="Titre">Admin</p>
<p className="Sous-titre">Supression d'utilisateur</p>
<div className="rechLogo">
<div className="input_box">
<input type="search" placeholder="Rechercher..."/>

@ -11,30 +11,38 @@ const api = axios.create({
const Analyse = () => {
return (
<div className="page_analyse">
{/* Create an analysis page */}
<div className="haut_de_page">
<h2 className="titre">Analyse</h2>
<div className="rechLogo">
<div className="input_box">
<input type="search" placeholder="Rechercher..."/>
<span className="search">
<i class="uil uil-search search-icon"></i>
</span>
<body>
<link rel="stylesheet" href="https://unicons.iconscout.com/release/v4.0.0/css/line.css"></link>
<div className="page_analyse">
{/* Create an analysis page */}
<div className="haut_de_page">
<h2 className="titre">Analyse</h2>
<div className="rechLogo">
<div className="input_box">
<input type="search" placeholder="Rechercher..."/>
<span className="search">
<i class="uil uil-search search-icon"></i>
</span>
</div>
<img className="logo" srcSet="./LogoApp.svg"/>
</div>
<img className="logo" srcSet="./LogoApp.svg"/>
</div>
</div>
<div className="bas_de_page">
<NavigationDashboard />
<div className="Analyse">
<div className="statistiques_1">
</div>
<div className="bas_de_page">
<NavigationDashboard />
<div className="Analyse">
<div className="Stat_1">
Tendances des ventes
</div>
<div className="Stat_2">
Statistique n°2
</div>
</div>
</div>
</div>
</div>
</body>
);
};

@ -1,28 +1,75 @@
import React from 'react';
import NavigationDashboard from '../components/NavigationDashboard';
const Dashboard = () => {
return (
<body className="corps_page_dashboard">
<body>
<link rel="stylesheet" href="https://unicons.iconscout.com/release/v4.0.0/css/line.css"></link>
<div className="page_principale">
{/* Create a principal page */}
<div className="haut_de_page">
<h2 className="titre">Dashboard</h2>
<div className="rechLogo">
<div className="input_box">
<input type="search" placeholder="Rechercher..."/>
<span className="search">
<i class="uil uil-search search-icon"></i>
</span>
</div>
<link rel="stylesheet" href="https://unicons.iconscout.com/release/v4.0.0/css/line.css"></link>
<div className="page_dashboard">
{/* Create an account page */}
<div className="haut_de_page">
<h2 className="titre">Dashboard</h2>
<div className="rechLogo">
<div className="input_box">
<input type="search" placeholder="Rechercher..."/>
<span className="search">
<i class="uil uil-search search-icon"></i>
</span>
</div>
<img className="logo" srcSet="./LogoApp.svg"/>
</div>
</div>
</body>
<div className="bas_de_page">
<NavigationDashboard />
<div className="Dashboard">
<div className="_gauche">
<div className="_haut">
<div className="Mes_infos">
Mes infos
</div>
<div className="Alertes">
Alertes
</div>
</div>
<div className="_bas">
<div className="Mes_prochaines_activités">
Mes prochaines activités
</div>
<div className="Chiffre_clés">
<div className="Ch_Clé_gauche">
<div className="Ch_Clé_gauche_haut">
Chiffre_clés
</div>
<div className="Ch_Clé_gauche_bas">
Chiffre_clés
</div>
</div>
<div className="Ch_Clé_droite">
<div className="Ch_Clé_droite_haut">
Chiffre_clés
</div>
<div className="Ch_Clé_droite_bas">
Chiffre_clés
</div>
</div>
</div>
</div>
</div>
<div className="_droite">
<div className="clients_important">
clients important
</div>
<div className="contacts_ajouté_récemment">
contacts ajouté récemment
</div>
</div>
</div>
</div>
</div>
</body>
);
};

@ -95,6 +95,18 @@
font-size: 70px;
font-weight: bold;
}
.Sous-titre {
display: flex;
/*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);*/
margin: 10px;
font-size: 40px;
font-weight: bold;
}
.Formulaire{
@ -231,37 +243,51 @@
display: flex;
flex-direction: column;
flex-basis: 100%;
/*background: rgba(255, 255, 255, 0.3);
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);*/
-webkit-backdrop-filter: blur(15px);
margin: 10px;
padding: 10px;
.Titre {
display: flex;
background: rgba(255, 255, 255, 0.3);
/*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);
//margin: 10px;
-webkit-backdrop-filter: blur(15px);*/
margin: 10px;
font-size: 70px;
font-weight: bold;
}
.Sous-titre {
display: flex;
/*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);*/
margin: 10px;
font-size: 40px;
font-weight: bold;
}
.rechLogo {
display: flex;
flex-direction: column;
flex-basis: 100%;
background: rgba(255, 255, 255, 0.3);
/*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);
-webkit-backdrop-filter: blur(15px);*/
//margin: 10px;
//padding: 10px;
align-items: center;
margin-top: 5%;
.input_box {
display: flex;

@ -1,16 +1,13 @@
.page_analyse {
display: flex;
flex-direction: column;
//justify-content: space-evenly;
width: auto;
height: 100vh;
background: rgba(255, 255, 255, 0.143);
border-radius: 15px;
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
backdrop-filter: blur(3px);
-webkit-backdrop-filter: blur(15px);
body {
background-image: url("../../../public/fond_page_connexion.png");
.page_analyse {
display: flex;
flex-direction: column;
justify-content: space-evenly;
width: auto;
height: 100vh;
.haut_de_page {
display: flex;
flex-direction: row;
@ -20,8 +17,8 @@
height: 10%;
align-items: center;
margin: 10px 10px 5px 10px;
background: rgba(255, 255, 255, 0.143);
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);
@ -30,7 +27,7 @@
.titre {
font-size: 40px;
}
.rechLogo {
display: flex;
flex-direction: row;
@ -86,11 +83,11 @@
}
}
}
.bas_de_page {
display: flex;
flex-direction: row;
//justify-content: space-between;
justify-content: space-between;
width: auto;
height: 86%;
@ -102,7 +99,7 @@
width: 5%;
margin: 5px 5px 10px 10px;
background: rgba(255, 255, 255, 0.143);
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);
@ -124,20 +121,40 @@
}
}
.statistiques_1 {
.Analyse {
display: flex;
flex-direction: column;
justify-content: space-evenly;
padding: 50px;
width: 1423px;
height: 627px;
margin: 5px 5px 10px 10px;
background: rgba(255, 255, 255, 0.143);
border-radius: 15px;
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
backdrop-filter: blur(3px);
-webkit-backdrop-filter: blur(15px);
height: auto;
width: 93%;
margin: 5px 10px 10px 5px;
.Stat_1 {
display: flex;
width: auto;
height: 50%;
margin: 50px 50px 8px 50px;
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);
}
.Stat_2 {
display: flex;
width: auto;
height: 50%;
margin: 8px 50px 50px 50px;
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);
}
}
}
}
}
}

@ -1,8 +1,7 @@
.corps_page_dashboard{
body {
background-image: url("../../../public/fond_page_connexion.png");
.page_principale {
.page_dashboard {
display: flex;
flex-direction: column;
justify-content: space-evenly;
@ -84,5 +83,214 @@
}
}
}
.bas_de_page {
display: flex;
flex-direction: row;
justify-content: space-between;
width: auto;
height: 86%;
.nav_bar_verticale {
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: center;
width: 5%;
margin: 5px 5px 10px 10px;
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);
.button {
display: flex;
object-fit: cover;
background-color: transparent;
border: none;
cursor: pointer;
.logo_nav_bar{
display: flex;
margin: 10px;
height: 50px;
width: 50px;
}
}
}
.Dashboard {
display: flex;
flex-direction: row;
justify-content: space-between;
width: 93%;
height: auto;
margin: 5px 10px 10px 5px;
._gauche {
display: flex;
flex-direction: column;
justify-content: space-between;
width: 76%;
._haut {
display: flex;
flex-direction: row;
justify-content: space-between;
width: auto;
height: 40%;
.Mes_infos {
display: flex;
width: 40%;
height: auto;
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);
}
.Alertes {
display: flex;
width: 58.5%;
height: auto;
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);
}
}
._bas {
display: flex;
flex-direction: row;
justify-content: space-between;
width: auto;
height: 58%;
.Mes_prochaines_activités {
display: flex;
width: 45%;
height: auto;
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);
}
.Chiffre_clés {
display: flex;
flex-direction: row;
justify-content: space-between;
width: 53%;
height: auto;
.Ch_Clé_gauche {
display: flex;
flex-direction: column;
justify-content: space-between;
width: 45%;
height: auto;
.Ch_Clé_gauche_haut {
display: flex;
width: auto;
height: 53%;
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);
}
.Ch_Clé_gauche_bas {
display: flex;
width: auto;
height: 42%;
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);
}
}
.Ch_Clé_droite {
display: flex;
flex-direction: column;
justify-content: space-between;
width: 51%;
height: auto;
.Ch_Clé_droite_haut {
display: flex;
width: auto;
height: 46%;
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);
}
.Ch_Clé_droite_bas {
display: flex;
width: auto;
height: 49%;
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);
}
}
}
}
}
._droite {
display: flex;
flex-direction: column;
justify-content: space-between;
width: 23%;
.clients_important {
display: flex;
width: auto;
height: 64%;
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);
}
.contacts_ajouté_récemment {
display: flex;
width: auto;
height: 34%;
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);
}
}
}
}
}
}
}

Loading…
Cancel
Save