Fix mobile setting modal behavior: ensure the mobile browser address bar doesn't overlap the modal top panel.

1 files changed, 15 insertions, 0 deletions

diff --git a/src/components/settings_modal/settings_modal.js b/src/components/settings_modal/settings_modal.js
index f0d49c91..b6880445 100644
--- a/src/components/settings_modal/settings_modal.js
+++ b/src/components/settings_modal/settings_modal.js
@@ -36,6 +36,21 @@ const SettingsModal = {
     modalPeeked () {
       return this.$store.state.interface.settingsModalState === 'minimized'
     }
+  },
+  watch: {
+    modalActivated (newValue) {
+      if (newValue) {
+        let html = document.querySelector('html')
+        if (html) {
+          html.classList.add('settings-modal-layout')
+        }
+      } else {
+        let html = document.querySelector('html')
+        if (html) {
+          html.classList.remove('settings-modal-layout')
+        }
+      }
+    }
   }
 }