Provide defaults and make sure we everything is container into a parent element

1 files changed, 97 insertions, 96 deletions

diff --git a/app/views/users/show.html.haml b/app/views/users/show.html.haml
index 1e193ddb211..bca816f22cb 100644
--- a/app/views/users/show.html.haml
+++ b/app/views/users/show.html.haml
@@ -8,105 +8,106 @@
 
 = render 'shared/show_aside'
 
-.cover-block
-  .cover-controls
-    - if @user == current_user
-      = link_to profile_path, class: 'btn btn-gray' do
-        = icon('pencil')
-    - elsif current_user
-      %span.report-abuse
-        - if @user.abuse_report
-          %button.btn.btn-danger{ title: 'Already reported for abuse',
-            data: { toggle: 'tooltip', placement: 'left', container: 'body' }}
-            = icon('exclamation-circle')
-        - else
-          = link_to new_abuse_report_path(user_id: @user.id, ref_url: request.referrer), class: 'btn btn-gray',
-            title: 'Report abuse', data: {toggle: 'tooltip', placement: 'left', container: 'body'} do
-            = icon('exclamation-circle')
-    - if current_user
-       
-      = link_to user_path(@user, :atom, { private_token: current_user.private_token }), class: 'btn btn-gray' do
-        = icon('rss')
-
-  .avatar-holder
-    = link_to avatar_icon(@user, 400), target: '_blank' do
-      = image_tag avatar_icon(@user, 90), class: "avatar s90", alt: ''
-  .cover-title
-    = @user.name
-
-  .cover-desc
-    %span.middle-dot-divider
-      @#{@user.username}
-    %span.middle-dot-divider
-      Member since #{@user.created_at.to_s(:medium)}
-
-  - if @user.bio.present?
-    .cover-desc
-      %p.profile-user-bio
-        = @user.bio
-
-  .cover-desc
-    - unless @user.public_email.blank?
-      .profile-link-holder.middle-dot-divider
-        = link_to @user.public_email, "mailto:#{@user.public_email}"
-    - unless @user.skype.blank?
-      .profile-link-holder.middle-dot-divider
-        = link_to "skype:#{@user.skype}", title: "Skype" do
-          = icon('skype')
-    - unless @user.linkedin.blank?
-      .profile-link-holder.middle-dot-divider
-        = link_to "https://www.linkedin.com/in/#{@user.linkedin}", title: "LinkedIn" do
-          = icon('linkedin-square')
-    - unless @user.twitter.blank?
-      .profile-link-holder.middle-dot-divider
-        = link_to "https://twitter.com/#{@user.twitter}", title: "Twitter" do
-          = icon('twitter-square')
-    - unless @user.website_url.blank?
-      .profile-link-holder.middle-dot-divider
-        = link_to @user.short_website_url, @user.full_website_url
-    - unless @user.location.blank?
-      .profile-link-holder.middle-dot-divider
-        = icon('map-marker')
-        = @user.location
-
-  %ul.nav-links.center
-    %li.activity-tab
-      = link_to user_calendar_activities_path, data: {target: 'div#activity', action: 'activity', toggle: 'tab'} do
-        Activity
-    %li.groups-tab
-      = link_to user_groups_path, data: {target: 'div#groups', action: 'groups', toggle: 'tab'} do
-        Groups
-    %li.contributed-tab
-      = link_to user_contributed_projects_path, data: {target: 'div#contributed', action: 'contributed', toggle: 'tab'} do
-        Contributed projects
-    %li.projects-tab
-      = link_to user_projects_path, data: {target: 'div#projects', action: 'projects', toggle: 'tab'} do
-        Personal projects
-
-%div{ class: container_class }
-  .tab-content
-    #activity.tab-pane
-      .gray-content-block.white.second-block
-        %div{ class: container_class }
-          .user-calendar{data: {href: user_calendar_path}}
-            %h4.center.light
-              %i.fa.fa-spinner.fa-spin
-        .user-calendar-activities
-
-      .content_list{ data: {href: user_path} }
-      = spinner
-
-    #groups.tab-pane
-      - # This tab is always loaded via AJAX
+.user-profile
+  .cover-block
+    .cover-controls
+      - if @user == current_user
+        = link_to profile_path, class: 'btn btn-gray' do
+          = icon('pencil')
+      - elsif current_user
+        %span.report-abuse
+          - if @user.abuse_report
+            %button.btn.btn-danger{ title: 'Already reported for abuse',
+              data: { toggle: 'tooltip', placement: 'left', container: 'body' }}
+              = icon('exclamation-circle')
+          - else
+            = link_to new_abuse_report_path(user_id: @user.id, ref_url: request.referrer), class: 'btn btn-gray',
+              title: 'Report abuse', data: {toggle: 'tooltip', placement: 'left', container: 'body'} do
+              = icon('exclamation-circle')
+      - if current_user
+         
+        = link_to user_path(@user, :atom, { private_token: current_user.private_token }), class: 'btn btn-gray' do
+          = icon('rss')
+
+    .avatar-holder
+      = link_to avatar_icon(@user, 400), target: '_blank' do
+        = image_tag avatar_icon(@user, 90), class: "avatar s90", alt: ''
+    .cover-title
+      = @user.name
 
