Wrap the message content in a pre-scrollable to make sure it doesn't …

…obliterate the screen real estate
reiseburo · Nov 25, 2014 · 5b15740 · 5b15740
1 parent f5b619f
commit 5b15740
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 2 deletions.
diff --git a/build.gradle b/build.gradle
@@ -8,7 +8,7 @@ plugins {
 apply plugin: 'groovy'
 ////////////////////////////////////////////////////////////////////////////////
 
-
+version = '0.1.0'
 group = 'offtopic'
 description =' Offtopic is a simple web application built with Ratpack for inspecting and consuming events from Kafka.'
 sourceCompatibility = '1.7'

diff --git a/src/ratpack/public/css/offtopic.css b/src/ratpack/public/css/offtopic.css
@@ -14,3 +14,6 @@ body {
     margin-left: 3px;
     margin-right: 3px;
 }
+
+.message-raw {
+}
diff --git a/src/ratpack/public/js/ws.js b/src/ratpack/public/js/ws.js
@@ -17,7 +17,8 @@ function watchTopic(name) {
                 var el_id = Math.floor(Math.random() * 1000000);
                 var el = ["<div id='" + el_id + "' class='list-group-item'>",
                           "<code>" + data.topic + "</code>",
-                          data.raw + "<br/><div id='" +  el_id + "_b64'",
+                          '<pre class="pre-scrollable message-raw">' + data.raw + '</pre>',
+                          "<br/><div class='message-b64' id='" +  el_id + "_b64'",
                           "style='display:none;'><pre>" + data.b64 + "</pre></div>"].join("\n");
                 messages.prepend(el);
                 $("#" + el_id).click(function(ev) {