add custom chartjs tooltip

2020-03-29 16:51:12 -04:00
parent 3840d57f8d
commit 7aca2bcbc0
4 changed files with 95 additions and 1 deletions
@@ -1,3 +1,27 @@
+// Chart.js styles
+#chartjs-tooltip {
+    /* max z-index value */
+    z-index: 2147483647;
+    opacity: 0;
+    position: absolute;
+    background: rgba(0, 0, 0, .7);
+    color: white;
+    border-radius: 3px;
+    -webkit-transition: opacity .3s ease;
+    transition: opacity .3s ease;
+    pointer-events: none;
+    -webkit-transform: translate(-50%, 0);
+    transform: translate(-50%, 0);
+}
+
+.chartjs-tooltip-key {
+    display: inline-block;
+    width: 10px;
+    height: 10px;
+    margin-right: 10px;
+}
+
+
 // Custom Theming for Angular Material
 // For more information: https://material.angular.io/guide/theming
@import '~@angular/material/theming';