Compile message no longer overflows on small screens

gchq · Aug 19, 2018 · f052ed9 · f052ed9
1 parent 2507362
commit f052ed9
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 2 deletions.
diff --git a/src/web/App.mjs b/src/web/App.mjs
@@ -533,7 +533,9 @@ class App {
             compileInfo += " - " + window.compileMessage;
         }
 
-        document.getElementById("notice").innerHTML = compileInfo;
+        const notice = document.getElementById("notice");
+        notice.innerHTML = compileInfo;
+        notice.setAttribute("title", Utils.stripHtmlTags(window.compileMessage));
     }
 
 

diff --git a/src/web/html/index.html b/src/web/html/index.html
@@ -155,7 +155,7 @@
                         <a href="cyberchef.htm" download>Download CyberChef <i class="material-icons">file_download</i></a>
                     <% } %>
                 </div>
-                <div class="col" style="text-align: center;">
+                <div class="col-md-6" id="notice-wrapper">
                     <span id="notice">
                         <script type="text/javascript">
                             // Must be text/javascript rather than application/javascript otherwise IE won't recognise it...

diff --git a/src/web/stylesheets/layout/_banner.css b/src/web/stylesheets/layout/_banner.css
@@ -21,3 +21,10 @@
     vertical-align: middle;
     padding-right: 10px;
 }
+
+#notice-wrapper {
+    text-align: center;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}