From 8c0894205b92d0a2437737b3d68bac885404b0c5 Mon Sep 17 00:00:00 2001
From: Hazem Krimi <krimihazem1@gmail.com>
Date: Tue, 7 Nov 2023 02:08:43 +0100
Subject: [PATCH] Media queries improvements

---
 assets/css/partials/footer.css | 2 +-
 assets/css/partials/header.css | 3 ++-
 assets/js/partials/header.js   | 6 +++---
 3 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/assets/css/partials/footer.css b/assets/css/partials/footer.css
index 7845648..d898586 100644
--- a/assets/css/partials/footer.css
+++ b/assets/css/partials/footer.css
@@ -33,7 +33,7 @@ footer #copyright {
   font-size: 0.875rem;
 }
 
-@media only screen and (max-width: 768px) {
+@media only screen and (max-width: 1024px) {
   footer {
     padding: 3rem 5rem;
 
diff --git a/assets/css/partials/header.css b/assets/css/partials/header.css
index 0b1a6d0..5194eac 100644
--- a/assets/css/partials/header.css
+++ b/assets/css/partials/header.css
@@ -89,8 +89,9 @@ header #nav-toggler {
   cursor: pointer;
 }
 
-@media only screen and (max-width: 768px) {
+@media only screen and (max-width: 1024px) {
   header, nav {
+    margin: 1.5rem auto;
     padding: 0.938rem 1.25rem;
   }
 
diff --git a/assets/js/partials/header.js b/assets/js/partials/header.js
index 7848225..ae74742 100644
--- a/assets/js/partials/header.js
+++ b/assets/js/partials/header.js
@@ -12,13 +12,13 @@ function loadBurger() {
   mobileNavigation.style.top = burgerOpen
     ? `calc(${header.getBoundingClientRect().y}px + ${
         header.getBoundingClientRect().height
-      }px + 0.625rem)`
+      }px)`
     : 'initial';
   mobileNavigation.style.left = burgerOpen
     ? `${headerInitialLeftPosition}px`
     : 'initial';
   document.querySelector('main').style.marginTop = burgerOpen
-    ? `calc(${header.getBoundingClientRect().height}px + 5rem)`
+    ? `calc(${header.getBoundingClientRect().height}px + 3rem)`
     : '0px';
 }
 
@@ -33,7 +33,7 @@ function resetBurger() {
 }
 
 function resetBurgerWhenWindowResized() {
-  if (window.innerWidth > 768) {
+  if (window.innerWidth > 1024) {
     resetBurger();
   }
 }