Merge branch '29880-refactor-sidebar-hacks' into 'master'

Resolve "Move sub_nav content above the content-wrapper class"

Closes #29880

See merge request !10163

app/assets/stylesheets/framework/nav.scss

@@ -416,14 +416,16 @@
 
 .page-with-layout-nav {
   .right-sidebar {
-    top: ($header-height * 2) + 2;
+    top: ($header-height + 1) * 2;
   }
 
-  .build-sidebar {
-    top: ($header-height * 3) + 3;
+  &.page-with-sub-nav {
+    .right-sidebar {
+      top: ($header-height + 1) * 3;
 
-    &.affix {
-      top: 0;
+      &.affix {
+        top: 0;
+      }
     }
   }
 }

app/assets/stylesheets/pages/builds.scss

@@ -366,9 +366,3 @@
   right: 0;
   margin-top: -17px;
 }
-
-@media (min-width: $screen-md-min) {
-  .sub-nav.build {
-    width: calc(100% + #{$gutter_width});
-  }
-}

app/helpers/nav_helper.rb

@@ -31,7 +31,11 @@ module NavHelper
   end
 
   def layout_nav_class
-    "page-with-layout-nav" if defined?(nav) && nav
+    class_name = ''
+    class_name << " page-with-layout-nav" if defined?(nav) && nav
+    class_name << " page-with-sub-nav" if content_for?(:sub_nav)
+
+    class_name
   end
 
   def nav_control_class

app/views/layouts/_page.html.haml

@@ -3,8 +3,9 @@
     .layout-nav
       .container-fluid
         = render "layouts/nav/#{nav}"
-  .content-wrapper{ class: "#{layout_nav_class}" }
+  - if content_for?(:sub_nav)
     = yield :sub_nav
+  .content-wrapper{ class: layout_nav_class }
     .alert-wrapper
       = render "layouts/broadcast"
       = render "layouts/flash"

app/views/projects/builds/_sidebar.html.haml

 - builds = @build.pipeline.builds.to_a
 
-%aside.right-sidebar.right-sidebar-expanded.build-sidebar.js-build-sidebar.js-right-sidebar{ data: { "offset-top" => "151", "spy" => "affix" } }
+%aside.right-sidebar.right-sidebar-expanded.build-sidebar.js-build-sidebar.js-right-sidebar{ data: { "offset-top" => "153", "spy" => "affix" } }
   .block.build-sidebar-header.visible-xs-block.visible-sm-block.append-bottom-default
     Job
     %strong ##{@build.id}

app/views/projects/builds/show.html.haml

 - @no_container = true
 - page_title "#{@build.name} (##{@build.id})", "Jobs"
-= render "projects/pipelines/head", build_subnav: true
+= render "projects/pipelines/head"
 
 %div{ class: container_class }
   .build-page

app/views/projects/pipelines/_head.html.haml

 = content_for :sub_nav do
   .scrolling-tabs-container.sub-nav-scroll
     = render 'shared/nav_scroll'
-    .nav-links.sub-nav.scrolling-tabs{ class: ('build' if local_assigns.fetch(:build_subnav, false)) }
+    .nav-links.sub-nav.scrolling-tabs
       %ul{ class: (container_class) }
         - if project_nav_tab? :pipelines
           = nav_link(path: 'pipelines#index', controller: :pipelines) do

app/views/projects/wikis/_sidebar.html.haml

-%aside.right-sidebar.right-sidebar-expanded.wiki-sidebar.js-wiki-sidebar.js-right-sidebar{ data: { "offset-top" => "101", "spy" => "affix" } }
+%aside.right-sidebar.right-sidebar-expanded.wiki-sidebar.js-wiki-sidebar.js-right-sidebar{ data: { "offset-top" => "102", "spy" => "affix" } }
   .block.wiki-sidebar-header.append-bottom-default
     %a.gutter-toggle.pull-right.visible-xs-block.visible-sm-block.js-sidebar-wiki-toggle{ href: "#" }
       = icon('angle-double-right')

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

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

spec/features/projects/members/user_requests_access_spec.rb

@@ -61,7 +61,7 @@ feature 'Projects > Members > User requests access', feature: true do
       click_link('Settings')
     end
 
-    page.within('.page-with-layout-nav .sub-nav') do
+    page.within('.sub-nav') do
       click_link('Members')
     end
   end