Fix tooltip styles (#151)

* Fix tooltip styles * add dangling line * Update src/tooltip/index.ts Co-authored-by: Kyle Barron <[email protected]> --------- Co-authored-by: Kyle Barron <[email protected]>
developmentseed · Oct 27, 2023 · 11bfc42 · 11bfc42
1 parent cf5c3b2
commit 11bfc42
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 11 deletions.
diff --git a/src/tooltip/index.css b/src/tooltip/index.css
@@ -1,12 +1,3 @@
-.lonboard-tooltip {
-  z-index: 1;
-  position: absolute;
-  color: black;
-  background-color: white;
-  padding: 10px;
-  box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
-}
-
 /* Remove spaces between table cells */
 .lonboard-tooltip table {
   border-collapse: collapse;
@@ -23,11 +14,11 @@
 
 /* Define table cell borders and padding */
 .lonboard-tooltip td {
-  border: 1px solid;
+  border: 1px solid rgb(204, 204, 204);
   padding: 5px;
 }
 
 /* Make the first column bold */
 .lonboard-tooltip td:first-child {
-  font-weight: bold;
+  font-weight: 450;
 }
diff --git a/src/tooltip/index.ts b/src/tooltip/index.ts
@@ -36,6 +36,12 @@ export function getTooltip({ object }: GeoArrowPickingInfo): TooltipContent {
     return {
       className: "lonboard-tooltip",
       html: toHtmlTable(jsonObj),
+      style: {
+        backgroundColor: "#fff",
+        boxShadow: "0 0 15px rgba(0, 0, 0, 0.1)",
+        color: "#000",
+        padding: "6px",
+      },
     };
   }