Merge remote-tracking branch 'upstream/develop' into emoji-optimizations

* upstream/develop: (95 commits)
  Lightbox/modal multi image improvements - #381
  '/api/pleroma/profile/mfa' -> '/api/pleroma/accounts/mfa'
  Add ability to change user's email
  translations-de-batch-1
  eu-translate update
  profile-banner rounding css, fixes #690
  fix indentation
  remove needless ref
  show preview popover when hover numbered replies
  refactor conditions
  do not make too many nested div
  add fetchStatus action
  refactor status loading logic
  split status preview popover into a separate component
  uninstall mobile-detect library
  listen both events
  minor css fix
  restrict distance at top side only
  set different trigger event in desktop and mobile by default
  fix eslint warnings
  ...

1 files changed, 29 insertions, 22 deletions

diff --git a/src/directives/body_scroll_lock.js b/src/directives/body_scroll_lock.js
index 6ab20c3f..13a6de1c 100644
--- a/src/directives/body_scroll_lock.js
+++ b/src/directives/body_scroll_lock.js
@@ -2,42 +2,49 @@ import * as bodyScrollLock from 'body-scroll-lock'
 
 let previousNavPaddingRight
 let previousAppBgWrapperRight
+const lockerEls = new Set([])
 
 const disableBodyScroll = (el) => {
   const scrollBarGap = window.innerWidth - document.documentElement.clientWidth
   bodyScrollLock.disableBodyScroll(el, {
     reserveScrollBarGap: true
   })
+  lockerEls.add(el)
   setTimeout(() => {
-    // If previousNavPaddingRight is already set, don't set it again.
-    if (previousNavPaddingRight === undefined) {
-      const navEl = document.getElementById('nav')
-      previousNavPaddingRight = window.getComputedStyle(navEl).getPropertyValue('padding-right')
-      navEl.style.paddingRight = previousNavPaddingRight ? `calc(${previousNavPaddingRight} + ${scrollBarGap}px)` : `${scrollBarGap}px`
+    if (lockerEls.size <= 1) {
+      // If previousNavPaddingRight is already set, don't set it again.
+      if (previousNavPaddingRight === undefined) {
+        const navEl = document.getElementById('nav')
+        previousNavPaddingRight = window.getComputedStyle(navEl).getPropertyValue('padding-right')
+        navEl.style.paddingRight = previousNavPaddingRight ? `calc(${previousNavPaddingRight} + ${scrollBarGap}px)` : `${scrollBarGap}px`
+      }
+      // If previousAppBgWrapeprRight is already set, don't set it again.
+      if (previousAppBgWrapperRight === undefined) {
+        const appBgWrapperEl = document.getElementById('app_bg_wrapper')
+        previousAppBgWrapperRight = window.getComputedStyle(appBgWrapperEl).getPropertyValue('right')
+        appBgWrapperEl.style.right = previousAppBgWrapperRight ? `calc(${previousAppBgWrapperRight} + ${scrollBarGap}px)` : `${scrollBarGap}px`
+      }
+      document.body.classList.add('scroll-locked')
     }
-    // If previousAppBgWrapeprRight is already set, don't set it again.
-    if (previousAppBgWrapperRight === undefined) {
-      const appBgWrapperEl = document.getElementById('app_bg_wrapper')
-      previousAppBgWrapperRight = window.getComputedStyle(appBgWrapperEl).getPropertyValue('right')
-      appBgWrapperEl.style.right = previousAppBgWrapperRight ? `calc(${previousAppBgWrapperRight} + ${scrollBarGap}px)` : `${scrollBarGap}px`
-    }
-    document.body.classList.add('scroll-locked')
   })
 }
 
 const enableBodyScroll = (el) => {
+  lockerEls.delete(el)
   setTimeout(() => {
-    if (previousNavPaddingRight !== undefined) {
-      document.getElementById('nav').style.paddingRight = previousNavPaddingRight
-      // Restore previousNavPaddingRight to undefined so disableBodyScroll knows it can be set again.
-      previousNavPaddingRight = undefined
-    }
-    if (previousAppBgWrapperRight !== undefined) {
-      document.getElementById('app_bg_wrapper').style.right = previousAppBgWrapperRight
-      // Restore previousAppBgWrapperRight to undefined so disableBodyScroll knows it can be set again.
-      previousAppBgWrapperRight = undefined
+    if (lockerEls.size === 0) {
+      if (previousNavPaddingRight !== undefined) {
+        document.getElementById('nav').style.paddingRight = previousNavPaddingRight
+        // Restore previousNavPaddingRight to undefined so disableBodyScroll knows it can be set again.
+        previousNavPaddingRight = undefined
+      }
+      if (previousAppBgWrapperRight !== undefined) {
+        document.getElementById('app_bg_wrapper').style.right = previousAppBgWrapperRight
+        // Restore previousAppBgWrapperRight to undefined so disableBodyScroll knows it can be set again.
+        previousAppBgWrapperRight = undefined
+      }
+      document.body.classList.remove('scroll-locked')
     }
-    document.body.classList.remove('scroll-locked')
   })
   bodyScrollLock.enableBodyScroll(el)
 }