From ded1431fabcacf23433b8ebf1aa1bb15dff33519 Mon Sep 17 00:00:00 2001
From: dannyrb <danny.ri.brown@gmail.com>
Date: Thu, 14 May 2020 22:53:32 -0400
Subject: [PATCH] Cleaner body styles on enter/exit for LayoutTemplate

---
 extensions/default/src/ViewerLayout/index.jsx | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/extensions/default/src/ViewerLayout/index.jsx b/extensions/default/src/ViewerLayout/index.jsx
index 0c610188f..7d5d2204f 100644
--- a/extensions/default/src/ViewerLayout/index.jsx
+++ b/extensions/default/src/ViewerLayout/index.jsx
@@ -15,6 +15,20 @@ function ViewerLayout({
   displaySetInstanceUids,
   ViewportGrid,
 }) {
+  /**
+   * Set body classes (tailwindcss) that don't allow vertical
+   * or horizontal overflow (no scrolling). Also guarantee window
+   * is sized to our viewport.
+   */
+  useEffect(() => {
+    document.body.classList.add('bg-black');
+    document.body.classList.add('overflow-hidden');
+    return () => {
+      document.body.classList.remove('bg-black');
+      document.body.classList.remove('overflow-hidden');
+    };
+  }, []);
+
   const getPanelData = id => {
     const entry = extensionManager.getModuleEntry(id);
     // TODO, not sure why sidepanel content has to be JSX, and not a children prop?