fix(team-calc) : update artifact card layout
CI / Verify (push) Successful in 55s
CI / Build immutable images and deploy (push) Successful in 1m48s

This commit is contained in:
2026-09-04 07:53:21 +07:00 Unverified
parent f39181f4c7
commit 0648022a01
+58 -51
View File
@@ -146,7 +146,7 @@ function TeamCard({
tabIndex={exporting ? -1 : undefined} tabIndex={exporting ? -1 : undefined}
aria-label={`เปิดข้อมูลอาวุธ ${member.weapon.name} บน Lunaris`} aria-label={`เปิดข้อมูลอาวุธ ${member.weapon.name} บน Lunaris`}
className={cn( className={cn(
"relative aspect-square scale-110 overflow-hidden rounded-md bg-muted outline-none sm:col-span-2", "relative col-span-2 aspect-square scale-110 overflow-hidden rounded-md bg-muted outline-none",
rarityGradientClass(member.weapon.rarity), rarityGradientClass(member.weapon.rarity),
)} )}
> >
@@ -167,56 +167,63 @@ function TeamCard({
) : ( ) : (
<div className="col-span-2 aspect-square rounded-md border bg-muted" /> <div className="col-span-2 aspect-square rounded-md border bg-muted" />
)} )}
{member.artifact ? ( <div
<Link className={cn(
href={`https://lunaris.moe/artifact/${encodeURIComponent(member.artifact.key)}`} "col-span-2 grid",
target="_blank" member.secondArtifact && "w-[150%] grid-cols-3 gap-2",
rel="noreferrer" )}
tabIndex={exporting ? -1 : undefined} >
aria-label={`เปิดข้อมูลอาร์ติแฟกต์ ${member.artifact.name} บน Lunaris`} {member.artifact ? (
className={cn( <Link
"relative aspect-square scale-110 overflow-hidden rounded-md bg-muted", href={`https://lunaris.moe/artifact/${encodeURIComponent(member.artifact.key)}`}
rarityGradientClass(member.artifact.rarity), target="_blank"
)} rel="noreferrer"
> tabIndex={exporting ? -1 : undefined}
<Image aria-label={`เปิดข้อมูลอาร์ติแฟกต์ ${member.artifact.name} บน Lunaris`}
src={member.artifact.imageUrl} className={cn(
alt={member.artifact.name} "relative col-span-2 aspect-square scale-110 overflow-hidden rounded-md bg-muted",
fill rarityGradientClass(member.artifact.rarity),
loading={exporting ? "eager" : undefined} )}
className="object-contain p-1" >
/> <Image
<Kbd className="absolute top-0 right-0 h-3 min-w-3 bg-transparent p-0 text-white"> src={member.artifact.imageUrl}
<ArrowUpRightIcon aria-hidden="true" /> alt={member.artifact.name}
</Kbd> fill
</Link> loading={exporting ? "eager" : undefined}
) : ( className="object-contain p-1"
<div className="aspect-square rounded-md border bg-muted" /> />
)} <Kbd className="absolute top-0 right-0 h-3 min-w-3 bg-transparent p-0 text-white">
{member.secondArtifact ? ( <ArrowUpRightIcon aria-hidden="true" />
<Link </Kbd>
href={`https://lunaris.moe/artifact/${encodeURIComponent(member.secondArtifact.key)}`} </Link>
target="_blank" ) : (
rel="noreferrer" <div className="col-span-2 aspect-square rounded-md border bg-muted" />
tabIndex={exporting ? -1 : undefined} )}
aria-label={`เปิดข้อมูลอาร์ติแฟกต์ ${member.secondArtifact.name} บน Lunaris`} {member.secondArtifact ? (
className={cn( <Link
"relative aspect-square scale-110 overflow-hidden rounded-md bg-muted", href={`https://lunaris.moe/artifact/${encodeURIComponent(member.secondArtifact.key)}`}
rarityGradientClass(member.secondArtifact.rarity), target="_blank"
)} rel="noreferrer"
> tabIndex={exporting ? -1 : undefined}
<Image aria-label={`เปิดข้อมูลอาร์ติแฟกต์ ${member.secondArtifact.name} บน Lunaris`}
src={member.secondArtifact.imageUrl} className={cn(
alt={member.secondArtifact.name} "relative col-span-2 col-start-2 row-start-1 aspect-square scale-110 overflow-hidden rounded-md bg-muted",
fill rarityGradientClass(member.secondArtifact.rarity),
loading={exporting ? "eager" : undefined} )}
className="object-contain p-1" >
/> <Image
<Kbd className="absolute top-0 right-0 h-3 min-w-3 bg-transparent p-0 text-white"> src={member.secondArtifact.imageUrl}
<ArrowUpRightIcon aria-hidden="true" /> alt={member.secondArtifact.name}
</Kbd> fill
</Link> loading={exporting ? "eager" : undefined}
) : null} className="object-contain p-1"
/>
<Kbd className="absolute top-0 right-0 h-3 min-w-3 bg-transparent p-0 text-white">
<ArrowUpRightIcon aria-hidden="true" />
</Kbd>
</Link>
) : null}
</div>
</div> </div>
</div> </div>
<p className="mt-2 truncate text-sm font-medium"> <p className="mt-2 truncate text-sm font-medium">