Fade out border on scroll

app/assets/javascripts/layout_nav.js

@@ -48,12 +48,8 @@ import _ from 'underscore';
   });
   function applyScrollNavClass() {
-    if ($(window).scrollTop() > 0) {
-      $('.navbar-gitlab').addClass('scroll');
-    } else {
-      $('.navbar-gitlab').removeClass('scroll');
-    }
+    $('.navbar-border').css("opacity", $(window).scrollTop() / 40);
   }
-  $(window).scroll( _.throttle(applyScrollNavClass, 250));
+  $(window).scroll( _.throttle(applyScrollNavClass, 100));
 }).call(window);

app/assets/stylesheets/framework/header.scss

@@ -23,7 +23,6 @@ header {
   }
   &.navbar-gitlab {
-    @include transition(border-color 150ms ease-in-out);
     padding: 0 16px;
     z-index: 100;
     margin-bottom: 0;
@@ -43,10 +42,6 @@ header {
       border-color: transparent;
     }
-    &.scroll {
-      border-color: $border-color;
-    }
-
     .container-fluid {
       width: 100% !important;
       filter: none;
@@ -118,6 +113,16 @@ header {
     }
   }
+  .navbar-border {
+    height: 1px;
+    position: fixed;
+    left: 0;
+    right: 0;
+    top: 50px;
+    background-color: $border-color;
+    opacity: 0;
+  }
+
   .global-dropdown {
     position: absolute;
     left: -10px;

app/views/layouts/header/_default.html.haml

 %header.navbar.navbar-gitlab{ class: nav_header_class }
+  .navbar-border
   %a.sr-only.gl-accessibility{ href: "#content-body", tabindex: "1" } Skip to content
   .container-fluid
     .header-content

app/views/shared/issuable/_sidebar.html.haml

@@ -4,6 +4,7 @@
   = page_specific_javascript_bundle_tag('sidebar')
 %aside.right-sidebar.js-right-sidebar{ data: { "offset-top" => "50", "spy" => "affix" }, class: sidebar_gutter_collapsed_class, 'aria-live' => 'polite' }
+  .issuable-sidebar{ data: { endpoint: "#{issuable_json_path(issuable)}" } }
     - can_edit_issuable = can?(current_user, :"admin_#{issuable.to_ability_name}", @project)
     .block.issuable-sidebar-header
       - if current_user