got rid of some warnings, also changes what happens when scaleNav is called on mobile devices. I previously forgot to clear the styles from wider screens, causing the app to need a refresh to fit mobile better

stirling-pdf/src/main/resources/static/js/favourites.js

@@ -44,8 +44,16 @@ function updateFavoritesDropdown() {
           contentWrapper.style.color = 'inherit';
 
           // Clone the original content
-          var originalContent = navbarEntry.querySelector('div').cloneNode(true);
+          var divElement = navbarEntry.querySelector('div');
-          contentWrapper.appendChild(originalContent);
+          if (divElement) {
+            var originalContent = divElement.cloneNode(true);
+            contentWrapper.appendChild(originalContent);
+          } else {
+            // Fallback: create content manually if div is not found
+            var fallbackContent = document.createElement('div');
+            fallbackContent.innerHTML = navbarEntry.innerHTML;
+            contentWrapper.appendChild(fallbackContent);
+          }
 
           // Create the remove button
           var removeButton = document.createElement('button');

stirling-pdf/src/main/resources/static/js/navbar.js

@@ -55,10 +55,20 @@ function setupDropdowns() {
     }
 
     dropdown.addEventListener('show.bs.dropdown', () => {
-      // Find all other dropdowns and hide them
+      // Find all other open dropdowns and hide them
-      bootstrap.Dropdown.getAllInstances().forEach((instance) => {
+      const openDropdowns = document.querySelectorAll('.navbar-nav .dropdown-menu.show');
-        if (instance._element !== toggle) {
+      openDropdowns.forEach((menu) => {
-          instance.hide();
+        const parentDropdown = menu.closest('.dropdown');
+        if (parentDropdown && parentDropdown !== dropdown) {
+          const parentToggle = parentDropdown.querySelector('[data-bs-toggle="dropdown"]');
+          if (parentToggle) {
+            // Get or create Bootstrap dropdown instance
+            let instance = bootstrap.Dropdown.getInstance(parentToggle);
+            if (!instance) {
+              instance = new bootstrap.Dropdown(parentToggle);
+            }
+            instance.hide();
+          }
         }
       });
     });

stirling-pdf/src/main/resources/static/js/search.js

@@ -56,8 +56,16 @@ document.querySelector("#navbarSearchInput").addEventListener("input", function
           contentWrapper.style.textDecoration = "none";
           contentWrapper.style.color = "inherit";
 
-          var originalContent = item.querySelector("div").cloneNode(true);
+          var divElement = item.querySelector("div");
-          contentWrapper.appendChild(originalContent);
+          if (divElement) {
+            var originalContent = divElement.cloneNode(true);
+            contentWrapper.appendChild(originalContent);
+          } else {
+            // Fallback: create content manually if div is not found
+            var fallbackContent = document.createElement("div");
+            fallbackContent.innerHTML = item.innerHTML;
+            contentWrapper.appendChild(fallbackContent);
+          }
 
           contentWrapper.onclick = function () {
             window.location.href = itemHref;
@@ -77,14 +85,18 @@ document.querySelector("#navbarSearchInput").addEventListener("input", function
 
 const searchDropdown = document.getElementById('searchDropdown');
 const searchInput = document.getElementById('navbarSearchInput');
-const dropdownMenu = searchDropdown.querySelector('.dropdown-menu');
 
-// Create a single dropdown instance
+// Check if elements exist before proceeding
-const dropdownInstance = new bootstrap.Dropdown(searchDropdown);
+if (searchDropdown && searchInput) {
+    const dropdownMenu = searchDropdown.querySelector('.dropdown-menu');
+
+    // Create a single dropdown instance
+    const dropdownInstance = new bootstrap.Dropdown(searchDropdown);
 
 // Function to handle showing the dropdown
 function showSearchDropdown() {
-    if (!dropdownInstance._isShown()) {
+    const dropdownMenu = searchDropdown.querySelector('.dropdown-menu');
+    if (!dropdownMenu || !dropdownMenu.classList.contains('show')) {
         dropdownInstance.show();
     }
     setTimeout(() => searchInput.focus(), 150); // Focus after animation
@@ -94,7 +106,8 @@ function showSearchDropdown() {
 searchDropdown.addEventListener('click', function (e) {
     if (window.innerWidth < 1200) {
         // Let Bootstrap's default toggling handle it, but ensure focus
-        if (!dropdownInstance._isShown()) {
+        const dropdownMenu = searchDropdown.querySelector('.dropdown-menu');
+        if (!dropdownMenu || !dropdownMenu.classList.contains('show')) {
             // Use a small delay to allow the dropdown to open before focusing
             setTimeout(() => searchInput.focus(), 150);
         }
@@ -132,7 +145,8 @@ searchDropdown.addEventListener('mouseleave', function (e) {
 
 // Hide dropdown if it's open and user clicks outside
 document.addEventListener('click', function(e) {
-    if (!searchDropdown.contains(e.target) && dropdownInstance._isShown()) {
+    const dropdownMenu = searchDropdown.querySelector('.dropdown-menu');
+    if (!searchDropdown.contains(e.target) && dropdownMenu && dropdownMenu.classList.contains('show')) {
         if (searchInput.value.trim().length === 0) {
              dropdownInstance.hide();
         }
@@ -143,3 +157,5 @@ document.addEventListener('click', function(e) {
 searchInput.addEventListener('click', function (e) {
     e.stopPropagation();
 });
+
+} // End of if (searchDropdown && searchInput) block

stirling-pdf/src/main/resources/templates/fragments/common.html

@@ -32,7 +32,28 @@
     
     function scaleNav() {
       if (window.innerWidth < 1200) {
-        // Don't scale nav on mobile
+        // Reset/remove scaling on mobile
+        const navbarElement = document.querySelector('.navbar');
+        if (navbarElement) {
+          navbarElement.style.transform = '';
+          navbarElement.style.transformOrigin = '';
+          navbarElement.style.width = '';
+          navbarElement.style.left = '';
+          navbarElement.style.right = '';
+          navbarElement.style.marginBottom = '';
+          navbarElement.classList.remove('navbar-expand-lg');
+          navbarElement.classList.add('navbar-expand-xl');
+        }
+        
+        // Reset dropdown scaling
+        const dropdowns = document.querySelectorAll('.dropdown-menu');
+        dropdowns.forEach(dropdown => {
+          dropdown.style.transform = '';
+          dropdown.style.transformOrigin = '';
+        });
+        
+        // Reset CSS custom property
+        document.documentElement.style.setProperty('--navbar-height', '');
         return;
       }
       const currentDPR = window.devicePixelRatio || 1;