Minor nav bug fix

HE-Arc · Nov 22, 2023 · 94910ca · 94910ca
1 parent d33f97a
commit 94910ca
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 10 deletions.
diff --git a/resources/css/app.scss b/resources/css/app.scss
@@ -14,9 +14,10 @@ body {
     background-size: 100%;
     position: absolute;
     top: 0;
-    left: 0;
+    right: 0;
     width: 100%;
     z-index: -2;
+    transition: right 0.5s ease-in-out;
 
     .bg-gradient {
         position: fixed;
@@ -141,7 +142,7 @@ header {
     background-color: $background;
     overflow-x: hidden;
     padding-top: 60px;
-    transition: 0.5s;
+    transition: 0.5s ease-in-out;
 
     a {
         padding: 8px 8px 8px 32px;
@@ -159,14 +160,11 @@ header {
     }
 }
 
-#body {
-    transition: margin-right .5s;
-}
-
-.openNavBtn {
+#openNavBtn {
     position: absolute;
     top: 20px;
     right: 20px;
+    transition: opacity .5s ease-in-out;
 
     &:hover {
         cursor: pointer;

diff --git a/resources/views/layout/nav.blade.php b/resources/views/layout/nav.blade.php
@@ -6,7 +6,7 @@
     <a href="/">Inscription</a>
 </nav>
 
-<span onclick="openNav()" class="openNavBtn">
+<span onclick="openNav()" id="openNavBtn">
     <div class="icon-burger">
         <div></div>
         <div></div>
@@ -17,11 +17,17 @@
 <script>
     function openNav() {
         document.getElementById("sideBarNav").style.width = "250px";
-        document.getElementById("body").style.marginRight = "250px";
+        document.getElementById("bg-bricks").style.right = "250px";
+        let openNavBtn = document.getElementById("openNavBtn");
+        openNavBtn.style.opacity = "0";
+        openNavBtn.style.cursor = "default";
     }
 
     function closeNav() {
         document.getElementById("sideBarNav").style.width = "0";
-        document.getElementById("body").style.marginRight = "0";
+        document.getElementById("bg-bricks").style.right = "0";
+        let openNavBtn = document.getElementById("openNavBtn");
+        openNavBtn.style.opacity = "1";
+        openNavBtn.style.cursor = "pointer";
     }
 </script>