feature: profile edition added

- new page created
- new route added
- some styles are reworked
- new styles added

src/styles/layout/members/member-profile.scss

@@ -12,14 +12,12 @@
     .member-bio {
 
       div[name='member-profile__bio'] {
-        border-bottom: 1px solid $color-221-51-90;
         display: grid;
         grid-template-areas: "avatar name status"
           "avatar pseudo status"
           "avatar bio status"
           "avatar list button";
         grid-template-columns: 1fr 2fr 1fr;
-        padding: 4.5rem;
 
         div[name='member-img'] {
           grid-area: avatar;

src/styles/layout/user/_index.scss

@@ -0,0 +1 @@
+@import 'user-profile';

src/styles/layout/user/user-profile.scss

@@ -0,0 +1,77 @@
+.user-profile__container {
+
+  .user-bio {
+    display: grid;
+    grid-gap: 1rem;
+    grid-template-areas: "avatar name"
+      "avatar information";
+    grid-template-columns: minmax(300px, 400px) 2fr;
+
+    .avatar-display {
+      grid-area: avatar;
+      overflow: hidden;
+      position: relative;
+
+      img {
+        width: 300px;
+        height: 300px;
+        object-fit: cover;
+        border-radius: 50%;
+        overflow: hidden;
+        object-position: center;
+        
+      }
+    }
+
+    .name-diplay {
+      grid-area: name;
+
+      [name='user-name-groups'] {
+        align-items: baseline;
+        align-self: end;
+        display: flex;
+
+        sib-multiple {
+          display: flex;
+          padding-left: 1.4rem;
+
+          groups-name {
+            @extend %user-role;
+          }
+        }
+      }
+    }
+
+    .info-form {
+      grid-area: information;
+
+      /* ces styles disparaitront lorsque l'on aura la fonctionnalité pour uploader une photo */
+      [name="account.picture"] {
+        margin-bottom: 1rem;
+      }
+
+      hd-instruction {
+        margin-left: 1rem;
+
+        span {
+          color: $color-233-18-29;
+          font-weight: bold;
+        }
+
+        p {
+          margin-left: 1rem;
+        }
+      }
+      /* Fin commentaire sur upload photos */
+    }
+
+    [name^="inline-"] {
+      display: flex;
+      justify-content: flex-start;
+
+      >*:not(:last-child) {
+        margin-right: 3rem;
+      }
+    }
+  }
+}