maxence.lanone
/
JTT_CrM_test_ci
forked from CRM_Production/JTT_CrM
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Création de la page Analyse

Browse Source
master
Clément VERDOIRE 3 years ago
parent ab591634e1
commit c7900491c7
2 changed files with 74 additions and 49 deletions
Show Stats Download Patch File Download Diff File

46
src/pages/Analyse.js
Unescape View File

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

77
src/styles/components/_analyse.scss
Unescape View File

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