From 4be03fa5d3051131790a91aeb2b1ee91827d0ef0 Mon Sep 17 00:00:00 2001
From: Azita Rahimi <a.rahimi@inova-agency.net>
Date: Sun, 21 Jun 2026 12:08:41 +0330
Subject: [PATCH] menu-open-fix

---
 src/assets/css/homepage.css | 22 +++++++++++++---------
 src/assets/js/homepage.js   |  8 ++++----
 2 files changed, 17 insertions(+), 13 deletions(-)

diff --git a/src/assets/css/homepage.css b/src/assets/css/homepage.css
index 20ff1d0..28c661f 100644
--- a/src/assets/css/homepage.css
+++ b/src/assets/css/homepage.css
@@ -96,14 +96,11 @@ section > .container {
 
 .header-menu-toggle {
   display: none;
-
   width: 48px;
   height: 48px;
-
   border: none;
   background: transparent;
   cursor: pointer;
-
   flex-direction: column;
   justify-content: center;
   align-items: center;
@@ -121,21 +118,26 @@ section > .container {
 
 .header-mobile-menu {
   position: fixed;
-   top: 0;
-  right: 0;
+  inset: 0;
   width: 100%;
   height: 100dvh;
   background: #ffffff !important;
   display: none;
   flex-direction: column;
-  z-index: 1002;
+  z-index: 99999;
+  overflow: hidden;
 }
 
 .header-mobile-menu.active {
   display: flex;
-
+ position: fixed;
+  inset: 0;
+  background: #fff;
+}
+body.menu-open {
+  overflow: hidden;
+  height: 100vh;
 }
-
 .header-mobile-top {
   display: flex;
   align-items: center;
@@ -209,7 +211,9 @@ section > .container {
 }
 .header-mobile-back{
   background-color: #ffffff;
-  
+   height: 100%;
+  display: flex;
+  flex-direction: column;
 }
 .header-mobile-socials {
   display: flex;
diff --git a/src/assets/js/homepage.js b/src/assets/js/homepage.js
index 17c6320..734287c 100644
--- a/src/assets/js/homepage.js
+++ b/src/assets/js/homepage.js
@@ -1,17 +1,17 @@
 // ====================================هدر===========================
 const headerMenuBtn = document.querySelector('.header-menu-toggle');
 const headerMobileMenu = document.querySelector('.header-mobile-menu');
+const headerCloseBtn = document.querySelector('.header-mobile-close');
 
 headerMenuBtn.addEventListener('click', () => {
-  headerMobileMenu.classList.toggle('active');
+  headerMobileMenu.classList.add('active');
+  document.body.classList.add('menu-open');
 });
 
-const headerCloseBtn = document.querySelector('.header-mobile-close');
-
 headerCloseBtn.addEventListener('click', () => {
   headerMobileMenu.classList.remove('active');
+  document.body.classList.remove('menu-open');
 });
-
 // ==========================هیروسکشن===================================
 
 window.addEventListener('load', () => {