From 13a2eec05d23164ff5a27872cb4e476c86152414 Mon Sep 17 00:00:00 2001
From: David Kaltschmidt <david.kaltschmidt@gmail.com>
Date: Tue, 24 Nov 2015 18:49:49 +0100
Subject: [PATCH] Loading details header now has node color

---
 client/app/scripts/components/node-details.js | 16 ++++++++++++----
 client/app/styles/main.less                   |  4 ----
 2 files changed, 12 insertions(+), 8 deletions(-)

diff --git a/client/app/scripts/components/node-details.js b/client/app/scripts/components/node-details.js
index 075e498fb..26b98e19c 100644
--- a/client/app/scripts/components/node-details.js
+++ b/client/app/scripts/components/node-details.js
@@ -21,15 +21,23 @@ const NodeDetails = React.createClass({
   },
 
   renderLoading: function() {
+    const node = this.props.nodes.get(this.props.nodeId);
+    const nodeColor = this.getNodeColorDark(node.get('rank'), node.get('label_major'));
+    const styles = {
+      header: {
+        'backgroundColor': nodeColor
+      }
+    };
+
     return (
       <div className="node-details">
-        <div className="node-details-header node-details-header-loading">
+        <div className="node-details-header" style={styles.header}>
           <div className="node-details-header-wrapper">
-            <h2 className="node-details-header-label">
-              Loading...
+            <h2 className="node-details-header-label truncate">
+              {node.get('label_major')}
             </h2>
             <div className="node-details-header-label-minor truncate">
-              {this.props.nodeId}
+              {node.get('label_minor')}
             </div>
           </div>
         </div>
diff --git a/client/app/styles/main.less b/client/app/styles/main.less
index 24c1c2c93..73e06316b 100644
--- a/client/app/styles/main.less
+++ b/client/app/styles/main.less
@@ -390,10 +390,6 @@ h2 {
       background-color: @background-dark-color;
     }
 
-    &-loading {
-      background-color: @background-medium-color;
-    }
-
   }
 
   &-controls {