31 lines
1013 B
TypeScript
31 lines
1013 B
TypeScript
"use client";
|
|
|
|
import { useTranslations } from "next-intl";
|
|
import { Badge } from "@/components/ui/badge";
|
|
|
|
interface ClawTooltipProps {
|
|
city: string;
|
|
country: string;
|
|
clawCount: number;
|
|
weight: number;
|
|
}
|
|
|
|
export function ClawTooltip({ city, country, clawCount, weight }: ClawTooltipProps) {
|
|
const t = useTranslations("continentMap");
|
|
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">{t("active", { count: clawCount })}</Badge>
|
|
<Badge variant="secondary">{t("weight", { value: weight.toFixed(1) })}</Badge>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|