Added HoverTooltip component. Removed react-tooltip.

2023-03-14 11:35:24 -07:00
parent 9a3e8921a7
commit 3823705fc6
9 changed files with 56 additions and 75 deletions
--- a/components/common/HoverTooltip.module.css
+++ b/components/common/HoverTooltip.module.css
@@ -0,0 +1,43 @@
+.chart {
+  position: relative;
+}
+
+.tooltip {
+  position: fixed;
+  pointer-events: none;
+  z-index: 1;
+}
+
+.content {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  text-align: center;
+}
+
+.title {
+  font-size: var(--font-size-xs);
+  font-weight: 600;
+}
+
+.metric {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: var(--font-size-sm);
+  font-weight: 600;
+}
+
+.dot {
+  position: relative;
+  overflow: hidden;
+  border-radius: 100%;
+  margin-right: 8px;
+  background: var(--base50);
+}
+
+.color {
+  width: 10px;
+  height: 10px;
+}