make navBar(header) presist active depending on which page user's on

7 files changed, 81 insertions, 43 deletions

diff --git a/src/css/ghrepo.css b/src/css/ghrepo.css
index 2c8d6d7a..79100ffd 100644
--- a/src/css/ghrepo.css
+++ b/src/css/ghrepo.css
@@ -22,8 +22,11 @@
     box-sizing: border-box;
     /* background-image: url(/images/backgroundNightCity.jpg); */
     background: transparent;
+
 }
 
+
+
 body {
     display: flex;
     align-items: center;
@@ -50,7 +53,7 @@ main {
     align-items: center;
     width: 90%;
     max-width: 1280px;
-    background: transparent;
+    /* background: transparent; */
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
diff --git a/src/css/index.css b/src/css/index.css
index 29262abf..4666c95b 100644
--- a/src/css/index.css
+++ b/src/css/index.css
@@ -46,6 +46,7 @@
     position: relative;
     width: 100%;
     text-align: center;
+    text-shadow: 10px 10px 10px black;
 }
 
 .window .placeholder .text .title {
@@ -53,6 +54,10 @@
     font-size: 12.5vw;
 }
 
+.title {
+  text-shadow: 15px 15px 15px black;
+}
+
 .window .placeholder .text .br {
     display: block;
     height: 0;
diff --git a/src/css/style.css b/src/css/style.css
index 410e9646..a313b77e 100644
--- a/src/css/style.css
+++ b/src/css/style.css
@@ -26,6 +26,7 @@
     padding: 0;
     margin: 0;
     font-family: liga;
+    text-shadow: 0px 0px 1px black;
 }
 
 body {
@@ -110,3 +111,27 @@ header {
 section {
     position: relative;
 }
+
+.wrapper {
+  height: 100vh;
+  overflow-y: auto;
+  overflow-x: hidden;
+  perspective: 10px;
+}
+
+.slowScroll
+  transform: translateZ(-10px) scale(2);
+}
+
+.fastScroll {
+  transform: translateZ(-5px) scale(1.5);
+}
+
+.slowScroll,
+.fastScroll {
+  position: absolute;
+  /* height: 100%; */
+  /* width: 100%; */
+  object-fit: cover;
+  z-index: -1;
+}
diff --git a/src/js/includeheader.js b/src/js/includeheader.js
new file mode 100644
index 00000000..5ac7d067
--- /dev/null
+++ b/src/js/includeheader.js
@@ -0,0 +1,47 @@
+function includeHeader() {
+  var z, i, elmnt, file, xhttp;
+  // loop through a collection of all HTML elements
+  z = document.getElementsByTagName("*");
+  for (i = 0; i < z.length; i++) {
+    elmnt = z[i];
+    // search for elements with a certain attribute
+    file = elmnt.getAttribute("include-header");
+    if (file) {
+      // make an HTTP request using the attribute value as the file name
+      xhttp = new XMLHttpRequest();
+      xhttp.onreadystatechange = function() {
+        if (this.readyState == 4) {
+          if (this.status == 200) {
+            elmnt.innerHTML = this.responseText;
+            setActiveLink(); // Set the active link after including the HTML
+          }
+          if (this.status == 404) {
+            elmnt.innerHTML = "Page not found.";
+          }
+          // remove the attribute and call this function once more
+          elmnt.removeAttribute("include-header");
+          includeHeader();
+        }
+      };
+      xhttp.open("GET", file, true);
+      xhttp.send();
+      // exit the function
+      return;
+    }
+  }
+}
+
+// Set the active link based on the current page
+function setActiveLink() {
+  var currentPath = window.location.pathname;
+  var navLinks = document.getElementsByClassName("navBar")[0].getElementsByTagName("a");
+  for (var i = 0; i < navLinks.length; i++) {
+    var link = navLinks[i];
+    var href = link.getAttribute("href");
+    if (href === currentPath) {
+      link.classList.add("active");
+    } else {
+      link.classList.remove("active");
+    }
+  }
+}
diff --git a/src/js/includehtml.js b/src/js/includehtml.js
deleted file mode 100644
index 7b00285f..00000000
--- a/src/js/includehtml.js
+++ /dev/null
@@ -1,28 +0,0 @@
-function includeHTML() {
-  var z, i, elmnt, file, xhttp;
-  /*loop through a collection of all HTML elements:*/
-  z = document.getElementsByTagName("*");
-  for (i = 0; i < z.length; i++) {
-    elmnt = z[i];
-    /*search for elements with a certain atrribute:*/
-    file = elmnt.getAttribute("include-html");
-    if (file) {
-      /*make an HTTP request using the attribute value as the file name:*/
-      xhttp = new XMLHttpRequest();
-      xhttp.onreadystatechange = function() {
-        if (this.readyState == 4) {
-          if (this.status == 200) {elmnt.innerHTML = this.responseText;}
-          if (this.status == 404) {elmnt.innerHTML = "Page not found.";}
-          /*remove the attribute, and call this function once more:*/
-          elmnt.removeAttribute("include-html");
-          includeHTML();
-        }
-      }      
-      xhttp.open("GET", file, true);
-      xhttp.send();
-      /*exit the function:*/
-      return;
-    }
-  }
-};
-
diff --git a/src/js/login.js b/src/js/login.js
deleted file mode 100644
index ce4c0803..00000000
--- a/src/js/login.js
+++ /dev/null
@@ -1,4 +0,0 @@
-function test() {
-    console.log(document.getElementById("username").value);
-    console.log(document.getElementById("password").value);
-}
\ No newline at end of file
diff --git a/src/js/register.js b/src/js/register.js
deleted file mode 100644
index 11f85852..00000000
--- a/src/js/register.js
+++ /dev/null
@@ -1,10 +0,0 @@
-function createAccount() {
-    if (document.getElementById("password").value == document.getElementById("verify-password").value) {
-        let username = document.getElementById("username").value;
-        let password = document.getElementById("password").value;
-        console.log(username);
-        console.log(password);
-    } else {
-        console.log("password does not match");
-    }
-}