From f171e7d0e4189a993b844826b960b5ff9fefb1dc Mon Sep 17 00:00:00 2001
From: YUVRAJRANA10 <yuvraj.r0810@gmail.com>
Date: Wed, 17 Sep 2025 23:45:01 +0530
Subject: [PATCH] feat: add click-outside functionality to close responsive
 navbar

- Enhance mobile navigation UX by closing navbar when clicking outside
- Improve accessibility for touch device users
- Maintain existing nav-link click behavior
- Only activate in responsive/mobile view when hamburger menu is visible
- Follow modern UI/UX patterns for mobile navigation

Closes: Enhanced user experience for mobile navigation
---
 dist/js/scripts.js | 21 ++++++++++++++++++++-
 src/js/scripts.js  | 19 +++++++++++++++++++
 2 files changed, 39 insertions(+), 1 deletion(-)

diff --git a/dist/js/scripts.js b/dist/js/scripts.js
index 78bc17636b..4f4b8aa097 100644
--- a/dist/js/scripts.js
+++ b/dist/js/scripts.js
@@ -1,6 +1,6 @@
 /*!
 * Start Bootstrap - Resume v7.0.6 (https://startbootstrap.com/theme/resume)
-* Copyright 2013-2023 Start Bootstrap
+* Copyright 2013-2025 Start Bootstrap
 * Licensed under MIT (https://github.com/StartBootstrap/startbootstrap-resume/blob/master/LICENSE)
 */
 //
@@ -31,4 +31,23 @@ window.addEventListener('DOMContentLoaded', event => {
         });
     });
 
+    // Close navbar when clicking outside of it (accessibility improvement)
+    const navbarCollapse = document.body.querySelector('#navbarResponsive');
+    if (navbarToggler && navbarCollapse) {
+        document.addEventListener('click', (event) => {
+            // Check if navbar is expanded and toggler is visible (mobile view)
+            const isNavbarExpanded = navbarCollapse.classList.contains('show');
+            const isTogglerVisible = window.getComputedStyle(navbarToggler).display !== 'none';
+            
+            if (isNavbarExpanded && isTogglerVisible) {
+                // Check if click is outside the navbar
+                const isClickInsideNav = sideNav.contains(event.target);
+                
+                if (!isClickInsideNav) {
+                    navbarToggler.click();
+                }
+            }
+        });
+    }
+
 });
diff --git a/src/js/scripts.js b/src/js/scripts.js
index 1c6aaccd4f..cf562ccaf0 100644
--- a/src/js/scripts.js
+++ b/src/js/scripts.js
@@ -26,4 +26,23 @@ window.addEventListener('DOMContentLoaded', event => {
         });
     });
 
+    // Close navbar when clicking outside of it (accessibility improvement)
+    const navbarCollapse = document.body.querySelector('#navbarResponsive');
+    if (navbarToggler && navbarCollapse) {
+        document.addEventListener('click', (event) => {
+            // Check if navbar is expanded and toggler is visible (mobile view)
+            const isNavbarExpanded = navbarCollapse.classList.contains('show');
+            const isTogglerVisible = window.getComputedStyle(navbarToggler).display !== 'none';
+            
+            if (isNavbarExpanded && isTogglerVisible) {
+                // Check if click is outside the navbar
+                const isClickInsideNav = sideNav.contains(event.target);
+                
+                if (!isClickInsideNav) {
+                    navbarToggler.click();
+                }
+            }
+        });
+    }
+
 });