From ce451f86a829976b26c3a6c3f2ece334cdb4944f Mon Sep 17 00:00:00 2001
From: Mojca Lorber <mlorber@biosistemika.com>
Date: Wed, 10 Feb 2021 23:33:16 +0100
Subject: [PATCH] Fix projects breadcrumbs style [SCI-5349]

---
 app/assets/stylesheets/experiments.scss         |  4 ----
 app/assets/stylesheets/projects.scss            | 13 +++++++++++--
 app/assets/stylesheets/shared/content_pane.scss |  2 +-
 app/views/layouts/fluid.html.erb                |  3 ---
 app/views/projects/experiment_archive.html.erb  |  4 ----
 app/views/projects/index.html.erb               |  4 ----
 app/views/projects/index/_header.html.erb       |  3 +++
 app/views/projects/show.html.erb                |  4 ----
 app/views/projects/show/_header.html.erb        |  3 +++
 9 files changed, 18 insertions(+), 22 deletions(-)

diff --git a/app/assets/stylesheets/experiments.scss b/app/assets/stylesheets/experiments.scss
index 0b77328dd..40f793f05 100644
--- a/app/assets/stylesheets/experiments.scss
+++ b/app/assets/stylesheets/experiments.scss
@@ -27,10 +27,6 @@
       display: flex;
       max-width: calc(100% - 7em);
 
-      .inline-editing-container {
-        width: calc(100% - 3em);
-      }
-
       .fas {
         margin-right: .5em;
       }
diff --git a/app/assets/stylesheets/projects.scss b/app/assets/stylesheets/projects.scss
index caaa2c9cc..075926096 100644
--- a/app/assets/stylesheets/projects.scss
+++ b/app/assets/stylesheets/projects.scss
@@ -455,8 +455,17 @@ li.module-hover {
 
 // New projects page
 
-.projects-breadcrumbs {
-  padding: .5em 1em;
+#breadcrumbsWrapper {
+  background: $color-white;
+  height: 1em;
+  margin-left: -2em;
+  padding: 0 2em;
+  width: calc(100% + 4em);
+
+  .projects-breadcrumbs {
+    @include font-small;
+    padding: .75em 0;
+  }
 }
 
 .projects-index {
diff --git a/app/assets/stylesheets/shared/content_pane.scss b/app/assets/stylesheets/shared/content_pane.scss
index 45aefccb7..a53aa165a 100644
--- a/app/assets/stylesheets/shared/content_pane.scss
+++ b/app/assets/stylesheets/shared/content_pane.scss
@@ -25,7 +25,7 @@
       background: $color-white;
       border-bottom: $border-tertiary;
       display: flex;
-      height: 5em;
+      height: 4em;
       margin-left: -2em;
       padding: 0 2em;
       width: calc(100% + 4em);
diff --git a/app/views/layouts/fluid.html.erb b/app/views/layouts/fluid.html.erb
index 259ccac70..04a85fcd5 100644
--- a/app/views/layouts/fluid.html.erb
+++ b/app/views/layouts/fluid.html.erb
@@ -16,9 +16,6 @@
           <%= yield :sidebar_footer %>
         </div>
       </div>
-      <div id="breadcrumbsWrapper">
-        <%= yield :breadcrumbs %>
-      </div>
       <%= yield :secondary_navigation %>
       <div class="container-fluid <%= yield :container_class %>" id="fluid-content">
         <%= yield %>
diff --git a/app/views/projects/experiment_archive.html.erb b/app/views/projects/experiment_archive.html.erb
index b3fabf446..423e6f608 100644
--- a/app/views/projects/experiment_archive.html.erb
+++ b/app/views/projects/experiment_archive.html.erb
@@ -6,10 +6,6 @@
   <%= render partial: 'shared/sidebar/experiments.html.erb', locals: { project: @project, archived: true } %>
 <% end %>
 
-<% content_for :breadcrumbs do %>
-  <%= render partial: 'projects/index/breadcrumbs', locals: { target_folder: @project.project_folder } %>
-<% end %>
-
 <div class="content-pane flexible" id="project-show-archive">
   <%= render partial: 'projects/show/header' %>
   <% if @project.archived_experiments.count > 0 %>
diff --git a/app/views/projects/index.html.erb b/app/views/projects/index.html.erb
index 6d97fa0ac..5719ac584 100644
--- a/app/views/projects/index.html.erb
+++ b/app/views/projects/index.html.erb
@@ -6,10 +6,6 @@
   <%= render partial: 'shared/sidebar/projects', locals: { team: current_team, sort: nil, view_mode: projects_view_mode } if current_team %>
 <% end %>
 
-<% content_for :breadcrumbs do %>
-  <%= render partial: 'projects/index/breadcrumbs' if current_folder %>
-<% end %>
-
 <div id="projectsWrapper" class="content-pane flexible projects-index <%= projects_view_mode %>" data-view-mode="<%= projects_view_mode %>">
   <%= render partial: 'projects/index/header', locals: { current_folder: current_folder} %>
 
diff --git a/app/views/projects/index/_header.html.erb b/app/views/projects/index/_header.html.erb
index f98accc39..b4edbdc94 100644
--- a/app/views/projects/index/_header.html.erb
+++ b/app/views/projects/index/_header.html.erb
@@ -1,4 +1,7 @@
 <div class="content-header sticky-header">
+  <div id="breadcrumbsWrapper">
+    <%= render partial: 'projects/index/breadcrumbs' if current_folder %>
+  </div>
   <div class="title-row">
     <h1 data-view-mode="active" class="projects-title"><%= current_folder&.name || t('projects.index.head_title') %></h1>
     <h1 data-view-mode="archived">
diff --git a/app/views/projects/show.html.erb b/app/views/projects/show.html.erb
index 285384417..ac1ea83e1 100644
--- a/app/views/projects/show.html.erb
+++ b/app/views/projects/show.html.erb
@@ -7,10 +7,6 @@
   <%= render partial: 'shared/sidebar/experiments.html.erb', locals: { project: @project, view_mode: experiments_view_mode(@project)} %>
 <% end %>
 
-<% content_for :breadcrumbs do %>
-  <%= render partial: 'projects/index/breadcrumbs', locals: { target_folder: @project.project_folder } %>
-<% end %>
-
 <div id="projectShowWrapper" class="content-pane flexible projects-show <%= experiments_view_mode(@project) %>" data-view-mode="<%= experiments_view_mode(@project) %>">
   <%= render partial: 'projects/show/header' %>
 
diff --git a/app/views/projects/show/_header.html.erb b/app/views/projects/show/_header.html.erb
index 4ca7b154e..8a79c5907 100644
--- a/app/views/projects/show/_header.html.erb
+++ b/app/views/projects/show/_header.html.erb
@@ -1,4 +1,7 @@
 <div class="content-header sticky-header">
+  <div id="breadcrumbsWrapper">
+    <%= render partial: 'projects/index/breadcrumbs', locals: { target_folder: @project.project_folder } %>
+  </div>
   <div class="title-row">
     <h1 class="project-name">
       <i class="fas fa-archive" data-view-mode="archived"></i>