Merge pull request #27261 from Talha345/fix/23810

Fix LHN toggle in responsive view!

docs/assets/js/main.js

@@ -206,13 +206,6 @@ window.addEventListener('DOMContentLoaded', () => {
 
  // If there is a fixed article scroll container, set to calculate titles' offset
  scrollContainer: 'content-area',
-
- // onclick function to apply to all links in toc. will be called with
- // the event as the first parameter, and this can be used to stop,
- // propagation, prevent default or perform action
- onClick() {
- toggleHeaderMenu();
- },
  });
  }
 
@@ -226,6 +219,18 @@ window.addEventListener('DOMContentLoaded', () => {
 
  const articleContent = document.getElementById('article-content');
  const lhnContent = document.getElementById('lhn-content');
+
+ // This event listener checks if a link clicked in the LHN points to some section of the same page and toggles
+ // the LHN menu in responsive view.
+ lhnContent.addEventListener('click', (event) => {
+ const clickedLink = event.target;
+ if (clickedLink) {
+ const href = clickedLink.getAttribute('href');
+ if (href && href.startsWith('#') && !!document.getElementById(href.slice(1))) {
+ toggleHeaderMenu();
+ }
+ }
+ });
  lhnContent.addEventListener('wheel', (e) => {
  const scrollTop = lhnContent.scrollTop;
  const isScrollingPastLHNTop = e.deltaY < 0 && scrollTop === 0;