add cool new profile panel design

app/assets/stylesheets/scss/user.scss

@@ -6,13 +6,15 @@
 }
 
 .profile--displayname {
-  margin-top: -2px;
+  font-weight: 700;
-  margin-bottom: 2px;
+  font-size: 1.2em;
+  margin-top: -0.165em;
+  line-height: 1.33em;
 }
 
 .profile--username {
-  margin-top: 0px;
+  font-size: 0.9em;
-  margin-bottom: 2px;
+  color: rgba(0, 0, 0, 0.4);
 }
 
 .profile--admin {
@@ -76,4 +78,10 @@
 
 .profile--follow-btn {
   margin-top: 5px;
+}
+
+.profile-avatar {
+  width: 100%;
+  height: auto;
+  border: medium none;
 }

app/views/user/_profile_info.html.haml

@@ -1,30 +1,44 @@
 .panel.panel-default
+  %img.profile--avatar{src: @user.profile_picture.url(:large)}
   .panel-body
-    .media
+    - if @user.display_name.blank?
-      .pull-left
+      .profile--displayname
-        %img.img-rounded.profile--img{src: gravatar_url(@user)}
+        = @user.screen_name
-      .media-body
-        - if @user.display_name.blank?
-          %h2= @user.screen_name
-        - else
-          %h2.profile--displayname= @user.display_name
-          %h4.text-muted.profile--username= @user.screen_name
         - if @user.admin?
-          %p.profile--admin
+          %span.label.label-danger
             %i.fa.fa-flask
             Admin
         - if @user.moderator?
-          %p.profile--moderator
+          %span.label.label-success
             %i.fa.fa-users
             Mod
         - if @user.supporter?
-          %p.profile--supporter
+          %span.label.label-warning
             %i.fa.fa-star
             Supporter
-    - if @user.following? current_user
+        - if @user.following? current_user
-      %p
+          %span.label.label-default
-        %span.label.label-default
+            FOLLOWS YOU
-          FOLLOWS YOU
+    - else
+      .profile--displayname
+        = @user.display_name
+        - if @user.admin?
+          %span.label.label-danger
+            %i.fa.fa-flask
+            Admin
+        - if @user.moderator?
+          %span.label.label-success
+            %i.fa.fa-users
+            Mod
+        - if @user.supporter?
+          %span.label.label-warning
+            %i.fa.fa-star
+            Supporter
+        - if @user.following? current_user
+          %span.label.label-default
+            FOLLOWS YOU
+      .profile--username
+        = @user.screen_name
     - unless @user.bio.blank?
       %p.profile--text= @user.bio
     - unless @user.website.blank?