Update frappe-charts, use Frontend extender, fix color & comparison CSS

extensions/statistics/less/admin.less

@@ -61,11 +61,96 @@
 }
 .StatisticsWidget-chart {
   clear: left;
-  max-width: 600px;
   margin: -20px -10px;
+}
+.StatisticsWidget-chart .chart-container {
+  position: relative;
+  .frappe-chart {
+    height: 160px !important;
 
+    .line-chart {
+      .dataset-0 {
+        opacity: 0.2;
+
+        path {
+          stroke: #7f7f7f !important;
+        }
+
+        circle {
+          fill: #7f7f7f !important;
+        }
+      }
+    }
+  }
+  .chart-legend {
+    display: none;
+  }
   // Hide the "last period" data from the tooltip
-  .chart-container .graph-svg-tip ul.data-point-list > li:first-child {
+  .graph-svg-tip ul.data-point-list > li:first-child {
     display: none;
   }
 }
+
+/*!
+ * Frappe Charts 1.0.0 by @frappe - https://frappe.io/charts
+ * License - MIT https://github.com/frappe/charts/blob/master/LICENSE
+ */
+.StatisticsWidget-chart .chart-container .graph-svg-tip {
+  position: absolute;
+  z-index: 99999;
+  padding: 10px;
+  font-size: 12px;
+  color: #959da5;
+  text-align: center;
+  background: rgba(0, 0, 0, 0.8);
+  border-radius: 3px;
+  ul {
+    padding-left: 0;
+    display: flex;
+  }
+  ol {
+    padding-left: 0;
+    display: flex;
+  }
+  ul.data-point-list {
+    li {
+      min-width: 90px;
+      flex: 1;
+      font-weight: 600;
+    }
+  }
+  strong {
+    color: #dfe2e5;
+    font-weight: 600;
+  }
+  .svg-pointer {
+    position: absolute;
+    height: 5px;
+    margin: 0 0 0 -5px;
+    content: ' ';
+    border: 5px solid transparent;
+    border-top-color: rgba(0, 0, 0, 0.8);
+  }
+  &.comparison {
+    padding: 0;
+    text-align: left;
+    pointer-events: none;
+    .title {
+      display: block;
+      padding: 10px;
+      margin: 0;
+      font-weight: 600;
+      line-height: 1;
+      pointer-events: none;
+    }
+    ul {
+      margin: 0;
+      white-space: nowrap;
+      list-style: none;
+    }
+    li {
+      display: inline-block;
+      padding: 5px 10px;
+    }
+  }
+}