From e7583c4c291e6ae3ae873f0cf549a2981fb00c64 Mon Sep 17 00:00:00 2001
From: Martin Schuhmacher <55735359+MartinSchuhmacher@users.noreply.github.com>
Date: Tue, 18 Jun 2024 13:50:09 +0200
Subject: [PATCH] BC-7415 - Make sidebar usable on tablets (#3457)

* fixing sidebar on mobile

* adjust window behaviour when clicked or touched outside of the overlay
---
 static/scripts/loggedin.js | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/static/scripts/loggedin.js b/static/scripts/loggedin.js
index bfa86d9282..8fa0e3be06 100644
--- a/static/scripts/loggedin.js
+++ b/static/scripts/loggedin.js
@@ -63,6 +63,7 @@ function adjustContentWidth(sidebar) {
 function toggleSidebar() {
     const sidebar = document.querySelector('.sidebar');
     const overlay = document.querySelector('.overlay');
+    const contentDiv = document.querySelector('.content-min-height');
 
 	if (sidebar) {
 		if (sidebar.classList.contains('hidden')) {
@@ -71,6 +72,9 @@ function toggleSidebar() {
 
             if (window.innerWidth <= 1279) {
                 overlay.style.display = "block";
+                overlay.style.position = "fixed";
+                contentDiv.style.position = "fixed";
+                sidebar.style.height = "100%";
             }
         } else {
             sidebar.classList.remove('visible');
@@ -78,6 +82,9 @@ function toggleSidebar() {
 
             if (window.innerWidth <= 1279) {
                 overlay.style.display = "none";
+                overlay.style.position = "absolute";
+                contentDiv.style.position = "static";
+                sidebar.style.height = "unset";
             }
         }
 
@@ -232,11 +239,15 @@ $(document).ready(function () {
     toggleSidebarOnWindowWidth(sidebar);
 
     const overlay = document.querySelector('.overlay');
+    const contentDiv = document.querySelector('.content-min-height');
     if (overlay) {
         overlay.addEventListener('click', () => {
             sidebar.classList.remove('visible');
             sidebar.classList.add('hidden');
+            sidebar.style.height = "unset";
             overlay.style.display = "none";
+            overlay.style.position = "absolute";
+            contentDiv.style.position = "static";
         });
     }