From 1fd87bf66467dd9580efe3bb194dd546b9e443f1 Mon Sep 17 00:00:00 2001
From: Nick O'Leary <nick.oleary@gmail.com>
Date: Wed, 16 Nov 2016 15:05:04 +0000
Subject: [PATCH] Improve debug message meta data contrast and legibility

---
 editor/sass/debug.scss                   | 15 ++++++---------
 nodes/core/core/lib/debug/debug-utils.js | 15 ++++++++-------
 2 files changed, 14 insertions(+), 16 deletions(-)

diff --git a/editor/sass/debug.scss b/editor/sass/debug.scss
index dcc72ce8a..f56a8c7f3 100644
--- a/editor/sass/debug.scss
+++ b/editor/sass/debug.scss
@@ -51,24 +51,21 @@
     border-right: 8px solid #eee;
     padding: 2px;
 }
-.debug-message-date {
+.debug-message-meta {
     background: #fff;
-    font-size: 9px;
-    color: #aaa;
+    font-size: 10px;
+    color: #777;
+}
+.debug-message-date {
     padding: 1px 5px 1px 1px;
 }
 .debug-message-topic {
     display: block;
-    background: #fff;
-    padding: 1px;
-    font-size: 10px;
     color: #a66;
 }
 .debug-message-name {
-    background: #fff;
     padding: 1px 5px;
-    font-size: 9px;
-    color: #aac;
+    color: #777;
 }
 .debug-message-payload {
     display: block;
diff --git a/nodes/core/core/lib/debug/debug-utils.js b/nodes/core/core/lib/debug/debug-utils.js
index edb1d6c37..4767733a2 100644
--- a/nodes/core/core/lib/debug/debug-utils.js
+++ b/nodes/core/core/lib/debug/debug-utils.js
@@ -202,16 +202,17 @@ RED.debug = (function() {
         var format = sanitize((o.format||"").toString());
         msg.className = 'debug-message'+(o.level?(' debug-message-level-'+o.level):'') +
         ((sourceNode&&sourceNode.z)?((" debug-message-flow-"+sourceNode.z+((filter&&(activeWorkspace!==sourceNode.z))?" hide":""))):"");
-        $('<span class="debug-message-date">'+ getTimestamp()+'</span>').appendTo(msg);
+        var metaRow = $('<div class="debug-message-meta"></div>').appendTo(msg);
+        $('<span class="debug-message-date">'+ getTimestamp()+'</span>').appendTo(metaRow);
         if (sourceNode) {
             $('<a>',{href:"#",class:"debug-message-name"}).html('node: '+sourceNode.id)
-            .appendTo(msg)
+            .appendTo(metaRow)
             .click(function(evt) {
                 evt.preventDefault();
                 config.messageSourceClick(sourceNode.id);
             });
         } else if (name) {
-            $('<span class="debug-message-name">'+name+'</span>').appendTo(msg);
+            $('<span class="debug-message-name">'+name+'</span>').appendTo(metaRow);
         }
         // NOTE: relying on function error to have a "type" that all other msgs don't
         if (o.hasOwnProperty("type") && (o.type === "function")) {
@@ -222,12 +223,12 @@ RED.debug = (function() {
                 errorLvlType = 'warn';
             }
             $(msg).addClass('debug-message-level-' + errorLvl);
-            $('<span class="debug-message-topic">function : (' + errorLvlType + ')</span>').appendTo(msg);
+            $('<span class="debug-message-topic">function : (' + errorLvlType + ')</span>').appendTo(metaRow);
         } else {
             $('<span class="debug-message-topic">'+
-            (o.topic?topic+' : ':'')+
-            (o.property?'msg.'+property:'msg')+" : "+format+
-            '</span>').appendTo(msg);
+                (o.topic?topic+' : ':'')+
+                (o.property?'msg.'+property:'msg')+" : "+format+
+                '</span>').appendTo(metaRow);
         }
         if (format === 'Object' || /^array/.test(format) || format === 'boolean' || format === 'number'||/error/i.test(format) ) {
             payload = JSON.parse(payload);