6 files changed, 72 insertions, 13 deletions
diff --git a/app/assets/images/auth_buttons/signin_with_google.png b/app/assets/images/auth_buttons/signin_with_google.png
new file mode 100644
index 00000000000..b1327b4f7b4
--- /dev/null
+++ b/app/assets/images/auth_buttons/signin_with_google.png
diff --git a/app/views/projects/clusters/_form.html.haml b/app/views/projects/clusters/_form.html.haml
index 8d16f1ceedf..cf1a087ed13 100644
--- a/app/views/projects/clusters/_form.html.haml
+++ b/app/views/projects/clusters/_form.html.haml
@@ -1,4 +1,35 @@
-Create a new cluster
-%br
-= link_to "Create on Google Container Engine", namespace_project_clusters_path(@project.namespace, @project, cluster_name: "gke-test-creation#{Random.rand(100)}", gcp_project_id: 'gitlab-internal-153318', cluster_zone: 'us-central1-a', cluster_size: '1', project_namespace: 'aaa', machine_type: '???'), method: :post
--# gke-test-creation#{Random.rand(100)}
+.row
+  .col-sm-8.col-sm-offset-4
+    %p
+      -link_to_help_page = link_to(s_('ClusterIntegration|help page'), help_page_path('TODO'), target: '_blank', rel: 'noopener noreferrer')
+      = s_('ClusterIntegration|Use our %{link_to_help_page} on cluster integration.').html_safe % { link_to_help_page: link_to_help_page}
+
+      = form_for 'cluster' do |field|
+        .form-group
+          = field.label :cluster_name
+          = field.text_field :cluster_name, class: 'form-control'
+
+        .form-group
+          = field.label :gcp_project_id
+          = field.text_field :gcp_project_id, class: 'form-control'
+
+        .form-group
+          = field.label :cluster_zone
+          = field.text_field :cluster_zone, class: 'form-control'
+
+        .form-group
+          = field.label :cluster_size
+          = field.text_field :cluster_size, class: 'form-control'
+
+        .form-group
+          = field.label :project_namespace
+          = field.text_field :project_namespace, class: 'form-control'
+
+        .form-group
+          = field.label :machine_type
+          = field.text_field :machine_type, class: 'form-control'
+
+        .form-group
+          = field.submit s_('ClusterIntegration|Create cluster'), class: 'btn btn-save'
+
+          = link_to "Create on Google Container Engine", namespace_project_clusters_path(@project.namespace, @project, cluster_name: "gke-test-creation#{Random.rand(100)}", gcp_project_id: 'gitlab-internal-153318', cluster_zone: 'us-central1-a', cluster_size: '1', project_namespace: 'aaa', machine_type: '???'), method: :post
+\ No newline at end of file
diff --git a/app/views/projects/clusters/_header.html.haml b/app/views/projects/clusters/_header.html.haml
new file mode 100644
index 00000000000..52a123d603e
--- /dev/null
+++ b/app/views/projects/clusters/_header.html.haml
@@ -0,0 +1,15 @@
+.col-lg-8
+  %h4.prepend-top-0
+    = s_('ClusterIntegration|Create new cluster on Google Container Engine')
+  %p
+    = s_('ClusterIntegration|To create a new cluster on Google Container Engine, please sign in with your Google account:')
+  %ul
+    %li
+      - link_to_container_engine = link_to(s_('ClusterIntegration|access to Google Container Engine'))
+      = s_('ClusterIntegration|Your account must have %{link_to_container_engine}').html_safe % { link_to_container_engine: link_to_container_engine }
+      %li
+        - link_to_requirements = link_to(s_('ClusterIntegration|meets the requirements'))
+        = s_('ClusterIntegration|Make sure your account %{link_to_requirements} to create clusters').html_safe % { link_to_requirements: link_to_requirements }
+      %li
+        - link_to_container_project = link_to(s_('ClusterIntegration|Google Container Engine project'))
+        = s_('ClusterIntegration|A %{link_to_container_project} must have been created under this account').html_safe % { link_to_container_project: link_to_container_project }
+\ No newline at end of file
diff --git a/app/views/projects/clusters/_sidebar.html.haml b/app/views/projects/clusters/_sidebar.html.haml
new file mode 100644
index 00000000000..f2f9e04f80e
--- /dev/null
+++ b/app/views/projects/clusters/_sidebar.html.haml
@@ -0,0 +1,8 @@
+.col-sm-4
+  %h4.prepend-top-0
+    = s_('ClusterIntegration|Cluster integration')
+  %p
+    = s_('ClusterIntegration|With cluster integration you can take advantage of Kubernetes auto deployment.')
+  %p
+    - link = link_to(s_('ClusterIntegration|auto deployment'), help_page_path('TODO'), target: '_blank', rel: 'noopener noreferrer')
+    = s_('ClusterIntegration|Learn more about %{link_to_documentation} in GitLab').html_safe % { link_to_documentation: link }
+\ No newline at end of file
diff --git a/app/views/projects/clusters/login.html.haml b/app/views/projects/clusters/login.html.haml
index ddc909d12ca..ef6efc84ceb 100644
--- a/app/views/projects/clusters/login.html.haml
+++ b/app/views/projects/clusters/login.html.haml
@@ -1,6 +1,10 @@
-Login
-%br
-- if @authorize_url
-  = link_to("authenticate from here", @authorize_url)
-- else
-  You have not configrued GitLab properly. So we can not proceed authentication. Please check if you have set up omniauth->providers->google_oauth2 in gitlab.yml
+.row.prepend-top-default
+  = render 'sidebar'
+  = render 'header'
+.row
+  .col-sm-8.col-sm-offset-4
+    - if @authorize_url
+      %a{ href: @authorize_url }
+        = image_tag('auth_buttons/signin_with_google.png')
+    -# - else
+    -#   You have not configrued GitLab properly. So we can not proceed authentication. Please check if you have set up omniauth->providers->google_oauth2 in gitlab.yml
diff --git a/app/views/projects/clusters/new.html.haml b/app/views/projects/clusters/new.html.haml
index 7433f6759a0..e1ff4c6136e 100644
--- a/app/views/projects/clusters/new.html.haml
+++ b/app/views/projects/clusters/new.html.haml
@@ -1,3 +1,4 @@
-Create a cluster
-%br
-= render "form"
+.row.prepend-top-default
+  = render 'sidebar'
+  = render 'header'
+= render 'form'