From ee98a49366187c859bce6b4a5e445a351953cb9e Mon Sep 17 00:00:00 2001
From: Simon Vieille <simon@deblan.fr>
Date: Tue, 15 Mar 2022 10:51:40 +0100
Subject: [PATCH] fix blank line when settings are open

---
 css/sideMenu.css             |  4 ++++
 package.json                 |  4 ++--
 templates/js/_topMenuApps.js |  1 -
 templates/js/script.php      | 15 +++++++++++++++
 4 files changed, 21 insertions(+), 3 deletions(-)

diff --git a/css/sideMenu.css b/css/sideMenu.css
index 4de43d4..86436cb 100644
--- a/css/sideMenu.css
+++ b/css/sideMenu.css
@@ -298,6 +298,10 @@
     padding: 10px 0;
 }
 
+.side-menu-always-displayed #body-settings, #body-settings.body-settings-side-menu {
+    overflow-x: visible;
+}
+
 @media screen and (max-width: 1024px) {
     #side-menu.side-menu-big {
         max-width: 290px;
diff --git a/package.json b/package.json
index f38078f..cf982d8 100644
--- a/package.json
+++ b/package.json
@@ -21,7 +21,7 @@
 		"extends @nextcloud/browserslist-config"
 	],
 	"engines": {
-		"node": ">=10.0.0"
+		"node": ">=16.0.0"
 	},
 	"devDependencies": {
 		"@babel/core": "^7.9.0",
@@ -43,9 +43,9 @@
 		"eslint-plugin-standard": "^4.0.1",
 		"eslint-plugin-vue": "^5.2.3",
 		"file-loader": "^6.0.0",
-		"node-sass": "^4.13.1",
 		"sass-loader": "^8.0.2",
 		"stylelint": "^8.4.0",
+		"sass": "^1.49.9",
 		"stylelint-config-recommended-scss": "^3.3.0",
 		"stylelint-scss": "^3.16.0",
 		"stylelint-webpack-plugin": "^0.10.5",
diff --git a/templates/js/_topMenuApps.js b/templates/js/_topMenuApps.js
index 1cee506..2a2954b 100644
--- a/templates/js/_topMenuApps.js
+++ b/templates/js/_topMenuApps.js
@@ -71,7 +71,6 @@ const updateTopMenu = function() {
         if (targetBlankApps.indexOf(dataId) !== -1) {
             querySelector('a', app).setAttribute('target', '_blank')
         }
-
     }
 
     navigationApps.innerHTML = navigationAppsHtml
diff --git a/templates/js/script.php b/templates/js/script.php
index e133d10..5e31fec 100644
--- a/templates/js/script.php
+++ b/templates/js/script.php
@@ -171,6 +171,21 @@ if ($_['always-displayed']) {
                 sideMenuFocus()
             }
         })
+
+        const sideMenuObserver = new MutationObserver((e) => {
+            if (body.getAttribute('id') !== 'body-settings') {
+                return
+            }
+
+            body.classList.toggle('body-settings-side-menu', sideMenu.classList.contains('open'))
+        })
+
+        sideMenuObserver.observe(sideMenu, {
+            attributes: true,
+            attributeFilter: ['class'],
+            childList: false,
+            characterData: false
+        })
     })
 
     body.appendChild(sideMenuContainer)