return base modal before bug on size

This commit is contained in:
anovazzi1 2024-03-31 17:32:31 -03:00
commit be6b1b119f

View file

@ -115,47 +115,44 @@ function BaseModal({
break; break;
case "smaller": case "smaller":
minWidth = "min-w-[40vw]"; minWidth = "min-w-[40vw]";
height = ""; height = "h-[11rem]";
break; break;
case "smaller-h-full": case "smaller-h-full":
minWidth = "min-w-[40vw]"; minWidth = "min-w-[40vw]";
height = " "; height = "h-full";
break; break;
case "small": case "small":
minWidth = "min-w-[40vw]"; minWidth = "min-w-[40vw]";
height = ""; height = "h-[40vh]";
break; break;
case "small-h-full": case "small-h-full":
minWidth = "min-w-[40vw]"; minWidth = "min-w-[40vw]";
height = " ";
break; break;
case "medium": case "medium":
minWidth = "min-w-[60vw]"; minWidth = "min-w-[60vw]";
height = ""; height = "h-[60vh]";
break; break;
case "medium-h-full": case "medium-h-full":
minWidth = "min-w-[60vw]"; minWidth = "min-w-[60vw]";
height = " ";
break; break;
case "large": case "large":
minWidth = "min-w-[85vw]" ; minWidth = "min-w-[85vw]";
height = "h-[90vh]"; height = "h-[80vh]";
break; break;
case "three-cards": case "three-cards":
minWidth = "min-w-[1066px]"; minWidth = "min-w-[1066px]";
height = ""; height = "h-[80vh]";
break; break;
case "large-thin": case "large-thin":
minWidth = "min-w-[65vw]"; minWidth = "min-w-[65vw]";
height = "h-[90vh]"; height = "h-[80vh]";
break; break;
case "large-h-full": case "large-h-full":
minWidth = "min-w-[80vw]"; minWidth = "min-w-[80vw]";
height = " ";
break; break;
default: default:
minWidth = "min-w-[80vw]"; minWidth = "min-w-[80vw]";
height = ""; height = "h-[80vh]";
break; break;
} }
@ -171,34 +168,34 @@ function BaseModal({
{type === "modal" ? ( {type === "modal" ? (
<Modal open={open} onOpenChange={setOpen}> <Modal open={open} onOpenChange={setOpen}>
{triggerChild} {triggerChild}
<ModalContent className={cn(minWidth, height, "duration-300")}> <ModalContent className={cn(minWidth, "duration-300")}>
<div className="truncate-doubleline flex-shrink-0 word-break-break-word"> <div className="truncate-doubleline word-break-break-word">
{headerChild} {headerChild}
</div> </div>
<div <div
className={`flex flex-col h-full w-full transition-all duration-300`} className={`flex flex-col ${height!} w-full transition-all duration-300`}
> >
{ContentChild} {ContentChild}
</div> </div>
{ContentFooter && ( {ContentFooter && (
<div className="flex flex-row-reverse flex-shrink-0">{ContentFooter}</div> <div className="flex flex-row-reverse">{ContentFooter}</div>
)} )}
</ModalContent> </ModalContent>
</Modal> </Modal>
) : ( ) : (
<Dialog open={open} onOpenChange={setOpen}> <Dialog open={open} onOpenChange={setOpen}>
{triggerChild} {triggerChild}
<DialogContent className={cn(minWidth, height, "duration-300")}> <DialogContent className={cn(minWidth, "duration-300")}>
<div className="truncate-doubleline flex-shrink-0 word-break-break-word"> <div className="truncate-doubleline word-break-break-word">
{headerChild} {headerChild}
</div> </div>
<div <div
className={`flex flex-col flex-1 h-full w-full transition-all duration-300`} className={`flex flex-col ${height!} w-full transition-all duration-300`}
> >
{ContentChild} {ContentChild}
</div> </div>
{ContentFooter && ( {ContentFooter && (
<div className="flex flex-row-reverse flex-shrink-0">{ContentFooter}</div> <div className="flex flex-row-reverse">{ContentFooter}</div>
)} )}
</DialogContent> </DialogContent>
</Dialog> </Dialog>