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

Merge branch 'master' of https://codefirst.iut.uca.fr/git/maxence.lanone/JTT_CrM

Browse Source
master
Maxence LANONE 3 years ago
parent fdf90aa4fa afbec0be83
commit 210fa490f5
5 changed files with 71 additions and 5 deletions
Show Stats Download Patch File Download Diff File

2
src/components/NavigationDashboard.js
Unescape View File

@ -8,7 +8,7 @@ const NavigationDashboard = () => {
<NavLink className="mon_compte" to="/Account"> <NavLink className="mon_compte" to="/Account">
<div className="parti_one"> <div className="parti_one">
<button className="button" type="submit"> <button className="button" type="submit">
<img id='bigImage' className="logo_nav_bar" srcSet="./logo_person.svg"/> <img className="logo_nav_bar" srcSet="./logo_person.svg"/>
</button> </button>
</div> </div>
</NavLink> </NavLink>

31
src/pages/Compte.js
Unescape View File

@ -2,6 +2,7 @@ import React from 'react';
import NavigationDashboard from '../components/NavigationDashboard'; import NavigationDashboard from '../components/NavigationDashboard';
const Compte = () => { const Compte = () => {
return ( return (
<body> <body>
@ -27,9 +28,9 @@ const Compte = () => {
<div className="Compte"> <div className="Compte">
<div className="name_picture"> <div className="name_picture">
<div className="picture"> <div className="picture">
<img className="photo_profil" srcSet="./logo_personEntouré.svg"/> <div id="display_image"></div>
<div className='bouton_submit'> <div className='bouton_submit'>
<button className="bouton_ajoutPhoto" type="submit">Ajouter une photo</button> <input type="file" name="fileUpload" id="fileUpload"/>
</div> </div>
</div> </div>
<div className="name"> <div className="name">
@ -75,8 +76,34 @@ const Compte = () => {
</div> </div>
</div> </div>
</div> </div>
<script src="Compte.js" defer></script>
</body> </body>
); );
}; };
let fileUpload = document.getElementById("fileUpload");
let display_image = document.getElementById("display_image");
preview();
function preview(){
display_image.innerHTML = "";
for(fileUpload of fileUpload.files){
let reader = new FileReader();
let figure = document.createElement("figure");
let figCap = document.createElement("figcaption");
figCap.innerText = fileUpload.name;
figure.appendChild(figCap);
reader.onload=()=>{
let img = document.createElement("img");
img.setAttribute("src", reader.result);
figure.insertBefore(img,figCap);
}
display_image.appendChild(figure);
reader.readAsDataURL(fileUpload);
}
}
export default Compte; export default Compte;

10
src/pages/Parametres.js
Unescape View File

@ -43,7 +43,15 @@ const Parametre = () => {
</div> </div>
</div> </div>
<div className="two"> <div className="two">
coucou <div className="two_haut">
coucou
</div>
<div className="two_bas">
<p className="text_two_bas">Mode sombre</p>
<div className="center">
<input type="checkbox" name=''/>
</div>
</div>
</div> </div>
<div className="three"> <div className="three">
coucou coucou

18
src/styles/components/_compte.scss
Unescape View File

@ -162,11 +162,26 @@ body {
margin-left: 25px; margin-left: 25px;
border-bottom: 1px solid grey; border-bottom: 1px solid grey;
.photo_profil { #display_image {
display: flex; display: flex;
margin-bottom: 5px;
height: 135px; height: 135px;
width: 135px; width: 135px;
background: rgba(255, 255, 255, 0.1);
border-radius: 15px;
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
backdrop-filter: blur(3px);
-webkit-backdrop-filter: blur(15px);
} }
.figure{
width: 45%;
}
.img{
width: 100%;
}
.bouton_submit { .bouton_submit {
display: flex; display: flex;
@ -231,6 +246,7 @@ body {
} }
} }
.infoPerso { .infoPerso {
display: flex; display: flex;
flex-direction: column; flex-direction: column;

15
src/styles/components/_parametre.scss
Unescape View File

@ -218,8 +218,11 @@ body {
.two { .two {
display: flex; display: flex;
flex-direction: column;
justify-content: space-between;
width: auto; width: auto;
height: 28.5%; height: 28.5%;
padding: 10px;
background: rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.3);
border-radius: 15px; border-radius: 15px;
@ -227,6 +230,18 @@ body {
backdrop-filter: blur(3px); backdrop-filter: blur(3px);
-webkit-backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px);
.two_haut {
display: flex;
height: 75%;
}
.two_bas {
display: flex;
flex-direction: row;
padding: 9px;
height: 25%;
}
} }
.three { .three {

Write Preview
Loading…
Cancel
Save