Use Bootstrap .nav in secondary header navigation

diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
index 20976d15a56ff93264d1d81a511c564840517904..05474212645361fd975d3a0e188edbe1c4bdae81 100644 (file)
--- a/app/assets/javascripts/application.js
+++ b/app/assets/javascripts/application.js
@@ -106,6 +106,7 @@ $(document).ready(function () {
     $("body").removeClass("compact-nav");
 
     $("header").removeClass("text-nowrap");
+    $("header nav.secondary > ul").removeClass("flex-nowrap");
 
     updateHeader();
 

diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss
index c3f2b36adc361a320f7618664c5d39644cb75c36..4ee7b860c2b583bb28d24b7b18fa2b5cbb8d08c5 100644 (file)
--- a/app/assets/stylesheets/common.scss
+++ b/app/assets/stylesheets/common.scss
@@ -98,10 +98,6 @@ header {
   position: relative;
   font-size: 14px;
 
-  h1, nav, nav > ul, nav > ul > li {
-    display: inline-block;
-  }
-
   > * {
     padding: $lineheight * 0.5;
   }
@@ -191,7 +187,7 @@ body.small-nav {
     min-height: $headerHeight;
 
     &.closed nav {
-      display: none;
+      display: none !important;
     }
 
     .search_forms {
@@ -216,6 +212,8 @@ body.small-nav {
   }
 
   nav.secondary {
+    flex-direction: column;
+
     .user-menu, .login-menu {
       width: 100%;
     }

diff --git a/app/views/layouts/_header.html.erb b/app/views/layouts/_header.html.erb
index 7f2880a1c9f6b91dd7c784b66197370396213a19..db534ef83b88c8533adfb0e894248d86d69b7b78 100644 (file)
--- a/app/views/layouts/_header.html.erb
+++ b/app/views/layouts/_header.html.erb
@@ -31,8 +31,8 @@
       <%= link_to t("layouts.export"), export_path, :class => "btn btn-outline-primary geolink", :id => "export_tab" %>
     </div>
   </nav>
-  <nav class='secondary'>
-    <ul class='mx-1 px-0'>
+  <nav class='secondary d-flex gap-2 align-items-center'>
+    <ul class='nav flex-nowrap'>
       <% if Settings.status != "database_offline" && can?(:index, Issue) %>
         <li class="compact-hide nav-item">
           <%= link_to issues_path(:status => "open"), :class => header_nav_link_class(issues_path) do %>