Fixed prompt modal oveflow

This commit is contained in:
Lucas Oliveira 2024-06-14 17:51:45 -03:00
commit 91074d9057
2 changed files with 129 additions and 131 deletions

View file

@ -204,12 +204,11 @@ export default function GenericModal({
aria-hidden="true"
/>
</BaseModal.Header>
<BaseModal.Content>
<div className="flex h-full flex-col">
<BaseModal.Content overflowHidden>
<div
className={classNames(
!isEdit ? "rounded-lg border" : "",
"flex h-full max-h-[85%] w-full",
"flex h-full w-full",
)}
>
{type === TypeModal.PROMPT && isEdit && !readonly ? (
@ -217,7 +216,7 @@ export default function GenericModal({
id={"modal-" + id}
data-testid={"modal-" + id}
ref={divRefPrompt}
className="form-input h-full w-full rounded-lg custom-scroll focus-visible:ring-1"
className="form-input h-full w-full resize-none rounded-lg custom-scroll focus-visible:ring-1"
value={inputValue}
onBlur={() => {
setIsEdit(false);
@ -244,7 +243,7 @@ export default function GenericModal({
) : type !== TypeModal.PROMPT ? (
<Textarea
ref={textRef}
className="form-input h-full w-full overflow-auto rounded-lg focus-visible:ring-1"
className="form-input h-full w-full resize-none overflow-auto rounded-lg focus-visible:ring-1"
value={inputValue}
onChange={(event) => {
setInputValue(event.target.value);
@ -261,8 +260,9 @@ export default function GenericModal({
<></>
)}
</div>
<div className="mt-6 flex h-fit w-full items-end justify-between">
</BaseModal.Content>
<BaseModal.Footer>
<div className="flex w-full shrink-0 items-end justify-between">
<div className="mb-auto flex-1">
{type === TypeModal.PROMPT && (
<div className=" mr-2">
@ -294,8 +294,7 @@ export default function GenericModal({
<div className="relative bottom-[1px]">
<span id={"badge" + index.toString()}>
{word.replace(/[{}]/g, "").length > 59
? word.replace(/[{}]/g, "").slice(0, 56) +
"..."
? word.replace(/[{}]/g, "").slice(0, 56) + "..."
: word.replace(/[{}]/g, "")}
</span>
</div>
@ -334,8 +333,7 @@ export default function GenericModal({
{myButtonText}
</Button>
</div>
</div>
</BaseModal.Content>
</BaseModal.Footer>
</BaseModal>
);
}

View file

@ -944,11 +944,11 @@
@apply bg-white text-primary;
}
.code-highlight {
@apply block max-h-[64vh] w-full overflow-y-hidden border-0 px-3 py-2 text-sm outline-0 word-break-break-word;
@apply block w-full overflow-auto border-0 px-3 py-2 text-sm outline-0 word-break-break-word;
}
.code-nohighlight {
@apply block max-h-[70vh] w-full overflow-y-hidden border-0 px-3 py-2 text-sm outline-0 word-break-break-word;
@apply block w-full overflow-auto border-0 px-3 py-2 text-sm outline-0 word-break-break-word;
}
.form-modal-lockchat {
@apply form-input block w-full rounded-md border-border p-4 pr-16 custom-scroll focus:border-ring focus:ring-ring sm:text-sm;