From b1742e80cc7d6ae50dba97e1e670a2710ad29934 Mon Sep 17 00:00:00 2001 From: philipp Date: Thu, 7 Dec 2023 11:40:27 +0100 Subject: [PATCH] toggle menu --- index.html | 1 + js/dynamic.js | 9 +++++++++ style.css | 15 +++++++++++++-- 3 files changed, 23 insertions(+), 2 deletions(-) diff --git a/index.html b/index.html index 679cfd5..45bfc48 100644 --- a/index.html +++ b/index.html @@ -26,6 +26,7 @@
+
Navigation
diff --git a/js/dynamic.js b/js/dynamic.js index d95a391..dcbb5c2 100644 --- a/js/dynamic.js +++ b/js/dynamic.js @@ -37,3 +37,12 @@ function update(){ //update the cursor updateCursor(currentSession,currentProgress) } +let menuState = false; +function toggleMenu(){ + menuState = !menuState + if(menuState){ + document.getElementById('menu').classList.add('active') + }else{ + document.getElementById('menu').classList.remove('active') + } +} diff --git a/style.css b/style.css index 4b57d01..08adf32 100644 --- a/style.css +++ b/style.css @@ -161,20 +161,31 @@ a[href^="#"] { .right{ right: 5vw; } +#burger{ + position: fixed; + left: 1%; + top: 1em; + z-index: 5; + color: var(--font); + pointer-events: all; +} #menu{ position: fixed; left: 1%; - top: 50%; - transform: translate(0, -50%); + top: 4em; z-index: 5; color: var(--font); pointer-events: all; font-size: 0.8em; cursor: pointer; + display: none; } #menu p:hover{ text-decoration: underline; } +#menu.active{ + display: block; +} #menu .active{ font-weight: bold; text-decoration: underline;