commit 28dc357f3dc17884f820b1dfaf53d92f7e5fdc7b
author Ning Wang <nwang@twitter.com> Fri Oct 04 23:06:03 2019 -0700
committer GitHub <noreply@github.com> Fri Oct 04 23:06:03 2019 -0700
tree 9c51116c466c7804318df92b31eb1d144c7f4ee7
parent b71572dc0c8b1f3785299bd02e5d160bf43d8d8a

Add a delay for showing tooltip, format visstyle css file (#3358)

heron/tools/ui/resources/static/css/visstyle.css

diff --git a/heron/tools/ui/resources/static/css/visstyle.css b/heron/tools/ui/resources/static/css/visstyle.css
index 3d48880..34bee52 100644
--- a/heron/tools/ui/resources/static/css/visstyle.css
+++ b/heron/tools/ui/resources/static/css/visstyle.css
@@ -139,6 +139,7 @@
 
 .d3-tip {
   max-width: 400px;
+  transition-delay: 0.25s;
 }
 
 path.regular, rect.regular {
@@ -241,19 +242,19 @@
 }
 
 .topotable>thead>tr>th, .topotable>tbody>tr>th, .topotable>tfoot>tr>th, .topotable>thead>tr>td, .topotable>tbody>tr>td, .topotable>tfoot>tr>td {
-font-size: 14px;
-padding: 8px;
-line-height: 1.42857143;
-vertical-align: top;
-border-top: 1px solid #dddddd;
+  font-size: 14px;
+  padding: 8px;
+  line-height: 1.42857143;
+  vertical-align: top;
+  border-top: 1px solid #dddddd;
 }
 
 .break-all {
-word-break: break-all;
+  word-break: break-all;
 }
 
 .no-break {
-white-space: nowrap
+  white-space: nowrap
 }
 
 .strong {
@@ -261,16 +262,16 @@
 }
 
 .topotable .topobutton {
-padding: 2px;
+  padding: 2px;
 }
 
 .topotable .topobutton a {
-margin-left: 8px;
-visibility: hidden;
+  margin-left: 8px;
+  visibility: hidden;
 }
 
 .topotable tr:hover .topobutton a {
-visibility: visible;
+  visibility: visible;
 }
 .vcenter {
     display: inline-block;
@@ -279,76 +280,76 @@
 }
 
 .action-button-group {
-position: absolute;
-right: 10px;
-top: 2px;
+  position: absolute;
+  right: 10px;
+  top: 2px;
 }
 
 .sort.asc {
-background-color: lightgrey;
+  background-color: lightgrey;
 }
 
 .sort.desc {
-background-color: lightgrey;
+  background-color: lightgrey;
 }
 
 /* Sort arrows */
 .sort:after {
-width: 0;
-height: 0;
-border-left: 5px solid transparent;
-border-right: 5px solid transparent;
-border-bottom: 5px solid transparent;
-border-top: 5px solid transparent;
-content:"";
-position: relative;
-top:-10px;
-right:-5px;
+  width: 0;
+  height: 0;
+  border-left: 5px solid transparent;
+  border-right: 5px solid transparent;
+  border-bottom: 5px solid transparent;
+  border-top: 5px solid transparent;
+  content:"";
+  position: relative;
+  top:-10px;
+  right:-5px;
 }
 
 .sort.asc:after {
-width: 0;
-height: 0;
-border-left: 5px solid transparent;
-border-right: 5px solid transparent;
-border-bottom: 5px solid transparent;
-border-top: 5px solid black;
-content:"";
-position: relative;
-top:10px;
-right:-5px;
+  width: 0;
+  height: 0;
+  border-left: 5px solid transparent;
+  border-right: 5px solid transparent;
+  border-bottom: 5px solid transparent;
+  border-top: 5px solid black;
+  content:"";
+  position: relative;
+  top:10px;
+  right:-5px;
 }
 
 .sort.desc:after {
-width: 0;
-height: 0;
-border-left: 5px solid transparent;
-border-right: 5px solid transparent;
-border-bottom: 5px solid black;
-border-top: 5px solid transparent;
-content:"";
-position: relative;
-top:-10px;
-right:-5px;
+  width: 0;
+  height: 0;
+  border-left: 5px solid transparent;
+  border-right: 5px solid transparent;
+  border-bottom: 5px solid black;
+  border-top: 5px solid transparent;
+  content:"";
+  position: relative;
+  top:-10px;
+  right:-5px;
 }
 
 .search-result {
-color: grey;
-font-size: 14px;
-line-height: 30px;
+  color: grey;
+  font-size: 14px;
+  line-height: 30px;
 }
 
 /* When the topology is dead */
 .dead {
-color: red;
+  color: red;
 }
 
 /* When the topology is weird state */
 .weird {
-color: orange;
+  color: orange;
 }
 
 /* When the topology is starting */
 .starting {
-color: green;
+  color: green;
 }