From d7f9e378fefef81b5b3849b1c108e5b41d4d6229 Mon Sep 17 00:00:00 2001
From: hamster1963 <1410514192@qq.com>
Date: Sat, 25 Jan 2025 10:57:16 +0800
Subject: [PATCH] style: better network tooltip

---
 components/ui/chart.tsx | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/components/ui/chart.tsx b/components/ui/chart.tsx
index 1f5cbfe..c48ea03 100644
--- a/components/ui/chart.tsx
+++ b/components/ui/chart.tsx
@@ -164,12 +164,19 @@ const ChartTooltipContent = React.forwardRef<
       <div
         ref={ref}
         className={cn(
-          "grid min-w-[8rem] items-start gap-1.5 rounded-sm border border-border/50 bg-background px-2.5 py-1.5 text-xs shadow-xl",
+          "grid min-w-[8rem] items-start overflow-hidden gap-1.5 rounded-sm border border-border/50 bg-stone-100 dark:bg-stone-900 text-xs shadow-xl",
           className,
         )}
       >
-        {!nestLabel ? tooltipLabel : null}
-        <div className="grid gap-1.5">
+        {!nestLabel && (
+          <p className="px-2.5 pt-1 mx-auto -mb-1">{!nestLabel ? tooltipLabel : null}</p>
+        )}
+
+        <div
+          className={cn("grid gap-1.5 bg-white dark:bg-black px-2.5 py-1.5", {
+            "border-t-[1px]": !nestLabel,
+          })}
+        >
           {payload.map((item, index) => {
             const key = `${nameKey || item.name || item.dataKey || "value"}`
             const itemConfig = getPayloadConfigFromPayload(config, item, key)