refactor: improve tooltips

Author: mrholek

scss/_charts.scss

@@ -33,63 +33,23 @@ canvas {
     font-weight: $font-weight-bold;
   }
 
-  // .tooltip-body {}
   .tooltip-body-item {
     display: flex;
     align-items: center;
     font-size: $font-size-sm;
     white-space: nowrap;
   }
 
+  .tooltip-body-item-color {
+    display: inline-block;
+    width: $font-size-base;
+    height: $font-size-base;
+    margin-right: $font-size-base;
+  }
+
   .tooltip-body-item-value {
     padding-left: $spacer;
     margin-left: auto;
     font-weight: $font-weight-bold;
   }
 }
-
-.chartjs-tooltip-key {
-  display: inline-block;
-  width: $font-size-base;
-  height: $font-size-base;
-  margin-right: $font-size-base;
-}
-// .chartjs-tooltip {
-//   position: absolute;
-//   z-index: $zindex-sticky + 1;
-//   display: flex;
-//   flex-direction: column;
-//   padding: ($spacer * .25) ($spacer * .5);
-//   color: $text-muted;
-//   pointer-events: none;
-//   background: #fff;
-//   border: 1px solid $border-color;
-//   opacity: 0;
-//   transition: all .1s ease;
-//   transform: translate(-50%, 0);
-//   @include border-radius($border-radius);
-//
-//   .tooltip-header {
-//     margin-bottom: ($spacer * .5);
-//   }
-//
-//   .tooltip-header-item {
-//     font-size: $font-size-sm;
-//     font-weight: $font-weight-bold;
-//   }
-//
-//   // .tooltip-body {}
-//   .tooltip-body-item {
-//     display: flex;
-//     align-items: center;
-//     font-size: $font-size-sm;
-//     white-space: nowrap;
-//   }
-// }
-//
-// .chartjs-tooltip-key {
-//   display: inline-block;
-//   width: $font-size-base;
-//   height: $font-size-base;
-//   margin-right: $font-size-base;
-// }