Merge pull request #555 from OpenSignLabs/patch-1

fix: Expired document message appears partially before appearing fully

apps/OpenSign/src/pages/PdfRequestFiles.js

@@ -984,7 +984,7 @@ function PdfRequestFiles() {
               )}
 
               <div
-                className="signatureContainer"
+                className="relative flex flex-col md:flex-row justify-between bg-[#ebebeb]"
                 style={{
                   pointerEvents:
                     isExpired ||
@@ -1046,7 +1046,6 @@ function PdfRequestFiles() {
 
                 {/* this modal is used to show decline alert */}
                 <PdfDeclineModal
-                  containerWH={containerWH}
                   show={isDecline.isDeclined}
                   headMsg="Document Declined"
                   bodyMssg={
@@ -1063,7 +1062,6 @@ function PdfRequestFiles() {
                 />
                 {/* this modal is used for show expired alert */}
                 <PdfDeclineModal
-                  containerWH={containerWH}
                   show={isExpired}
                   headMsg="Document Expired!"
                   bodyMssg={`This document expired on ${expiredDate} and is no longer available to sign.`}

apps/OpenSign/src/primitives/PdfDeclineModal.js

@@ -8,19 +8,11 @@ function CustomModal({
   bodyMssg,
   footerMessage,
   declineDoc,
-  setIsDecline,
+  setIsDecline
-  containerWH
 }) {
-  const isMobile = window.innerWidth < 767;
   return (
     show && (
-      <div
+      <div className="bg-black bg-opacity-[75%] absolute z-[999] flex flex-col items-center justify-center w-full h-full rounded">
-        className="bg-black bg-opacity-[75%] absolute z-[999] flex flex-col items-center justify-center"
-        style={{
-          width: containerWH && containerWH.width,
-          height: isMobile ? "100%" : containerWH && containerWH.height
-        }}
-      >
         <div className="bg-white rounded outline-none md:w-[40%] w-[80%]">
           <div className="bg-[#de4337] text-white p-[10px] rounded-t">
             {headMsg && headMsg}