From ad2baf6b94289e2567bbc458076b9a1e378859a6 Mon Sep 17 00:00:00 2001
From: TrudeEH <ehtrude@gmail.com>
Date: Mon, 17 Feb 2025 14:54:25 +0000
Subject: [PATCH] Refactor navigation styles and update logo click behavior

---
 static/portfolio/css/nav.css |  8 ++++++--
 static/portfolio/index.html  |  2 +-
 static/portfolio/index.js    | 40 +++++++++++++++++++-----------------
 3 files changed, 28 insertions(+), 22 deletions(-)

diff --git a/static/portfolio/css/nav.css b/static/portfolio/css/nav.css
index f2f21e7..5e27e29 100644
--- a/static/portfolio/css/nav.css
+++ b/static/portfolio/css/nav.css
@@ -121,12 +121,16 @@ nav li a:active {
   background: #00000073;
 }
 
-li a:hover,
-.nav-logo:hover {
+li a:hover {
   background: #00000028;
   transition: 0.3s;
 }
 
+.nav-logo:hover {
+  filter: invert(100%);
+  transition: 0.3s;
+}
+
 .hide {
   width: 3.55rem;
 }
diff --git a/static/portfolio/index.html b/static/portfolio/index.html
index 4826c23..948a324 100644
--- a/static/portfolio/index.html
+++ b/static/portfolio/index.html
@@ -18,7 +18,7 @@
         <img
           class="nav-logo"
           src="img/dragon_logo.svg"
-          onclick="menuToggle(this)"
+          onclick="window.location.href='/'"
           alt="Trude's Logo"
         />
         <div id="nav-container">
diff --git a/static/portfolio/index.js b/static/portfolio/index.js
index 20d20fe..2be501d 100644
--- a/static/portfolio/index.js
+++ b/static/portfolio/index.js
@@ -1,20 +1,22 @@
-const navElements = document.querySelectorAll("nav #nav-container a");
-pointer = 1;
+// Code to toggle the menu; Disabled to serve as back button On HTML: onclick="menuToggle(this)"
 
-function menuToggle(x) {
-  if (x.classList.contains("menuAlt")) {
-    document.getElementById("nav").classList.add("nav-open");
-    setTimeout(() => {
-      document.getElementById("nav").classList.remove("nav-open");
-      document.getElementById("nav-container").style.display = "flex";
-    }, 200);
-  } else {
-    document.getElementById("nav").classList.add("nav-close");
-    document.getElementById("nav-container").style.display = "none";
-    setTimeout(() => {
-      document.getElementById("nav").classList.remove("nav-close");
-    }, 200);
-  }
-  x.classList.toggle("menuAlt");
-  document.getElementById("nav").classList.toggle("hide");
-}
+// const navElements = document.querySelectorAll("nav #nav-container a");
+// pointer = 1;
+
+// function menuToggle(x) {
+//   if (x.classList.contains("menuAlt")) {
+//     document.getElementById("nav").classList.add("nav-open");
+//     setTimeout(() => {
+//       document.getElementById("nav").classList.remove("nav-open");
+//       document.getElementById("nav-container").style.display = "flex";
+//     }, 200);
+//   } else {
+//     document.getElementById("nav").classList.add("nav-close");
+//     document.getElementById("nav-container").style.display = "none";
+//     setTimeout(() => {
+//       document.getElementById("nav").classList.remove("nav-close");
+//     }, 200);
+//   }
+//   x.classList.toggle("menuAlt");
+//   document.getElementById("nav").classList.toggle("hide");
+// }