Files
openclaw-market/components/globe/lobster-tooltip.tsx
richarjiang fa4c458eda init
2026-03-13 11:00:01 +08:00

29 lines
908 B
TypeScript

"use client";
import { Badge } from "@/components/ui/badge";
interface LobsterTooltipProps {
city: string;
country: string;
lobsterCount: number;
weight: number;
}
export function LobsterTooltip({ city, country, lobsterCount, weight }: LobsterTooltipProps) {
return (
<div className="rounded-xl border border-white/10 bg-[var(--bg-card)]/95 p-3 shadow-xl backdrop-blur-sm">
<div className="flex items-center gap-2">
<span className="text-lg">🦞</span>
<div>
<p className="font-mono text-sm font-medium text-[var(--accent-cyan)]">{city}</p>
<p className="text-xs text-[var(--text-muted)]">{country}</p>
</div>
</div>
<div className="mt-2 flex items-center gap-2">
<Badge variant="online">{lobsterCount} active</Badge>
<Badge variant="secondary">weight: {weight.toFixed(1)}</Badge>
</div>
</div>
);
}