From db6ad98eb4ecbf8267d4338063bb412708624713 Mon Sep 17 00:00:00 2001
From: Michael Lange <dingoeatingfuzz@gmail.com>
Date: Fri, 7 Sep 2018 17:16:20 -0700
Subject: [PATCH] Make the tooltip animation snappier for line charts

When data is coming in live, the tooltip can get bogged down by updates
causing the tooltip to never make it under the mouse, which looks like
either lag or a bug.
---
 ui/app/styles/charts/tooltip.scss          | 4 ++++
 ui/app/templates/components/line-chart.hbs | 2 +-
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/ui/app/styles/charts/tooltip.scss b/ui/app/styles/charts/tooltip.scss
index 3e128134b..028b7b944 100644
--- a/ui/app/styles/charts/tooltip.scss
+++ b/ui/app/styles/charts/tooltip.scss
@@ -15,6 +15,10 @@
     pointer-events: none;
     z-index: $z-tooltip;
 
+    &.is-snappy {
+      transition: 0.2s top ease-out, 0.05s left ease-out;
+    }
+
     &::before {
       pointer-events: none;
       display: inline-block;
diff --git a/ui/app/templates/components/line-chart.hbs b/ui/app/templates/components/line-chart.hbs
index caf237d4e..a5add6a24 100644
--- a/ui/app/templates/components/line-chart.hbs
+++ b/ui/app/templates/components/line-chart.hbs
@@ -16,7 +16,7 @@
   <g class="x-axis axis" transform="translate(0, {{xAxisOffset}})"></g>
   <g class="y-axis axis" transform="translate({{yAxisOffset}}, 0)"></g>
 </svg>
-<div class="chart-tooltip {{if isActive "active" "inactive"}}" style={{tooltipStyle}}>
+<div class="chart-tooltip is-snappy {{if isActive "active" "inactive"}}" style={{tooltipStyle}}>
   <ol>
     <p>
       <span class="label">