From 49497327837d34b5efcffa058d7b8eac357cc397 Mon Sep 17 00:00:00 2001
From: Roman Deev <roman.deev06@gmail.com>
Date: Wed, 21 Jan 2026 00:47:34 +0300
Subject: [PATCH] Use media queries to hide menus instead of JavaScript

---
 app/assets/javascripts/application.js | 13 ++++++-------
 app/assets/stylesheets/common.scss    |  2 +-
 2 files changed, 7 insertions(+), 8 deletions(-)

diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
index c17fb4355..b9d1c0342 100644
--- a/app/assets/javascripts/application.js
+++ b/app/assets/javascripts/application.js
@@ -112,10 +112,14 @@ $(function () {
     const windowWidth = $(window).width();
 
     if (windowWidth < breakpointWidth) {
-      $("body").addClass("small-nav");
       expandAllSecondaryMenuItems();
     } else {
-      $("body").removeClass("small-nav");
+      if (secondaryMenuItems.length === 0) {
+        $expandedSecondaryMenu.find("li:not(#compact-secondary-nav)").each(function () {
+          secondaryMenuItems.push([this, $(this).width()]);
+        });
+        moreItemWidth = $("#compact-secondary-nav").width();
+      }
       const availableWidth = $expandedSecondaryMenu.width();
       secondaryMenuItems.forEach(function (item) {
         $(item[0]).remove();
@@ -179,11 +183,6 @@ $(function () {
    * to defer the measurement slightly as a workaround.
    */
   setTimeout(function () {
-    $expandedSecondaryMenu.find("li:not(#compact-secondary-nav)").each(function () {
-      secondaryMenuItems.push([this, $(this).width()]);
-    });
-    moreItemWidth = $("#compact-secondary-nav").width();
-
     updateHeader();
 
     $(window).resize(updateHeader);
diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss
index befbec8de..e19f7d15e 100644
--- a/app/assets/stylesheets/common.scss
+++ b/app/assets/stylesheets/common.scss
@@ -151,7 +151,7 @@ nav.primary, nav.secondary {
   display: none;
 }
 
-body.small-nav {
+@include media-breakpoint-down(md) {
   header {
     height: auto;
     min-height: $headerHeight;
-- 
2.39.5