Small improvements in the avatar settings

app/assets/stylesheets/themes/scinote.scss

@@ -1383,6 +1383,7 @@ table.dataTable {
 //edit avatar
 .avatar-container {
   background-color: lighten($color-concrete, 2%);
+  border-radius: 50%;
   height: 100px;
   position: relative;
   width: 100px;
@@ -1400,26 +1401,15 @@ table.dataTable {
 }
 
 .avatar-edit {
+  background-color: $color-silver-chalice;
+  border-radius: inherit;
+  color: $color-white;
   display: none;
-  margin-top: 70%;
+  height: inherit;
   opacity: .8;
-  position: absolute;
-  z-index: 10;
-
-  .btn-grey {
-    background-color: $color-silver-chalice;
-    border-color: $color-silver-chalice;
-    border-radius: 0;
-    color: $color-white;
-    width: 100px;
-
-    &:hover,
-    &:focus {
-      background-color: darken($color-silver-chalice, 15%);
-      border-color: darken($color-silver-chalice, 15%);
-      color: $color-white;
-    }
-  }
+  padding-top: 40%;
+  text-align: center;
+  width: inherit;
 }
 
 .avatar-file-upload input[type=file] {

app/views/users/registrations/edit.html.erb

@@ -25,10 +25,8 @@
                         <%= image_tag @user_avatar_url %>
                     </div>
                     <div class="avatar-edit">
-                        <div class="btn btn-grey btn-sm">
-                          <span class="fas fa-pencil-alt"></span>
-                        <%=t "users.registrations.edit.avatar_btn" %>
-                      </div>
+                      <span class="fas fa-pencil-alt"></span>
+                      <%=t "users.registrations.edit.avatar_btn" %>
                     </div>
                   </div>
                 </div>