From c80aa25bf64ec3584694af7bc5429519f48cfdbd Mon Sep 17 00:00:00 2001 From: RasperMaths <131694670+RasperRevision@users.noreply.github.com> Date: Sun, 7 Jul 2024 16:56:13 +0100 Subject: [PATCH] added dom listeners --- index.html | 383 ++++++++++++++++++++++++++--------------------------- sidebar.js | 54 ++++---- 2 files changed, 216 insertions(+), 221 deletions(-) diff --git a/index.html b/index.html index ebbfb26..2e1aecc 100644 --- a/index.html +++ b/index.html @@ -59,228 +59,221 @@ diff --git a/sidebar.js b/sidebar.js index d2f83e1..211deaf 100644 --- a/sidebar.js +++ b/sidebar.js @@ -1,31 +1,33 @@ -fetch('/sidebar_header.html') - .then(response => response.text()) - .then(html => { - document.querySelector('.main_wrapper').innerHTML = html + document.querySelector('.main_wrapper').innerHTML; - }).catch(error => console.error('Error fetching sidebar:', error)); +document.addEventListener('DOMContentLoaded', function () { + fetch('/sidebar_header.html') + .then(response => response.text()) + .then(html => { + document.querySelector('.main_wrapper').innerHTML = html + document.querySelector('.main_wrapper').innerHTML; + }).catch(error => console.error('Error fetching sidebar:', error)); -var icon = document.createElement('div'); -var icon1 = document.createElement('div'); -var icon2 = document.createElement('div'); -var icon3 = document.createElement('div'); + var icon = document.createElement('div'); + var icon1 = document.createElement('div'); + var icon2 = document.createElement('div'); + var icon3 = document.createElement('div'); -icon.id = "icon"; -icon.classList.add('hamburger-icon'); -icon1.id = "a"; -icon1.classList.add('icon-1'); -icon2.id = "b"; -icon2.classList.add('icon-2'); -icon3.id = "c"; -icon3.classList.add('icon-3'); + icon.id = "icon"; + icon.classList.add('hamburger-icon'); + icon1.id = "a"; + icon1.classList.add('icon-1'); + icon2.id = "b"; + icon2.classList.add('icon-2'); + icon3.id = "c"; + icon3.classList.add('icon-3'); -icon.appendChild(icon1); -icon.appendChild(icon2); -icon.appendChild(icon3); -document.body.appendChild(icon); + icon.appendChild(icon1); + icon.appendChild(icon2); + icon.appendChild(icon3); + document.body.appendChild(icon); -icon.addEventListener('click', function () { - document.getElementById('sidebar').classList.toggle('active'); - icon1.classList.toggle('a'); - icon2.classList.toggle('c'); - icon3.classList.toggle('b'); + icon.addEventListener('click', function () { + document.getElementById('sidebar').classList.toggle('active'); + icon1.classList.toggle('a'); + icon2.classList.toggle('c'); + icon3.classList.toggle('b'); + }); });