add mobile support to skin part dialogs
All checks were successful
Deploy App / docker (ubuntu-latest) (push) Successful in 1m15s

This commit is contained in:
Lee 2024-04-18 08:18:46 +01:00
parent 2c3b938765
commit 93477561a0

@ -83,13 +83,13 @@ export function SkinPartImage({ playerName, part, url, size = 64 }: SkinPartImag
</DialogTitle> </DialogTitle>
<DialogDescription>See the skin part below.</DialogDescription> <DialogDescription>See the skin part below.</DialogDescription>
</DialogHeader> </DialogHeader>
<div className="flex items-center flex-row w-full divide-x text-muted-foreground"> <div className="flex items-center w-max 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 font-semibold flex flex-col gap-2">
<p>{overlay.title}</p> <p>{overlay.title}</p>
<img <img
className="h-[256px]" className="h-[256px] w-max"
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"