Perform compositional styling to "getting started"

app/assets/stylesheets/getting-started.scss

@@ -1,7 +1,7 @@
 #hello-there {
   .avatar {
-    width: 50px;
-    height: 50px;
+    width: 200px;
+    height: 200px;
   }
 
   .well .media{
@@ -21,16 +21,12 @@
     margin-top: 80px;
   }
 
-  p, form {
-    margin-left: 30px;
-  }
-
   ul.as-selections {
     width: 100%;
-
     li.as-original {
       width: 100%;
       input {
+        height: 32px;
         margin-bottom: 15px;
       }
     }

app/views/photos/_new_profile_photo.haml

@@ -45,7 +45,7 @@
           var oldPhoto = $('#photo_id');
           if(oldPhoto.length == 0) {
             $('#update_profile_form').prepend("<input type='hidden' value='" + id + "' id='photo_id' name='photo_id'/>");
-          }else{
+          } else {
             oldPhoto.val(id);
           }
 
@@ -59,10 +59,11 @@
 
 #profile_photo_upload
   = owner_image_tag(:thumb_large)
+  .small-horizontal-spacer
   .clearfix
-    .small-horizontal-spacer
-    #file-upload.btn.btn-primary.pull-right
-      =t('.upload')
+    .text-center
+      #file-upload.btn.btn-primary
+        =t('.upload')
 
   = image_tag('mobile-spinner.gif', :class => 'hidden', :style => "z-index:-1", :id => 'file-upload-spinner')
 

app/views/users/getting_started.haml

@@ -9,7 +9,9 @@
 
         = invited_by_message
 
-        %h2
+        .small-horizontal-spacer
+
+        %h3
           = t(".who_are_you")
 
         - if AppConfig.configured_services.include? :facebook
@@ -18,13 +20,15 @@
 
         = form_tag profile_path, method: :put, remote: true, id: 'edit_profile' do
           %fieldset
-            = label_tag 'profile[first_name]', t('profiles.edit.your_name')
-            = text_field_tag 'profile[first_name]', current_user.first_name, class: "form-control"
-            = image_tag 'ajax-loader2.gif', id: "gs-name-form-spinner", class: "hidden"
-            = label_tag :your_photo, t('profiles.edit.your_photo')
-            = render 'photos/new_profile_photo', aspect: :getting_started, person: current_user.person
+            .form-group
+              = label_tag 'profile[first_name]', t('profiles.edit.your_name')
+              = text_field_tag 'profile[first_name]', current_user.first_name, class: "form-control"
+            .form-group
+              = image_tag 'ajax-loader2.gif', id: "gs-name-form-spinner", class: "hidden"
+              = label_tag :your_photo, t('profiles.edit.your_photo')
+              = render 'photos/new_profile_photo', aspect: :getting_started, person: current_user.person
 
-        %h2
+        %h3
           = t('.what_are_you_in_to')
 
         %p
@@ -35,6 +39,5 @@
             = label_tag 'follow_tags', t('.hashtag_suggestions')
             #tags_list
               = text_field_tag 'follow_tags', nil, class: "nostrap form-control"
-
-        .awesome
-          = link_to "#{t('.awesome_take_me_to_diaspora')} »", stream_path, id: "awesome_button", class: "btn"
+        .text-center
+          = link_to "#{t('.awesome_take_me_to_diaspora')} >>", stream_path, id: "awesome_button", class: "btn btn-default btn-lg btn-primary"

app/views/users/getting_started.mobile.haml

@@ -63,7 +63,7 @@
         %span.saved{class: "hidden"}
           = image_tag "mobile/check_yes_ok.png"
           = t(".saved")
-
+        .clearfix.visible-xs-block
         = label_tag :your_photo, t('profiles.edit.your_photo'), class: "bootstrapped"
         = render 'photos/new_profile_photo', aspect: :getting_started, person: current_user.person