responsive layout fix on safari.

This commit is contained in:
Kakabay 2024-12-20 18:10:30 +05:00
parent 6f92f2192f
commit 1a4c9640ec
1 changed files with 7 additions and 7 deletions

View File

@ -80,33 +80,33 @@ const PrizeCard = ({
return ( return (
<div <div
className={cn( className={cn(
'bg-lightSurfaceContainerHigher flex md:flex-row flex-col rounded-[12px] overflow-hidden w-full', 'bg-lightSurfaceContainerHigher flex md:flex-row flex-col rounded-[12px] overflow-hidden w-full ',
className, className,
{ {
'opacity-50': variant === 'disabled', 'opacity-50': variant === 'disabled',
}, },
)}> )}>
<div className="flex-1 overflow-hidden md:h-full h-[186px]"> <div className="flex-1 overflow-hidden md:h-[248px] h-[186px] w-full">
<Image <Image
width={416} width={416}
height={248} height={248}
src={image ? image : '/gift-placeholder.png'} src={image ? image : '/gift-placeholder.png'}
alt="prize" alt="prize"
className="h-full w-full" className="h-full w-full object-cover"
/> />
</div> </div>
<div className="flex-1 p-[16px] flex flex-col gap-[16px]"> <div className="flex-1 p-[16px] flex flex-col gap-[16px] w-full">
<h2 className="text-heading5 leading-heading5 -tracking-[-1%] font-medium text-lightOnSurface"> <h2 className="text-heading5 leading-heading5 -tracking-[-1%] font-medium text-lightOnSurface w-full">
{title} {title}
</h2> </h2>
<p className="text-textSmall leading-textSmall -tracking-[-1%] text-lightOnSurfaceVariant"> <p className="text-textSmall leading-textSmall -tracking-[-1%] text-lightOnSurfaceVariant w-full">
{description} {description}
</p> </p>
{variant === 'default' ? ( {variant === 'default' ? (
<> <>
{/* DialogTrigger to open the dialog */} {/* DialogTrigger to open the dialog */}
<div> <div className="w-full">
<Dialog open={dialogOpen} onOpenChange={handleDialogClose}> <Dialog open={dialogOpen} onOpenChange={handleDialogClose}>
<DialogTrigger asChild> <DialogTrigger asChild>
<button <button