updated a bunch of breadcrumb titles

[ci skip]

app/assets/stylesheets/new_nav.scss

@@ -1,6 +1,7 @@
 @import "framework/variables";
 @import 'framework/tw_bootstrap_variables';
 @import "bootstrap/variables";
+@import "framework/mixins";
 
 header.navbar-gitlab-new {
   color: $white-light;
@@ -293,45 +294,6 @@ header.navbar-gitlab-new {
   display: flex;
   min-height: 61px;
   color: $gl-text-color;
-  border-bottom: 1px solid $border-color;
-
-  .dropdown-toggle-caret {
-    position: relative;
-    top: -1px;
-    padding: 0 5px;
-    color: $gl-text-color-secondary;
-    font-size: 10px;
-    line-height: 1;
-    background: none;
-    border: 0;
-
-    &:focus {
-      outline: 0;
-    }
-  }
-
-  // TODO: fallback to global style
-  .dropdown-menu {
-    .divider {
-      margin: 6px 0;
-    }
-
-    li {
-      padding: 0 1px;
-
-      a {
-        border-radius: 0;
-        padding: 8px 16px;
-
-        &.is-focused,
-        &:hover,
-        &:active,
-        &:focus {
-          background-color: $gray-darker;
-        }
-      }
-    }
-  }
 }
 
 .breadcrumbs-container {
@@ -339,42 +301,14 @@ header.navbar-gitlab-new {
   width: 100%;
   position: relative;
   align-items: center;
-
-  .dropdown-menu-projects {
-    margin-top: -$gl-padding;
-    margin-left: $gl-padding;
-  }
+  border-bottom: 1px solid $border-color;
 }
 
 .breadcrumbs-links {
   flex: 1;
   min-width: 0;
   align-self: center;
-  color: $gl-text-color-quaternary;
-
-  a {
-    color: $gl-text-color-secondary;
-
-    &:not(:first-child),
-    &.group-path {
-      margin-left: 4px;
-    }
-
-    &:not(:last-of-type),
-    &.group-path {
-      margin-right: 3px;
-    }
-  }
-
-  .title {
-    display: inline-block;
-
-    > a {
-      &:last-of-type:not(:first-child) {
-        font-weight: 600;
-      }
-    }
-  }
+  color: $gl-text-color-secondary;
 
   .avatar-tile {
     margin-right: 5px;
@@ -409,13 +343,30 @@ header.navbar-gitlab-new {
   > li {
     display: flex;
     align-items: center;
+    position: relative;
+
+    &:not(:last-child) {
+      margin-right: 10px;
+    }
+
+    &:not(:first-child) {
+      margin-left: 10px;
+    }
   }
 
   a {
-    color: $gl-text-color;
+    @include str-truncated(128px);
+    color: currentColor;
   }
 }
 
+.breadcrumbs-list-angle {
+  position: absolute;
+  right: -12px;
+  top: 50%;
+  transform: translateY(-50%);
+}
+
 .breadcrumbs-extra {
   display: flex;
   flex: 0 0 auto;
@@ -425,8 +376,12 @@ header.navbar-gitlab-new {
 .breadcrumbs-sub-title {
   margin: 0;
   font-size: $gl-font-size;
-  font-weight: normal;
+  font-weight: 600;
   line-height: 1;
+
+  a {
+    color: $gl-text-color;
+  }
 }
 
 .top-area {

app/helpers/breadcrumbs_helper.rb

@@ -22,4 +22,12 @@ module BreadcrumbsHelper
 
     @breadcrumb_title = title
   end
+
+  def breadcrumb_list_item(link)
+    content_tag "li" do
+      output = link
+      output << icon("angle-right", class: "breadcrumbs-list-angle")
+      output
+    end
+  end
 end

app/helpers/groups_helper.rb

@@ -15,17 +15,27 @@ module GroupsHelper
     @has_group_title = true
     full_title = ''
 
-    group.ancestors.reverse.each do |parent|
-      full_title += group_title_link(parent, hidable: true)
-
-      full_title += '<span class="hidable"> / </span>'.html_safe
+    group.ancestors.reverse.each_with_index do |parent, index|
+      full_title += if show_new_nav?
+                      breadcrumb_list_item group_title_link(parent, hidable: index > 0)
+                    else
+                      group_title_link(parent, hidable: true)
+                    end
     end
 
-    full_title += group_title_link(group)
+    full_title += if show_new_nav?
+                    breadcrumb_list_item group_title_link(group)
+                  else
+                    group_title_link(group)
+                  end
     full_title += ' &middot; '.html_safe + link_to(simple_sanitize(name), url, class: 'group-path') if name
 
-    content_tag :span, class: 'group-title' do
+    if show_new_nav?
       full_title.html_safe
+    else
+      content_tag :span, class: 'group-title' do
+        full_title.html_safe
+      end
     end
   end
 

app/helpers/page_layout_helper.rb

@@ -80,7 +80,11 @@ module PageLayoutHelper
       @header_title     = title
       @header_title_url = title_url
     else
-      @header_title_url ? link_to(@header_title, @header_title_url) : @header_title
+      if show_new_nav?
+        @header_title_url ? breadcrumb_list_item(link_to(@header_title, @header_title_url)) : @header_title
+      else
+        @header_title_url ? link_to(@header_title, @header_title_url) : @header_title
+      end
     end
   end
 

app/helpers/projects_helper.rb

@@ -71,8 +71,8 @@ module ProjectsHelper
     end
 
     if show_new_nav?
-      namespace_link = content_tag "li", namespace_link
-      project_link = content_tag "li", project_link
+      namespace_link = breadcrumb_list_item(namespace_link) if project.group.nil?
+      project_link = breadcrumb_list_item project_link
     end
 
     if current_user && !show_new_nav?

app/views/groups/edit.html.haml

@@ -1,3 +1,4 @@
+- breadcrumb_title "General Settings"
 = render "groups/settings_head"
 .panel.panel-default.prepend-top-default
   .panel-heading

app/views/groups/projects.html.haml

@@ -1,3 +1,4 @@
+- breadcrumb_title "Projects"
 = render "groups/settings_head"
 
 .panel.panel-default.prepend-top-default

app/views/groups/settings/ci_cd/show.html.haml

@@ -1,4 +1,5 @@
-- page_title "Pipelines"
+- breadcrumb_title "CI / CD Settings"
+- page_title "CI / CD"
 = render "groups/settings_head"
 
 = render 'ci/variables/index'

app/views/groups/show.html.haml

@@ -1,5 +1,5 @@
 - @no_container = true
-- breadcrumb_title "Group"
+- breadcrumb_title "Details"
 
 = content_for :meta_tags do
   = auto_discovery_link_tag(:atom, group_url(@group, rss_url_options), title: "#{@group.name} activity")

app/views/layouts/nav/_breadcrumbs.html.haml

@@ -7,16 +7,17 @@
       = button_tag class: 'toggle-mobile-nav', type: 'button' do
         %span.sr-only Open sidebar
         = icon ('bars')
-      .breadcrumbs-links.js-title-container
-        %ul.list-unstyled.breadcrumbs-list
+    .breadcrumbs-links.js-title-container
+      %ul.list-unstyled.breadcrumbs-list
+        - unless hide_top_links
           - if content_for?(:header_title_before)
             %li= yield :header_title_before
           = header_title
           - if @breadcrumbs_extra_links
             - @breadcrumbs_extra_links.each do |extra|
               %li= link_to extra[:text], extra[:link]
-          %li
-            %h2.breadcrumbs-sub-title= link_to @breadcrumb_title, breadcrumb_link
+        %li
+          %h2.breadcrumbs-sub-title= link_to @breadcrumb_title, breadcrumb_link
     - if content_for?(:breadcrumbs_extra)
       .breadcrumbs-extra.hidden-xs= yield :breadcrumbs_extra
     = yield :header_content

app/views/profiles/show.html.haml

@@ -1,4 +1,4 @@
-- breadcrumb_title "Profile"
+- breadcrumb_title "Edit Profile"
 - @content_class = "limit-container-width" unless fluid_layout
 = render 'profiles/head'
 

app/views/projects/activity.html.haml

@@ -1,9 +1,7 @@
 - @no_container = true
 
-- if show_new_nav?
-  - add_to_breadcrumbs(_("Project"), project_path(@project))
-
 - page_title _("Activity")
+
 = render "projects/head"
 
 = render 'projects/last_push'

app/views/projects/boards/_show.html.haml

@@ -1,10 +1,8 @@
 - @no_container = true
 - @content_class = "issue-boards-content"
+- breadcrumb_title "Issue Board"
 - page_title "Boards"
 
-- if show_new_nav?
-  - add_to_breadcrumbs("Issues", project_issues_path(@project))
-
 - content_for :page_specific_javascripts do
   = webpack_bundle_tag 'common_vue'
   = webpack_bundle_tag 'filtered_search'

app/views/projects/branches/index.html.haml

@@ -2,9 +2,6 @@
 - page_title "Branches"
 = render "projects/commits/head"
 
-- if show_new_nav?
-  - add_to_breadcrumbs("Repository", project_tree_path(@project))
-
 %div{ class: container_class }
   .top-area.adjust
     - if can?(current_user, :admin_project, @project)

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

@@ -1,4 +1,5 @@
 - @no_container = true
+- breadcrumb_title "Commit #{@commit.short_id}"
 - container_class = !fluid_layout && diff_view == :inline ? 'container-limited' : ''
 - limited_container_width = fluid_layout ? '' : 'limit-container-width'
 - @content_class = limited_container_width

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

@@ -5,9 +5,6 @@
 = content_for :meta_tags do
   = auto_discovery_link_tag(:atom, project_commits_url(@project, @ref, rss_url_options), title: "#{@project.name}:#{@ref} commits")
 
-- if show_new_nav?
-  - add_to_breadcrumbs("Repository", project_tree_path(@project))
-
 = content_for :sub_nav do
   = render "head"
 

app/views/projects/compare/index.html.haml

@@ -1,7 +1,5 @@
 - @no_container = true
 - page_title "Compare"
-- if show_new_nav?
-  - add_to_breadcrumbs("Repository", project_tree_path(@project))
 = render "projects/commits/head"
 
 %div{ class: container_class }

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

@@ -1,8 +1,6 @@
 - @no_container = true
 - breadcrumb_title "Compare"
 - page_title "#{params[:from]}...#{params[:to]}"
-- if show_new_nav?
-  - add_to_breadcrumbs("Repository", project_tree_path(@project))
 = render "projects/commits/head"
 
 %div{ class: container_class }

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

@@ -1,7 +1,5 @@
 - @no_container = true
 - page_title "Cycle Analytics"
-- if show_new_nav?
-  - add_to_breadcrumbs("Project", project_path(@project))
 - content_for :page_specific_javascripts do
   = page_specific_javascript_bundle_tag('common_vue')
   = page_specific_javascript_bundle_tag('cycle_analytics')

app/views/projects/edit.html.haml

@@ -1,3 +1,4 @@
+- breadcrumb_title "General Settings"
 - page_title "General"
 - @content_class = "limit-container-width" unless fluid_layout
 - expanded = Rails.env.test?

app/views/projects/empty.html.haml

@@ -1,4 +1,5 @@
 - @no_container = true
+- breadcrumb_title "Details"
 
 = render partial: 'flash_messages', locals: { project: @project }
 

app/views/projects/environments/index.html.haml

@@ -2,9 +2,6 @@
 - page_title "Environments"
 = render "projects/pipelines/head"
 
-- if show_new_nav?
-  - add_to_breadcrumbs("Pipelines", project_pipelines_path(@project))
-
 - content_for :page_specific_javascripts do
   = page_specific_javascript_bundle_tag('common_vue')
   = page_specific_javascript_bundle_tag("environments")

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

@@ -1,4 +1,5 @@
 - @no_container = true
+- breadcrumb_title "Enviroment '#{@environment.name}'"
 - page_title "Environments"
 = render "projects/pipelines/head"
 

app/views/projects/graphs/charts.html.haml

@@ -1,7 +1,5 @@
 - @no_container = true
 - page_title "Charts"
-- if show_new_nav?
-  - add_to_breadcrumbs("Repository", project_tree_path(@project))
 - content_for :page_specific_javascripts do
   = webpack_bundle_tag('common_d3')
   = webpack_bundle_tag('graphs')

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

@@ -5,9 +5,6 @@
   = webpack_bundle_tag('graphs')
   = webpack_bundle_tag('graphs_show')
 
-- if show_new_nav?
-  - add_to_breadcrumbs("Repository", project_tree_path(@project))
-
 = render 'projects/commits/head'
 
 .js-graphs-show{ class: container_class, 'data-project-graph-path': project_graph_path(@project, current_ref, format: :json) }

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

@@ -1,4 +1,5 @@
 - @content_class = "limit-container-width" unless fluid_layout
+- breadcrumb_title "Issues #{@issue.to_reference}"
 - page_title           "#{@issue.title} (#{@issue.to_reference})", "Issues"
 - page_description     @issue.description
 - page_card_attributes @issue.card_attributes

app/views/projects/jobs/index.html.haml

@@ -2,9 +2,6 @@
 - page_title "Jobs"
 = render "projects/pipelines/head"
 
-- if show_new_nav?
-  - add_to_breadcrumbs("Pipelines", project_pipelines_path(@project))
-
 %div{ class: container_class }
   .top-area
     - build_path_proc = ->(scope) { project_jobs_path(@project, scope: scope) }

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

@@ -1,4 +1,5 @@
 - @no_container = true
+- breadcrumb_title "Jobs ##{@build.id}"
 - page_title "#{@build.name} (##{@build.id})", "Jobs"
 = render "projects/pipelines/head"
 

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

@@ -1,4 +1,5 @@
 - @content_class = "limit-container-width" unless fluid_layout
+- breadcrumb_title "Merge Requests #{@merge_request.to_reference}"
 - page_title "#{@merge_request.title} (#{@merge_request.to_reference})", "Merge Requests"
 - page_description @merge_request.description
 - page_card_attributes @merge_request.card_attributes

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

@@ -1,4 +1,5 @@
 - @no_container = true
+- breadcrumb_title "Milestone #{@milestone.title}"
 - page_title       @milestone.title, "Milestones"
 - page_description @milestone.description
 = render "shared/mr_head"

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

@@ -2,8 +2,6 @@
 - page_title "Graph", @ref
 - content_for :page_specific_javascripts do
   = page_specific_javascript_bundle_tag('network')
-- if show_new_nav?
-  - add_to_breadcrumbs("Repository", project_tree_path(@project))
 = render "projects/commits/head"
 = render "head"
 %div{ class: container_class }

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

@@ -1,4 +1,5 @@
 - @no_container = true
+- breadcrumb_title "CI / CD Charts"
 - page_title _("Charts"), _("Pipelines")
 - if show_new_nav?
   - add_to_breadcrumbs("Pipelines", project_pipelines_path(@project))

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

@@ -1,4 +1,5 @@
 - @no_container = true
+- breadcrumb_title "Pipelines ##{@pipeline.id}"
 - page_title "Pipeline"
 = render "projects/pipelines/head"
 

app/views/projects/project_members/index.html.haml

@@ -1,8 +1,5 @@
 - page_title "Members"
 
-- if show_new_nav?
-  - add_to_breadcrumbs("Settings", edit_project_path(@project))
-
 .row.prepend-top-default
   .col-lg-12
     %h4

app/views/projects/settings/ci_cd/show.html.haml

@@ -1,8 +1,6 @@
 - @content_class = "limit-container-width" unless fluid_layout
-- page_title "Pipelines"
-
-- if show_new_nav?
-  - add_to_breadcrumbs("Settings", edit_project_path(@project))
+- page_title "CI / CD Settings"
+- page_title "CI / CD"
 
 = render "projects/settings/head"
 

app/views/projects/settings/integrations/show.html.haml

@@ -1,7 +1,6 @@
 - @content_class = "limit-container-width" unless fluid_layout
+- breadcrumb_title "Integrations Settings"
 - page_title 'Integrations'
-- if show_new_nav?
-  - add_to_breadcrumbs("Settings", edit_project_path(@project))
 = render "projects/settings/head"
 = render 'projects/hooks/index'
 = render 'projects/services/index'

app/views/projects/settings/repository/show.html.haml

@@ -1,9 +1,7 @@
+- breadcrumb_title "Repository Settings"
 - page_title "Repository"
 - @content_class = "limit-container-width" unless fluid_layout
 
-- if show_new_nav?
-  - add_to_breadcrumbs("Settings", edit_project_path(@project))
-
 = render "projects/settings/head"
 
 - content_for :page_specific_javascripts do

app/views/projects/show.html.haml

@@ -1,5 +1,5 @@
 - @no_container = true
-- breadcrumb_title "Project"
+- breadcrumb_title "Details"
 - @content_class = "limit-container-width" unless fluid_layout
 
 = content_for :meta_tags do

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

@@ -1,4 +1,5 @@
 - @content_class = "limit-container-width limited-inner-width-container" unless fluid_layout
+- breadcrumb_title "Snippet #{@snippet.to_reference}"
 - page_title "#{@snippet.title} (#{@snippet.to_reference})", "Snippets"
 
 = render 'shared/snippets/header'

app/views/projects/tags/index.html.haml

@@ -3,9 +3,6 @@
 - page_title "Tags"
 = render "projects/commits/head"
 
-- if show_new_nav?
-  - add_to_breadcrumbs("Repository", project_tree_path(@project))
-
 .flex-list{ class: container_class }
   .top-area.adjust
     .nav-text.row-main-content

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

@@ -1,4 +1,5 @@
 - @no_container = true
+- breadcrumb_title "Tags #{@tag.name}"
 - page_title @tag.name, "Tags"
 = render "projects/commits/head"