make the skin part dialog imags slightly smaller on mobile
All checks were successful
Deploy App / docker (ubuntu-latest) (push) Successful in 1m3s
All checks were successful
Deploy App / docker (ubuntu-latest) (push) Successful in 1m3s
This commit is contained in:
parent
93477561a0
commit
4739297ba5
@ -76,20 +76,20 @@ export function SkinPartImage({ playerName, part, url, size = 64 }: SkinPartImag
|
|||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</DialogTrigger>
|
</DialogTrigger>
|
||||||
<DialogContent className="w-fit min-w-72 h-fit">
|
<DialogContent className="w-fit h-fit">
|
||||||
<DialogHeader>
|
<DialogHeader>
|
||||||
<DialogTitle>
|
<DialogTitle>
|
||||||
{playerName}'s {partName}
|
{playerName}'s {partName}
|
||||||
</DialogTitle>
|
</DialogTitle>
|
||||||
<DialogDescription>See the skin part below.</DialogDescription>
|
<DialogDescription>See the skin part below.</DialogDescription>
|
||||||
</DialogHeader>
|
</DialogHeader>
|
||||||
<div className="flex items-center w-max flex-col divide-y md:flex-row md:divide-x md:divide-y-0 text-muted-foreground">
|
<div className="flex items-center w-full flex-col divide-y md:flex-row md:divide-x md:divide-y-0 text-muted-foreground">
|
||||||
{skinPartOverlay.map((overlay, index) => {
|
{skinPartOverlay.map((overlay, index) => {
|
||||||
return (
|
return (
|
||||||
<div key={index} className="p-2 text-center font-semibold flex flex-col gap-2">
|
<div key={index} className="p-2 text-center items-center font-semibold flex flex-col gap-2">
|
||||||
<p>{overlay.title}</p>
|
<p>{overlay.title}</p>
|
||||||
<img
|
<img
|
||||||
className="h-[256px] w-max"
|
className="h-[200px] md:h-[256px]"
|
||||||
src={url + (overlay.overlays ? "?overlays=true" : "")}
|
src={url + (overlay.overlays ? "?overlays=true" : "")}
|
||||||
alt={`The player's ${partName}`}
|
alt={`The player's ${partName}`}
|
||||||
loading="lazy"
|
loading="lazy"
|
||||||
|
Loading…
Reference in New Issue
Block a user