fix: increase player name padding in match diagram

This commit is contained in:
2026-03-31 03:49:15 -07:00
parent 63956e8087
commit 2fa606d0e0
+4 -4
View File
@@ -89,7 +89,7 @@ export default async function MatchDetailPage({ params }: PageProps) {
{/* Table Square - Larger with more padding */}
<div className="w-72 h-72 bg-amber-100 border-4 border-amber-600 rounded-xl relative shadow-lg">
{/* Top: Team 1 Player 1 */}
<div className="absolute top-0 left-0 right-0 h-1/2 flex flex-col justify-end items-center pb-4">
<div className="absolute top-0 left-0 right-0 h-1/2 flex flex-col justify-end items-center pb-8">
<div className="text-center bg-white/80 rounded-lg px-3 py-2 shadow-sm">
<p className="text-base font-semibold text-amber-900">
{match.team1P1.name}
@@ -107,7 +107,7 @@ export default async function MatchDetailPage({ params }: PageProps) {
</div>
{/* Bottom: Team 2 Player 2 */}
<div className="absolute bottom-0 left-0 right-0 h-1/2 flex flex-col justify-start items-center pt-4">
<div className="absolute bottom-0 left-0 right-0 h-1/2 flex flex-col justify-start items-center pt-8">
<div className="text-xs text-red-600 mb-2 font-medium">Team 2</div>
<div className="text-center bg-white/80 rounded-lg px-3 py-2 shadow-sm">
<p className="text-base font-semibold text-red-900">
@@ -125,7 +125,7 @@ export default async function MatchDetailPage({ params }: PageProps) {
</div>
{/* Left: Team 1 Player 2 */}
<div className="absolute left-0 top-0 bottom-0 w-1/2 flex flex-col justify-center items-center pl-4">
<div className="absolute left-0 top-0 bottom-0 w-1/2 flex flex-col justify-center items-center pl-8">
<div className="text-center bg-white/80 rounded-lg px-3 py-2 shadow-sm rotate-[-90deg]">
<p className="text-sm font-semibold text-amber-900">
{match.team1P2.name}
@@ -142,7 +142,7 @@ export default async function MatchDetailPage({ params }: PageProps) {
</div>
{/* Right: Team 2 Player 1 */}
<div className="absolute right-0 top-0 bottom-0 w-1/2 flex flex-col justify-center items-center pr-4">
<div className="absolute right-0 top-0 bottom-0 w-1/2 flex flex-col justify-center items-center pr-8">
<div className="text-center bg-white/80 rounded-lg px-3 py-2 shadow-sm rotate-[90deg]">
<p className="text-sm font-semibold text-red-900">
{match.team2P1.name}