27 lines
842 B
TypeScript
27 lines
842 B
TypeScript
import { cn } from "@/lib/utils";
|
|
import type { Team } from "../types";
|
|
|
|
type TeamCardProps = {
|
|
team: Team;
|
|
active: boolean;
|
|
score: number;
|
|
};
|
|
|
|
export function TeamCard({ team, active, score }: TeamCardProps) {
|
|
const red = team === "red";
|
|
|
|
return (
|
|
<div
|
|
className={cn(
|
|
"pk-team-card flex-1 rounded-lg border-4 p-[clamp(10px,1.6vw,16px)] text-center transition",
|
|
red ? "bg-red-50 text-red-700" : "bg-blue-50 text-blue-700",
|
|
active && (red ? "border-red-400 shadow-lg" : "border-blue-400 shadow-lg"),
|
|
!active && "border-transparent",
|
|
)}
|
|
>
|
|
<div className="pk-team-label text-[clamp(16px,1.8vw,22px)] font-bold">{red ? "🔴 红队" : "🔵 蓝队"}</div>
|
|
<div className="pk-team-score text-[clamp(30px,4vw,48px)] font-black leading-tight">{score}</div>
|
|
</div>
|
|
);
|
|
}
|