@@ -49,5 +46,6 @@ + diff --git a/src/css/style.css b/src/css/style.css index d9bf3c56..2fbd7daa 100644 --- a/src/css/style.css +++ b/src/css/style.css @@ -75,6 +75,7 @@ body { .animate.animation--delay-p5s { animation-delay: 0.5s; } + .animate.animation--delay-p3s { animation-delay: 0.3s; } @@ -135,6 +136,7 @@ header { margin-right: 5mm; padding-top: 3mm; padding-bottom: 3mm; + border-radius: 8px; color: #F4E8C1; } @@ -160,6 +162,7 @@ header { .navBar a:hover { background: rgba(255, 255, 255, 0.2); + outline: ridge rgba(128, 128, 128, .6); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); transition: all 1s diff --git a/src/html/headers.html b/src/html/headers.html deleted file mode 100644 index ccc4a6bc..00000000 --- a/src/html/headers.html +++ /dev/null @@ -1,12 +0,0 @@ - -

- -

diff --git a/src/js/header.js b/src/js/header.js new file mode 100644 index 00000000..91320021 --- /dev/null +++ b/src/js/header.js @@ -0,0 +1,22 @@ +let header = document.querySelector('[header]'); +let newElement = document.createElement('div'); +let page = header.getAttribute('page'); + +console.log(page); +newElement.innerHTML = ` + +

+ +

+`; + +header.appendChild(newElement); +document.getElementById("btn"+page).setAttribute('class', 'active'); diff --git a/src/js/includeheader.js b/src/js/includeheader.js deleted file mode 100644 index 5ac7d067..00000000 --- a/src/js/includeheader.js +++ /dev/null @@ -1,47 +0,0 @@ -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/tmp/.htmltest/htmltest.log b/tmp/.htmltest/htmltest.log index ce8eac15..6b001a77 100644 --- a/tmp/.htmltest/htmltest.log +++ b/tmp/.htmltest/htmltest.log @@ -1,5 +1,5 @@ +target does not exist --- index.html --> ./index.js alt attribute missing --- index.html --> src attribute missing --- index.html --> target does not exist --- pages/info/about.html --> /images/self.jpg -target does not exist --- pages/repo/github/repos.html --> images/favicon.png missing doctype --- src/html/headers.html --> diff --git a/tmp/.htmltest/refcache.json b/tmp/.htmltest/refcache.json index 12dbf99e..3f2b0ec8 100644 --- a/tmp/.htmltest/refcache.json +++ b/tmp/.htmltest/refcache.json @@ -1 +1 @@ -{"https://cdn.jsdelivr.net/gh/devicons/devicon@v2.15.1/devicon.min.css":{"StatusCode":206,"LastSeen":"2023-10-03T16:37:13.229451+08:00"}} +{"https://avatars.githubusercontent.com/u/97672521":{"StatusCode":206,"LastSeen":"2023-10-05T19:03:42.583545+08:00"},"https://cdn.jsdelivr.net/gh/devicons/devicon@v2.15.1/devicon.min.css":{"StatusCode":206,"LastSeen":"2023-10-03T16:37:13.229451+08:00"}} -- cgit v1.2.3