Improve usability of project edit page

app/assets/stylesheets/gitlab_bootstrap/blocks.scss

@@ -155,6 +155,9 @@
     padding-top: 20px;
     form {
       margin-bottom: 0;
+      legend {
+        text-indent: 10px;
+      }
       .form-actions {
         margin-bottom: 0;
       }

app/views/projects/_form.html.haml

@@ -1,9 +1,27 @@
-= form_for(@project, remote: true) do |f|
+.row
+  .span3
+    %ul.nav.nav-pills.nav-stacked
+      %li.active
+        = link_to 'Settings', '#tab-settings', 'data-toggle' => 'tab'
+      %li
+        = link_to 'Transfer', '#tab-transfer', 'data-toggle' => 'tab'
+      %li
+        = link_to 'Remove', '#tab-remove', 'data-toggle' => 'tab'
+
+  .span9
+    .tab-content
+      .tab-pane.active#tab-settings
+        .ui-box.white
+          %h5.title Settings:
+          .form-holder
+            = form_for(@project, remote: true) do |f|
               - if @project.errors.any?
                 .alert.alert-error
                   %ul
                     - @project.errors.full_messages.each do |msg|
                       %li= msg
+
+              %fieldset
                 .clearfix.project_name_holder
                   = f.label :name do
                     Project name is
@@ -23,9 +41,25 @@
                   .input
                     = f.text_area :description, placeholder: "awesome project", class: "xxlarge", rows: 3, maxlength: 250
 
-  %fieldset.features
-    %legend Features:
 
+              - if can?(current_user, :change_public_mode, @project)
+                %fieldset.public-mode
+                  %legend
+                    Public mode:
+                  .control-group
+                    = f.label :public, class: 'control-label' do
+                      %span Public clone access
+                    .controls
+                      = f.check_box :public
+                      %span.descr
+                        If checked, this project can be cloned
+                        %em without any
+                        authentification.
+                        It will also be listed on the #{link_to "public access directory", public_root_path}.
+
+              %fieldset.features
+                %legend
+                  Features:
                 .control-group
                   = f.label :issues_enabled, "Issues", class: 'control-label'
                   .controls
@@ -39,7 +73,7 @@
 
                   .clearfix
                     = f.label :issues_tracker_id, "Project name or id in issues tracker", class: 'control-label'
-        .input= f.text_field :issues_tracker_id, class: "xxlarge", disabled: !@project.can_have_issues_tracker_id?
+                    .input= f.text_field :issues_tracker_id, disabled: !@project.can_have_issues_tracker_id?
 
                 .control-group
                   = f.label :merge_requests_enabled, "Merge Requests", class: 'control-label'
@@ -59,44 +93,36 @@
                     = f.check_box :wiki_enabled
                     %span.descr Pages for project documentation
 
-  - if can?(current_user, :change_public_mode, @project)
+              .form-actions
-    %fieldset.features
+                = f.submit 'Save', class: "btn btn-save"
-      %legend
-        %i.icon-share
-        Public mode:
-      .control-group
-        = f.label :public, class: 'control-label' do
-          %span Public clone access
-        .controls
-          = f.check_box :public
-          %span.descr
-            If checked, this project can be cloned
-            %em without any
-            authentification.
-            It will also be listed on the #{link_to "public access directory", public_root_path}.
-
 
+      .tab-pane#tab-transfer
         - if can? current_user, :change_namespace, @project
-    %fieldset.features
+          .ui-box.ui-box-danger
-      %legend Transfer:
+            %h5.title Transfer project
+            .form-holder
+              = form_for(@project, remote: true, html: { class: 'transfer-project' }) do |f|
                 .control-group
                   = f.label :namespace_id do
                     %span Namespace
                   .controls
+                    .clearfix
                       = f.select :namespace_id, namespaces_options(@project.namespace_id || Namespace::global_id), {prompt: 'Choose a project namespace'}, {class: 'chosen'}
-          %br
+                    %ul
-          %ul.prepend-top-10.cred
                       %li Be careful. Changing project namespace can have unintended side effects
                       %li You can transfer project only to namespaces you can manage
                       %li You will need to update your local repositories to point to the new location.
+                .form-actions
+                  = f.submit 'Transfer', class: "btn btn-remove"
 
-
+      .tab-pane#tab-remove
-  %br
-
-  .actions
-    = f.submit 'Save', class: "btn btn-save"
-    = link_to 'Cancel', @project, class: "btn"
-    - unless @project.new_record?
         - if can?(current_user, :remove_project, @project)
-        .pull-right
+          .ui-box.ui-box-danger
-          = link_to 'Remove Project', @project, confirm: 'Removed project can not be restored! Are you sure?', method: :delete, class: "btn btn-remove"
+            %h5.title Remove project
+            .ui-box-body
+              %p
+                Remove of project will cause removing repository and all related resources like issues, merge requests etc.
+              %p
+                %strong Removed project can not be restored!
+
+              = link_to 'Remove project', @project, confirm: 'Removed project can not be restored! Are you sure?', method: :delete, class: "btn btn-remove btn-small"