report + harmonize panel-left

assets/js/header.js

@@ -8,6 +8,8 @@ export function headerToggle() {
   });
 }
 
+
+// DELETE ?
 export function headerScrollVisibility() {
   const header = document.getElementById("site-header");
 

assets/js/panel.js

@@ -0,0 +1,19 @@
+export function panelToggle() {
+    const toggleBtn = document.querySelector('#toggle-panel');
+
+    if (toggleBtn) {
+        const main = document.querySelector('main');
+        const closeBtn = document.querySelector('.panel-left .panel__header');
+
+        toggleBtn.addEventListener('click', () => {
+            main.classList.add('panel-open');
+        });
+
+        if (closeBtn) {
+            closeBtn.addEventListener('click', () => {
+                main.classList.remove('panel-open');
+                main.classList.add('panel-close');
+            });
+        }
+    }
+}

assets/js/script.js

@@ -1,5 +1,6 @@
 import { headerToggle, headerScrollVisibility } from './header.js';
 import { copyLink } from './share.js';
+import { panelToggle } from './panel.js';
 import { bannerStickyMobile } from './banner-sticky-mobile.js';
 import { bannerStickyDesktop } from './banner-sticky-desktop.js';
 import { themeToggle } from './themeToggle.js';
@@ -13,7 +14,7 @@ const responsiveSmall = 768;
 window.onload = async function () {
   console.log("SCRIPT LOADED");
   headerToggle();
-  headerScrollVisibility();
+  panelToggle();
   copyLink();
   themeToggle();
   bannerStickyMobile(responsiveSmall);