| const sidebar = document.querySelector(".sidebar"); | |
| const menuButton = document.querySelector(".menu-button"); | |
| function toggleSidebar(event) { | |
| if (sidebar.classList.contains("shown")) { | |
| hideSidebar(event.target); | |
| } else { | |
| showSidebar(event.target); | |
| } | |
| window.scrollTo(0, 0); | |
| } | |
| function showSidebar(target) { | |
| sidebar.classList.add("shown"); | |
| target.classList.add("rotated"); | |
| document.body.style.overflow = "hidden"; | |
| } | |
| function hideSidebar(target) { | |
| sidebar.classList.remove("shown"); | |
| target.classList.remove("rotated"); | |
| document.body.style.overflow = "auto"; | |
| } | |
| menuButton.addEventListener("click", toggleSidebar); | |
| document.body.addEventListener('click', function(event) { | |
| if (event.target.matches('.conversation-title')) { | |
| const menuButtonStyle = window.getComputedStyle(menuButton); | |
| if (menuButtonStyle.display !== 'none') { | |
| hideSidebar(menuButton); | |
| } | |
| } | |
| }); | |