Build ci/lint page

- Includes new image from gitlab-svgs
- Updates dependency for svgs

app/assets/stylesheets/pages/lint.scss

-.ci-body {
-  .incorrect-syntax {
-    font-size: 18px;
-    color: $lint-incorrect-color;
-  }
-
-  .correct-syntax {
-    font-size: 18px;
-    color: $lint-correct-color;
-  }
+.ci-linter-container {
+  align-items: center;
+  display: flex;
+  height: calc(100vh - #{$header-height + $performance-bar-height});
+  justify-content: center;
+  text-align: center;
 }
 
-.ci-linter {
-  .ci-editor {
-    height: 400px;
-  }
+.ci-linter-inner {
+  width: auto;
+}
 
-  .ci-template pre {
-    white-space: pre-wrap;
-  }
+.ci-linter-description {
+  color: $common-gray-light;
+  width: 500px;
 }

app/assets/stylesheets/pages/projects.scss

@@ -1121,3 +1121,25 @@ pre.light-well {
   padding-top: $gl-padding;
   padding-bottom: 37px;
 }
+
+.project-ci-body {
+  .incorrect-syntax {
+    font-size: 18px;
+    color: $lint-incorrect-color;
+  }
+
+  .correct-syntax {
+    font-size: 18px;
+    color: $lint-correct-color;
+  }
+}
+
+.project-ci-linter {
+  .ci-editor {
+    height: 400px;
+  }
+
+  .ci-template pre {
+    white-space: pre-wrap;
+  }
+}

app/controllers/projects/settings/ci_cd_controller.rb

@@ -29,12 +29,12 @@ module Projects
         @project_runners = @project.runners.ordered
         @assignable_runners = current_user.ci_authorized_runners
           .assignable_for(project).ordered.page(params[:page]).per(20)
-        @shared_runners = Ci::Runner.shared.active
+        @shared_runners = ::Ci::Runner.shared.active
         @shared_runners_count = @shared_runners.count(:all)
       end
 
       def define_secret_variables
-        @variable = Ci::Variable.new(project: project)
+        @variable = ::Ci::Variable.new(project: project)
           .present(current_user: current_user)
         @variables = project.variables.order_key_asc
           .map { |variable| variable.present(current_user: current_user) }
@@ -42,7 +42,7 @@ module Projects
 
       def define_triggers_variables
         @triggers = @project.triggers
-        @trigger = Ci::Trigger.new
+        @trigger = ::Ci::Trigger.new
       end
 
       def define_badges_variables

app/views/ci/lints/show.html.haml

-- page_title "CI Lint"
-
-.center
+.ci-linter-container
+  .ci-linter-inner
     = image_tag 'illustrations/feature_moved.svg'
     %h3 GitLab CI Linter has been moved
-  %p To validate your GitLab CI configurations, go to 'CI/CD → Pipelines' inside your project, and click on the "CI Lint" button.
+    %p.ci-linter-description To validate your GitLab CI configurations, go to 'CI/CD → Pipelines' inside your project, and click on the 'CI Lint' button.

app/views/projects/ci/lints/show.html.haml

@@ -5,7 +5,7 @@
 
 %h2 Check your .gitlab-ci.yml
 
-.ci-linter
+.project-ci-linter
   .row
     = form_tag project_ci_lint_path(@project), method: :post do
       .form-group
@@ -23,5 +23,5 @@
 
   .row.prepend-top-20
     .col-sm-12
-      .results.ci-template
+      .results.project-ci-template
         = render partial: 'create' if defined?(@status)

spec/views/projects/ci/lints/show.html.haml_spec.rb

@@ -3,10 +3,9 @@ require 'spec_helper'
 describe 'projects/ci/lints/show' do
   include Devise::Test::ControllerHelpers
   let(:project) { create(:project, :repository) }
-
-  describe 'XSS protection' do
   let(:config_processor) { Gitlab::Ci::YamlProcessor.new(YAML.dump(content)) }
 
+  describe 'XSS protection' do
     before do
       assign(:project, project)
       assign(:status, true)
@@ -50,6 +49,7 @@ describe 'projects/ci/lints/show' do
     end
   end
 
+  context 'when the content is valid' do
     let(:content) do
       {
         build_template: {
@@ -62,9 +62,6 @@ describe 'projects/ci/lints/show' do
       }
     end
 
-  let(:config_processor) { Gitlab::Ci::YamlProcessor.new(YAML.dump(content)) }
-
-  context 'when the content is valid' do
     before do
       assign(:project, project)
       assign(:status, true)