Improve avatar block UI on profile page

Signed-off-by: Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com>

app/assets/stylesheets/sections/profile.scss

@@ -42,7 +42,8 @@
   margin-right: 12px;
 }
 
-.remove_avatar {
-  margin-top: 10px;
+.profile-avatar-form-option {
+  hr {
+    margin: 10px 0;
+  }
 }
-

app/views/profiles/show.html.haml

@@ -74,9 +74,10 @@
              
             %span.file_name.js-avatar-filename File name...
             = f.file_field :avatar, class: "js-user-avatar-input hide"
-          %span.help-block The maximum file size allowed is 100KB.
-          - if @user.avatar?
-            = link_to 'Remove avatar', profile_avatar_path, confirm: "Avatar will be removed. Are you sure?", method: :delete, class: "btn btn-remove remove_avatar"
+            .light The maximum file size allowed is 100KB.
+            - if @user.avatar?
+              %hr
+              = link_to 'Remove avatar', profile_avatar_path, confirm: "Avatar will be removed. Are you sure?", method: :delete, class: "btn btn-remove btn-small remove-avatar"
 
   .form-actions
-    = f.submit 'Save changes', class: "btn btn-save"
\ No newline at end of file
+    = f.submit 'Save changes', class: "btn btn-save"