From ec9e338c46ff96706cb167c867c5152c733f1458 Mon Sep 17 00:00:00 2001
From: Kostia <kkaploon@gmail.com>
Date: Tue, 3 Jan 2023 23:21:16 +0200
Subject: [PATCH] fixed the modal overlay

---
 website/src/components/CollapsableText.tsx | 22 ++++++++++------------
 1 file changed, 10 insertions(+), 12 deletions(-)

diff --git a/website/src/components/CollapsableText.tsx b/website/src/components/CollapsableText.tsx
index 9fd28b9370..86de4af714 100644
--- a/website/src/components/CollapsableText.tsx
+++ b/website/src/components/CollapsableText.tsx
@@ -1,4 +1,4 @@
-import { Button, Container, useDisclosure } from "@chakra-ui/react";
+import { Button, useDisclosure } from "@chakra-ui/react";
 import { Modal, ModalOverlay, ModalContent, ModalHeader, ModalBody, ModalCloseButton } from "@chakra-ui/react";
 import React from "react";
 
@@ -13,17 +13,15 @@ export const CollapsableText = ({ text, maxLength = 220 }) => {
         <Button style={{ display: "contents" }} onClick={onOpen}>
           ...
         </Button>
-        <Container maxW="full">
-          <Modal isOpen={isOpen} onClose={onClose} size="xl" scrollBehavior={"inside"}>
-            <ModalOverlay>
-              <ModalContent maxH="400">
-                <ModalHeader>Full Text</ModalHeader>
-                <ModalCloseButton />
-                <ModalBody>{text}</ModalBody>
-              </ModalContent>
-            </ModalOverlay>
-          </Modal>
-        </Container>
+        <Modal isOpen={isOpen} onClose={onClose} size="xl" scrollBehavior={"inside"} >
+          <ModalOverlay style={{ width: "100%", height: "100%" }}>
+            <ModalContent maxH="400">
+              <ModalHeader>Full Text</ModalHeader>
+              <ModalCloseButton />
+              <ModalBody>{text}</ModalBody>
+            </ModalContent>
+          </ModalOverlay>
+        </Modal>
       </>
     );
   }