From 5dc2d9e27b250edce06ab2b0aa960d5ed400893b Mon Sep 17 00:00:00 2001
From: Stuart Taylor <staylor1012@gmail.com>
Date: Wed, 7 Mar 2018 21:07:56 +0000
Subject: [PATCH] fix(styles): Overlay js warning to preserve preview pane
 height

---
 common/app/routes/Challenges/Preview.jsx     | 14 ++++++++------
 common/app/routes/Challenges/challenges.less |  8 ++++++++
 2 files changed, 16 insertions(+), 6 deletions(-)

diff --git a/common/app/routes/Challenges/Preview.jsx b/common/app/routes/Challenges/Preview.jsx
index 0ca2decdbb..6457e8114c 100644
--- a/common/app/routes/Challenges/Preview.jsx
+++ b/common/app/routes/Challenges/Preview.jsx
@@ -26,12 +26,14 @@ export class Preview extends PureComponent {
       <div className={ `${ns}-preview` }>
         {
           !isJSEnabled && (
-            <Alert
-            bsStyle='info'
-            className={ `${ns}-preview-js-warning`}
-            >
-              JavaScript is disabled. Execute code to enable
-            </Alert>
+            <div className='js-alert-wrapper'>
+              <Alert
+              bsStyle='info'
+              className={ `${ns}-preview-js-warning` }
+              >
+                JavaScript is disabled. Execute code to enable
+              </Alert>
+            </div>
           )
         }
         <iframe
diff --git a/common/app/routes/Challenges/challenges.less b/common/app/routes/Challenges/challenges.less
index c57d2ab4eb..820aa44717 100644
--- a/common/app/routes/Challenges/challenges.less
+++ b/common/app/routes/Challenges/challenges.less
@@ -228,6 +228,14 @@
   .max-element-height();
   width: 100%;
   overflow-y: hidden;
+
+  .js-alert-wrapper {
+    .max-element-height();
+    z-index: 5;
+    position: fixed;
+    width: 100%
+  }
+
 }
 
 .@{ns}-preview-frame {