From f0b3115be169e26512714e9643bb74ea85dd745e Mon Sep 17 00:00:00 2001
From: Nolan Lawson <nolan@nolanlawson.com>
Date: Fri, 23 Nov 2018 21:33:03 -0800
Subject: [PATCH] fix(scrolling): fix body scrollable when modal is open (#681)

Fixes #680
---
 routes/_components/dialog/components/ModalDialog.html | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/routes/_components/dialog/components/ModalDialog.html b/routes/_components/dialog/components/ModalDialog.html
index 99dcfc5..a333607 100644
--- a/routes/_components/dialog/components/ModalDialog.html
+++ b/routes/_components/dialog/components/ModalDialog.html
@@ -120,6 +120,9 @@
   .muted-style.modal-dialog-contents {
     border: none;
   }
+  :global(body.modal-open) {
+    overflow-y: hidden;
+  }
 </style>
 <script>
   import { A11yDialog } from '../../../_thirdparty/a11y-dialog/a11y-dialog'
@@ -132,6 +135,7 @@
       this._a11yDialog = new A11yDialog(dialogElement)
       this._a11yDialog.on('hide', () => {
         let { id } = this.get()
+        document.body.classList.toggle('modal-open', false)
         this.fire('close')
         this._a11yDialog.destroy()
         emit('destroyDialog', id)
@@ -172,6 +176,7 @@
         if (id !== thisId) {
           return
         }
+        document.body.classList.toggle('modal-open', true)
         this._a11yDialog.show()
         requestAnimationFrame(() => {
           this.set({ fadedIn: true })