modification page compte

src/pages/Compte.js

@@ -59,8 +59,10 @@ const Compte = () => {
                                 </div>
                             </div>
                             <div className="name">
-                                <p className="def">Nom Complet :</p>
-                                <p className="nom">Mateo Centeno</p>
+                                <div className="presentationNom">
+                                    <p className="def">Nom Complet :</p>
+                                    <p className="nom">Mateo Centeno</p>
+                                </div>
                                 <div className='bouton_submit'>
                                     <button className="bouton_modifierNom" type="submit">Modifier le nom</button>
                                 </div>

src/styles/components/_compte.scss

@@ -124,6 +124,7 @@ body {
             .Compte {
                 display: flex;
                 flex-direction: column;
+                justify-content: space-evenly;
                 width: 94.3%;
                 height: auto;
                 margin: 5px 10px 10px 5px;
@@ -138,7 +139,7 @@ body {
                     display: flex;
                     flex-direction: column;
                     justify-content: space-evenly;
-                    margin: 30px;
+                    margin: 13px;
                     width: auto;
                     height: 30%;
 
@@ -152,12 +153,14 @@ body {
                         display: flex;
                         flex-direction: row;
                         justify-content: left;
+                        margin-right: 25px;
                         margin-left: 25px;
+                        border-bottom: 1px solid grey;
 
                         .photo_profil {
                             display: flex;
-                            height: 150px;
-                            width: 150px;
+                            height: 135px;
+                            width: 135px;
                         }
 
                         .bouton_submit {
@@ -168,7 +171,7 @@ body {
                             .bouton_ajoutPhoto {
                                 height: 40px;
                                 width: 150px;
-                                background-color: grey;
+                                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);
@@ -183,18 +186,26 @@ body {
                     .name {
                         display: flex;
                         flex-direction: row;
+                        justify-content: space-between;
+                        margin: 0 25px;
 
-                        .def {
+                        .presentationNom {
                             display: flex;
-                        }
+                            flex-direction: row;
+                            justify-content: space-evenly;                         
 
-                        .nom {
-                            display: flex;
+                            .def {
+                                display: flex;
+                            }
+
+                            .nom {
+                                display: flex;
+                                margin-left: 125px;
+                            }
                         }
 
                         .bouton_submit {
                             display: flex;
-                            justify-content: right;
                         }
                     }
                 }
@@ -202,8 +213,8 @@ body {
                 .infoPerso {
                     display: flex;
                     flex-direction: column;
-                    margin-left: 30px;
-                    margin-right: 30px;
+                    margin-left: 13px;
+                    margin-right: 13px;
                     width: auto;
                     height: 30%;
 
@@ -217,7 +228,7 @@ body {
                 .infoEntreprise {
                     display: flex;
                     flex-direction: column;    
-                    margin: 30px;
+                    margin: 13px;
                     width: auto;
                     height: 30%;