remove nicescroll from jobs page and remove the library from common.bundle.js

7 files changed, 98 insertions, 101 deletions

diff --git a/app/assets/javascripts/build.js b/app/assets/javascripts/build.js
index b3d3bbcf84f..940326dcd33 100644
--- a/app/assets/javascripts/build.js
+++ b/app/assets/javascripts/build.js
@@ -164,7 +164,6 @@ window.Build = (function () {
 
   Build.prototype.initSidebar = function () {
     this.$sidebar = $('.js-build-sidebar');
-    this.$sidebar.niceScroll();
   };
 
   Build.prototype.getBuildTrace = function () {
diff --git a/app/assets/javascripts/commons/jquery.js b/app/assets/javascripts/commons/jquery.js
index b53f6284afc..b93e94a3c97 100644
--- a/app/assets/javascripts/commons/jquery.js
+++ b/app/assets/javascripts/commons/jquery.js
@@ -6,6 +6,5 @@ import 'vendor/jquery.endless-scroll';
 import 'vendor/jquery.caret';
 import 'vendor/jquery.atwho';
 import 'vendor/jquery.scrollTo';
-import 'vendor/jquery.nicescroll';
 import 'vendor/jquery.waitforimages';
 import 'select2/select2';
diff --git a/app/assets/stylesheets/framework/layout.scss b/app/assets/stylesheets/framework/layout.scss
index 67c3287ed74..0d8827bec11 100644
--- a/app/assets/stylesheets/framework/layout.scss
+++ b/app/assets/stylesheets/framework/layout.scss
@@ -109,16 +109,8 @@ body {
   }
 }
 
-
-/* The following prevents side effects related to iOS Safari's implementation of -webkit-overflow-scrolling: touch,
-which is applied to the body by jquery.nicescroling plugin to force hardware acceleration for momentum scrolling. Side
-effects are commonly related to inconsisent z-index behavior (e.g. tooltips). By applying the following to direct children
-of the body element here, we negate cascading side effects but allow momentum scrolling to be applied to the body  */
-
-.navbar,
-.page-gutter,
-.page-with-sidebar {
-  -webkit-overflow-scrolling: auto;
+.page-with-sidebar > .content-wrapper {
+  min-height: calc(100vh - #{$header-height});
 }
 
 .with-performance-bar .page-with-sidebar {
diff --git a/app/assets/stylesheets/framework/sidebar.scss b/app/assets/stylesheets/framework/sidebar.scss
index 09b60ad1676..40e8a928e6e 100644
--- a/app/assets/stylesheets/framework/sidebar.scss
+++ b/app/assets/stylesheets/framework/sidebar.scss
@@ -78,15 +78,12 @@
 
 .right-sidebar {
   border-left: 1px solid $border-color;
+  height: calc(100% - #{$header-height});
 
   &.affix {
     position: fixed;
     top: $header-height;
   }
-
-  &:not(.affix-top) {
-    min-height: 100%;
-  }
 }
 
 .with-performance-bar .right-sidebar.affix {
diff --git a/app/assets/stylesheets/new_sidebar.scss b/app/assets/stylesheets/new_sidebar.scss
index 3d202183c82..bfe4d249b7d 100644
--- a/app/assets/stylesheets/new_sidebar.scss
+++ b/app/assets/stylesheets/new_sidebar.scss
@@ -21,7 +21,7 @@ $new-sidebar-width: 220px;
   // Override position: absolute
   .right-sidebar {
     position: fixed;
-    height: 100%;
+    height: calc(100% - #{$header-height});
   }
 
   .issues-bulk-update.right-sidebar.right-sidebar-expanded .issuable-sidebar-header {
diff --git a/app/assets/stylesheets/pages/builds.scss b/app/assets/stylesheets/pages/builds.scss
index 214372928d8..fc77e119edb 100644
--- a/app/assets/stylesheets/pages/builds.scss
+++ b/app/assets/stylesheets/pages/builds.scss
@@ -235,6 +235,15 @@
     display: none;
   }
 
+  .sidebar-container {
+    width: calc(100% + 100px);
+    padding-right: 100px;
+    height: 100%;
+    overflow-y: scroll;
+    overflow-x: hidden;
+    -webkit-overflow-scrolling: touch;
+  }
+
   .blocks-container {
     padding: 0 $gl-padding;
   }
diff --git a/app/views/projects/jobs/_sidebar.html.haml b/app/views/projects/jobs/_sidebar.html.haml
index c876c419664..99f4b30d085 100644
--- a/app/views/projects/jobs/_sidebar.html.haml
+++ b/app/views/projects/jobs/_sidebar.html.haml
@@ -1,100 +1,101 @@
 - builds = @build.pipeline.builds.to_a
 
 %aside.right-sidebar.right-sidebar-expanded.build-sidebar.js-build-sidebar.js-right-sidebar{ data: { "offset-top" => "101", "spy" => "affix" } }
-  .blocks-container
-    .block
-      %strong
-        = @build.name
-      %a.gutter-toggle.pull-right.visible-xs-block.visible-sm-block.js-sidebar-build-toggle{ href: "#", 'aria-label': 'Toggle Sidebar', role: 'button' }
-        = icon('angle-double-right')
-
-    #js-details-block-vue
-
-    - if can?(current_user, :read_build, @project) && (@build.artifacts? || @build.artifacts_expired?)
+  .sidebar-container
+    .blocks-container
       .block
-        .title
-          Job artifacts
-        - if @build.artifacts_expired?
-          %p.build-detail-row
-            The artifacts were removed
-            #{time_ago_with_tooltip(@build.artifacts_expire_at)}
-        - elsif @build.has_expiring_artifacts?
-          %p.build-detail-row
-            The artifacts will be removed in
-            %span.js-artifacts-remove= @build.artifacts_expire_at
+        %strong
+          = @build.name
+        %a.gutter-toggle.pull-right.visible-xs-block.visible-sm-block.js-sidebar-build-toggle{ href: "#", 'aria-label': 'Toggle Sidebar', role: 'button' }
+          = icon('angle-double-right')
 
-        - if @build.artifacts?
-          .btn-group.btn-group-justified{ role: :group }
-            - if @build.has_expiring_artifacts? && can?(current_user, :update_build, @build)
-              = link_to keep_project_job_artifacts_path(@project, @build), class: 'btn btn-sm btn-default', method: :post do
-                Keep
+      #js-details-block-vue
 
-            = link_to download_project_job_artifacts_path(@project, @build), rel: 'nofollow', download: '', class: 'btn btn-sm btn-default' do
-              Download
+      - if can?(current_user, :read_build, @project) && (@build.artifacts? || @build.artifacts_expired?)
+        .block
+          .title
+            Job artifacts
+          - if @build.artifacts_expired?
+            %p.build-detail-row
+              The artifacts were removed
+              #{time_ago_with_tooltip(@build.artifacts_expire_at)}
+          - elsif @build.has_expiring_artifacts?
+            %p.build-detail-row
+              The artifacts will be removed in
+              %span.js-artifacts-remove= @build.artifacts_expire_at
 
-            - if @build.artifacts_metadata?
-              = link_to browse_project_job_artifacts_path(@project, @build), class: 'btn btn-sm btn-default' do
-                Browse
+          - if @build.artifacts?
+            .btn-group.btn-group-justified{ role: :group }
+              - if @build.has_expiring_artifacts? && can?(current_user, :update_build, @build)
+                = link_to keep_project_job_artifacts_path(@project, @build), class: 'btn btn-sm btn-default', method: :post do
+                  Keep
 
-    - if @build.trigger_request
-      .build-widget.block
-        %h4.title
-          Trigger
+              = link_to download_project_job_artifacts_path(@project, @build), rel: 'nofollow', download: '', class: 'btn btn-sm btn-default' do
+                Download
 
-        %p
-          %span.build-light-text Token:
-          #{@build.trigger_request.trigger.short_token}
+              - if @build.artifacts_metadata?
+                = link_to browse_project_job_artifacts_path(@project, @build), class: 'btn btn-sm btn-default' do
+                  Browse
+
+      - if @build.trigger_request
+        .build-widget.block
+          %h4.title
+            Trigger
 
-        - if @build.trigger_request.variables
           %p
-            %button.btn.group.btn-group-justified.reveal-variables Reveal Variables
+            %span.build-light-text Token:
+            #{@build.trigger_request.trigger.short_token}
+
+          - if @build.trigger_request.variables
+            %p
+              %button.btn.group.btn-group-justified.reveal-variables Reveal Variables
 
-          %dl.js-build-variables.trigger-build-variables.hide
-            - @build.trigger_request.variables.each do |key, value|
-              %dt.js-build-variable.trigger-build-variable= key
-              %dd.js-build-value.trigger-build-value= value
+            %dl.js-build-variables.trigger-build-variables.hide
+              - @build.trigger_request.variables.each do |key, value|
+                %dt.js-build-variable.trigger-build-variable= key
+                %dd.js-build-value.trigger-build-value= value
 
-    %div{ class: (@build.pipeline.stages_count > 1 ? "block" : "block-last") }
-      %p
-        Commit
-        = link_to @build.pipeline.short_sha, project_commit_path(@project, @build.pipeline.sha), class: 'commit-sha link-commit'
-        = clipboard_button(text: @build.pipeline.short_sha, title: "Copy commit SHA to clipboard")
-        - if @build.merge_request
-          in
-          = link_to "#{@build.merge_request.to_reference}", merge_request_path(@build.merge_request), class: 'link-commit'
+      %div{ class: (@build.pipeline.stages_count > 1 ? "block" : "block-last") }
+        %p
+          Commit
+          = link_to @build.pipeline.short_sha, project_commit_path(@project, @build.pipeline.sha), class: 'commit-sha link-commit'
+          = clipboard_button(text: @build.pipeline.short_sha, title: "Copy commit SHA to clipboard")
+          - if @build.merge_request
+            in
+            = link_to "#{@build.merge_request.to_reference}", merge_request_path(@build.merge_request), class: 'link-commit'
 
-      %p.build-light-text.append-bottom-0
-        #{@build.pipeline.git_commit_title}
+        %p.build-light-text.append-bottom-0
+          #{@build.pipeline.git_commit_title}
 
-    - if @build.pipeline.stages_count > 1
-      .dropdown.build-dropdown
-        %div
-          %span{ class: "ci-status-icon-#{@build.pipeline.status}" }
-            = ci_icon_for_status(@build.pipeline.status)
-          Pipeline
-          = link_to "##{@build.pipeline.id}", project_pipeline_path(@project, @build.pipeline), class: 'link-commit'
-          from
-          = link_to "#{@build.pipeline.ref}", project_branch_path(@project, @build.pipeline.ref), class: 'link-commit'
-        %button.dropdown-menu-toggle{ type: 'button', 'data-toggle' => 'dropdown' }
-          %span.stage-selection More
-          = icon('chevron-down')
-        %ul.dropdown-menu
-          - @build.pipeline.legacy_stages.each do |stage|
-            %li
-              %a.stage-item= stage.name
+      - if @build.pipeline.stages_count > 1
+        .block-last.dropdown.build-dropdown
+          %div
+            %span{ class: "ci-status-icon-#{@build.pipeline.status}" }
+              = ci_icon_for_status(@build.pipeline.status)
+            Pipeline
+            = link_to "##{@build.pipeline.id}", project_pipeline_path(@project, @build.pipeline), class: 'link-commit'
+            from
+            = link_to "#{@build.pipeline.ref}", project_branch_path(@project, @build.pipeline.ref), class: 'link-commit'
+          %button.dropdown-menu-toggle{ type: 'button', 'data-toggle' => 'dropdown' }
+            %span.stage-selection More
+            = icon('chevron-down')
+          %ul.dropdown-menu
+            - @build.pipeline.legacy_stages.each do |stage|
+              %li
+                %a.stage-item= stage.name
 
-  .builds-container
-    - HasStatus::ORDERED_STATUSES.each do |build_status|
-      - builds.select{|build| build.status == build_status}.each do |build|
-        .build-job{ class: sidebar_build_class(build, @build), data: { stage: build.stage } }
-          = link_to project_job_path(@project, build) do
-            = icon('arrow-right')
-            %span{ class: "ci-status-icon-#{build.status}" }
-              = ci_icon_for_status(build.status)
-            %span
-              - if build.name
-                = build.name
-              - else
-                = build.id
-            - if build.retried?
-              %i.fa.fa-refresh.has-tooltip{ data: { container: 'body', placement: 'bottom' }, title: 'Job was retried' }
+    .builds-container
+      - HasStatus::ORDERED_STATUSES.each do |build_status|
+        - builds.select{|build| build.status == build_status}.each do |build|
+          .build-job{ class: sidebar_build_class(build, @build), data: { stage: build.stage } }
+            = link_to project_job_path(@project, build) do
+              = icon('arrow-right')
+              %span{ class: "ci-status-icon-#{build.status}" }
+                = ci_icon_for_status(build.status)
+              %span
+                - if build.name
+                  = build.name
+                - else
+                  = build.id
+              - if build.retried?
+                %i.fa.fa-refresh.has-tooltip{ data: { container: 'body', placement: 'bottom' }, title: 'Job was retried' }