diff --git a/ui/src/flux/components/TimeMachineVis.tsx b/ui/src/flux/components/TimeMachineVis.tsx index 6ae3f61ae..098517d6a 100644 --- a/ui/src/flux/components/TimeMachineVis.tsx +++ b/ui/src/flux/components/TimeMachineVis.tsx @@ -54,7 +54,7 @@ class TimeMachineVis extends PureComponent { currentView={visType} onToggleView={this.selectVisType} /> - {yieldName} +
{`"${yieldName}"`}
{this.vis}
diff --git a/ui/src/style/components/time-machine/visualization.scss b/ui/src/style/components/time-machine/visualization.scss index 9074d2b6c..baf054a91 100644 --- a/ui/src/style/components/time-machine/visualization.scss +++ b/ui/src/style/components/time-machine/visualization.scss @@ -27,6 +27,17 @@ $flux-builder-yield-tabs-max-width: 400px; background-color: $g3-castle; padding: $flux-node-padding; border-radius: $radius $radius 0 0; + display: flex; + align-items: center; + justify-content: space-between; +} + +.yield-node--name { + font-size: 12px; + font-weight: 600; + margin-right: 6px; + @include no-user-select(); + color: $c-honeydew; } .yield-node--visualization {