Cleanup the fork layout

- Cleans the fork project layout by removing the grid & reverting back
to full flexbox to allow for the layout to correctly expand.
- Removes duplicated markup
- Fixes a bug where the forked project would trigger the load indicator

1 files changed, 31 insertions, 46 deletions

diff --git a/app/views/projects/forks/new.html.haml b/app/views/projects/forks/new.html.haml
index 906774a21e3..d17cdbd5612 100644
--- a/app/views/projects/forks/new.html.haml
+++ b/app/views/projects/forks/new.html.haml
@@ -9,50 +9,35 @@
       %br
       Forking a repository allows you to make changes without affecting the original project.
   .col-lg-9
-    .fork-namespaces
-      - if @namespaces.present?
-        %label.label-light
-          %span
-            Click to fork the project
-          - @namespaces.in_groups_of(6, false) do |group|
-            .row
-              - group.each do |namespace|
-                - avatar = namespace_icon(namespace, 100)
-                - if fork = namespace.find_fork_of(@project)
-                  .fork-thumbnail.forked
-                    = link_to project_path(fork) do
-                      - if /no_((\w*)_)*avatar/.match(avatar)
-                        .no-avatar
-                          = icon 'question'
-                      - else
-                        = image_tag avatar
-                      .caption
-                        = namespace.human_name
-                - else
-                  - can_create_project = current_user.can?(:create_projects, namespace)
-                  .fork-thumbnail{ class: ("disabled" unless can_create_project) }
-                    = link_to project_forks_path(@project, namespace_key: namespace.id),
-                        method: "POST",
-                        class: ("disabled has-tooltip" unless can_create_project),
-                        title: (_('You have reached your project limit') unless can_create_project) do
-                      - if /no_((\w*)_)*avatar/.match(avatar)
-                        .no-avatar
-                          = icon 'question'
-                      - else
-                        = image_tag avatar
-                      .caption
-                        = namespace.human_name
-      - else
-        %label.label-light
-          %span
-            No available namespaces to fork the project.
-            %br
-            %small
-              You must have permission to create a project in a namespace before forking.
+    - if @namespaces.present?
+      .fork-thumbnail-container.js-fork-content
+        %h5.prepend-top-0.append-bottom-0.prepend-left-default.append-right-default
+          Click to fork the project
+        - @namespaces.each do |namespace|
+          - avatar = namespace_icon(namespace, 100)
+          - can_create_project = current_user.can?(:create_projects, namespace)
+          - forked_project = namespace.find_fork_of(@project)
+          - fork_path = forked_project ? project_path(forked_project) : project_forks_path(@project, namespace_key: namespace.id)
+          .bordered-box.fork-thumbnail.text-center.prepend-left-default.append-right-default.prepend-top-default.append-bottom-default{ class: [("disabled" unless can_create_project), ("forked" if forked_project)] }
+            = link_to fork_path,
+                class: [("js-fork-thumbnail" unless forked_project), ("disabled has-tooltip" unless can_create_project)],
+                title: (_('You have reached your project limit') unless can_create_project) do
+              - if /no_((\w*)_)*avatar/.match(avatar)
+                = project_identicon(namespace, class: "avatar s100 identicon")
+              - else
+                .avatar-container.s100
+                  = image_tag(avatar, class: "avatar s100")
+              %h5.prepend-top-default
+                = namespace.human_name
+    - else
+      %strong
+        No available namespaces to fork the project.
+      %p.prepend-top-default
+        You must have permission to create a project in a namespace before forking.
 
-    .save-project-loader.hide
-      .center
-        %h2
-          %i.fa.fa-spinner.fa-spin
-          Forking repository
-        %p Please wait a moment, this page will automatically refresh when ready.
+    .save-project-loader.hide.js-fork-content
+      %h2.text-center
+        = icon('spinner spin')
+        Forking repository
+      %p.text-center
+        Please wait a moment, this page will automatically refresh when ready.