responsive layout fix on safari.
This commit is contained in:
parent
6f92f2192f
commit
1a4c9640ec
|
|
@ -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
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue