From 4da2a826028278156e1e0185d42868f4d95e245d Mon Sep 17 00:00:00 2001
From: Simon Howe <footless@gmail.com>
Date: Thu, 3 Nov 2016 13:11:54 +0100
Subject: [PATCH] Add label to show-in-topo button

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

diff --git a/client/app/scripts/components/node-details.js b/client/app/scripts/components/node-details.js
index 56a2c20ee..156f24af8 100644
--- a/client/app/scripts/components/node-details.js
+++ b/client/app/scripts/components/node-details.js
@@ -54,7 +54,9 @@ export class NodeDetails extends React.Component {
       <div className="node-details-tools-wrapper">
         <div className="node-details-tools">
           {showSwitchTopology && <span title={topologyTitle}
-            className="fa fa-exchange" onClick={this.handleShowTopologyForNode} />}
+            className="fa fa-long-arrow-left" onClick={this.handleShowTopologyForNode}>
+            <span>View in {this.props.topologyId}</span>
+          </span>}
           <span title="Close details" className="fa fa-close" onClick={this.handleClickClose} />
         </div>
       </div>
diff --git a/client/app/styles/main.less b/client/app/styles/main.less
index ba220398e..e20c6903b 100644
--- a/client/app/styles/main.less
+++ b/client/app/styles/main.less
@@ -619,7 +619,7 @@ h2 {
     top: 6px;
     right: 8px;
 
-    span {
+    > span {
       .btn-opacity;
       padding: 4px 5px;
       margin-left: 2px;
@@ -627,7 +627,13 @@ h2 {
       color: @white;
       cursor: pointer;
       border: 1px solid rgba(255, 255, 255, 0);
-      border-radius: 10%;
+      border-radius: 4px;
+
+      span {
+        font-family: @base-font;
+        font-size: 0.9em;
+        margin-left: 4px;
+      }
 
       &:hover {
         border-color: rgba(255, 255, 255, 0.6);