-    #contributed.contributed-projects.tab-pane
-      - # This tab is always loaded via AJAX
+    .cover-desc
+      %span.middle-dot-divider
+        @#{@user.username}
+      %span.middle-dot-divider
+        Member since #{@user.created_at.to_s(:medium)}
 
-    #projects.tab-pane
-      - # This tab is always loaded via AJAX
+    - if @user.bio.present?
+      .cover-desc
+        %p.profile-user-bio
+          = @user.bio
 
-  .loading-status
-    = spinner
+    .cover-desc
+      - unless @user.public_email.blank?
+        .profile-link-holder.middle-dot-divider
+          = link_to @user.public_email, "mailto:#{@user.public_email}"
+      - unless @user.skype.blank?
+        .profile-link-holder.middle-dot-divider
+          = link_to "skype:#{@user.skype}", title: "Skype" do
+            = icon('skype')
+      - unless @user.linkedin.blank?
+        .profile-link-holder.middle-dot-divider
+          = link_to "https://www.linkedin.com/in/#{@user.linkedin}", title: "LinkedIn" do
+            = icon('linkedin-square')
+      - unless @user.twitter.blank?
+        .profile-link-holder.middle-dot-divider
+          = link_to "https://twitter.com/#{@user.twitter}", title: "Twitter" do
+            = icon('twitter-square')
+      - unless @user.website_url.blank?
+        .profile-link-holder.middle-dot-divider
+          = link_to @user.short_website_url, @user.full_website_url
+      - unless @user.location.blank?
+        .profile-link-holder.middle-dot-divider
+          = icon('map-marker')
+          = @user.location
+
+    %ul.nav-links.center.user-profile-nav
+      %li.activity-tab
+        = link_to user_calendar_activities_path, data: {target: 'div#activity', action: 'activity', toggle: 'tab'} do
+          Activity
+      %li.groups-tab
+        = link_to user_groups_path, data: {target: 'div#groups', action: 'groups', toggle: 'tab'} do
+          Groups
+      %li.contributed-tab
+        = link_to user_contributed_projects_path, data: {target: 'div#contributed', action: 'contributed', toggle: 'tab'} do
+          Contributed projects
+      %li.projects-tab
+        = link_to user_projects_path, data: {target: 'div#projects', action: 'projects', toggle: 'tab'} do
+          Personal projects
+
+  %div{ class: container_class }
+    .tab-content
+      #activity.tab-pane
+        .gray-content-block.white.second-block
+          %div{ class: container_class }
+            .user-calendar{data: {href: user_calendar_path}}
+              %h4.center.light
+                %i.fa.fa-spinner.fa-spin
+          .user-calendar-activities
+
+        .content_list{ data: {href: user_path} }
+        = spinner
+
+      #groups.tab-pane
+        - # This tab is always loaded via AJAX
+
+      #contributed.contributed-projects.tab-pane
+        - # This tab is always loaded via AJAX
+
+      #projects.tab-pane
+        - # This tab is always loaded via AJAX
+
+    .loading-status
+      = spinner
 
 :javascript
   var userProfile;