[Server] Some improvements to navbar on mobile

Author: fproske

server/proxy/less/styles.less

@@ -360,6 +360,21 @@ a {
 .dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover {
   background: #080808;
 }
+@media (max-width: 991.98px) {
+  .navbar-user .dropdown-menu[data-bs-popper] {
+    margin-top: 0;
+  }
+  .navbar-user .dropdown-menu {
+    display: block;
+    position: static;
+    background-color: transparent;
+    border: none;
+    box-shadow: none;
+  }
+  .navbar-user .dropdown-toggle::after {
+    display: none;
+  }
+}
 .btn,
 a.btn {
   -webkit-transition: all 0.4s ease-in-out;

server/proxy/templates/2col/assets/css/styles.css

@@ -1,5 +1,5 @@
 $(function () {
-  $('#navHome').removeClass('active');
+  $('.nav-home').removeClass('active');
   const currLocation = window.location.pathname;
   if (
     !(

server/proxy/templates/2col/assets/css/styles.css.map

@@ -37,7 +37,7 @@
     >
       <nav class="navbar navbar-expand-lg navbar-dark fixed-top">
         <!-- Brand -->
-        <a id="navHome" class="navbar-brand navbar-nav active" th:href="@{/}">
+        <a class="navbar-brand navbar-nav navbar-home active" th:href="@{/}">
           My Apps
         </a>
 
@@ -60,7 +60,6 @@
           aria-labelledby="mainOffcanvasLabel"
         >
           <div class="offcanvas-header d-lg-none">
-            <h5 class="offcanvas-title" id="mainOffcanvasLabel">My Apps</h5>
             <button
               type="button"
               class="btn-close btn-close-white"
@@ -71,6 +70,11 @@ <h5 class="offcanvas-title" id="mainOffcanvasLabel">My Apps</h5>
 
           <div class="offcanvas-body">
             <!-- Left side -->
+            <ul class="navbar-nav me-auto d-lg-none">
+              <li class="nav-item">
+                <a class="nav-link nav-home active" th:href="@{/}">My Apps</a>
+              </li>
+            </ul>
             <ul class="navbar-nav me-auto" th:if="${isAdmin}">
               <li class="nav-item">
                 <a

server/proxy/templates/2col/assets/js/app.js

@@ -6,14 +6,14 @@ export default class BaselineCompareErrorManager {
   evaluateData(refData, data, tableId, sessionId) {
     if (Math.abs(refData - data) > 1e-4) {
       if (
-        !Object.hasOwn(this.errors, tableId) ||
-        this.errors[tableId] !== sessionId
+        !Object.hasOwn(this.errors, tableId)
+        || this.errors[tableId] !== sessionId
       ) {
         this.errors[tableId] = sessionId;
         setTimeout(() => {
           if (
-            Object.hasOwn(this.errors, tableId) &&
-            this.errors[tableId] === sessionId
+            Object.hasOwn(this.errors, tableId)
+            && this.errors[tableId] === sessionId
           ) {
             modal(
               "Something went wrong. Please don't trust the data! Also, please contact GAMS about this issue (id: 981273) via [email protected]",
@@ -23,8 +23,8 @@ export default class BaselineCompareErrorManager {
         }, 2000);
       }
     } else if (
-      Object.hasOwn(this.errors, tableId) &&
-      this.errors[tableId] !== sessionId
+      Object.hasOwn(this.errors, tableId)
+      && this.errors[tableId] !== sessionId
     ) {
       // old error -> clear as we render a new table
       delete this.errors[tableId];