From da3b70ee08dd04c613473db1b26267eb4823022f Mon Sep 17 00:00:00 2001
From: Alex P <thealexpaxton@gmail.com>
Date: Mon, 13 Nov 2017 18:15:53 -0800
Subject: [PATCH] WIP Make new log items fade in

---
 ui/src/style/components/kapacitor-logs-table.scss | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/ui/src/style/components/kapacitor-logs-table.scss b/ui/src/style/components/kapacitor-logs-table.scss
index 7f0208d3e7..fed167ff9d 100644
--- a/ui/src/style/components/kapacitor-logs-table.scss
+++ b/ui/src/style/components/kapacitor-logs-table.scss
@@ -38,12 +38,24 @@ $logs-margin: 4px;
   align-items: stretch;
   flex-direction: column;
 }
+@keyframes LogsFadeIn {
+  from {
+    background-color: $g6-smoke;
+  }
+  to {
+    background-color: transparent;
+  }
+}
 .logs-table {
   flex-direction: column-reverse;
 }
 .logs-table--row {
   padding: 8px ($logs-table-padding - 16px) 8px ($logs-table-padding / 2);
   border-bottom: 2px solid $g3-castle;
+  animation-name: LogsFadeIn;
+  animation-duration: 2.5s;
+  animation-iteration-count: 1;
+  animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
   transition: background-color 0.25s ease;
 
   &:hover {