PR comment - Add "SpanID:" label

https://github.com/uber/jaeger-ui/pull/64#issuecomment-324080675
jaegertracing · Aug 22, 2017 · 7204684 · 7204684
1 parent 83b28d5
commit 7204684
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 2 deletions.
diff --git a/src/components/TracePage/TraceTimelineViewer/SpanDetail/index.css b/src/components/TracePage/TraceTimelineViewer/SpanDetail/index.css
@@ -21,9 +21,21 @@ THE SOFTWARE.
 */
 
 .SpanDetail--debugInfo {
-  color: #888;
   display: block;
   letter-spacing: 0.25px;
   margin: 0.5em 0 -0.75em;
   text-align: right;
 }
+
+.SpanDetail--debugLabel::before {
+  color: #bbb;
+  content: attr(data-label);
+}
+
+.SpanDetail--debugValue {
+  color: #888;
+}
+
+.SpanDetail--debugValue:hover {
+  color: #333;
+}
diff --git a/src/components/TracePage/TraceTimelineViewer/SpanDetail/index.js b/src/components/TracePage/TraceTimelineViewer/SpanDetail/index.js
@@ -67,7 +67,8 @@ export default function SpanDetail(props) {
         {span.logs && span.logs.length > 0 && <AccordianLogs logs={span.logs} timestamp={trace.startTime} />}
 
         <small className="SpanDetail--debugInfo">
-          {span.spanID}
+          <span className="SpanDetail--debugLabel" data-label="SpanID:" />{' '}
+          <span className="SpanDetail--debugValue">{span.spanID}</span>
         </small>
       </div>
     </div>