From ba839b0fc890ebfbfe6c3c9891aa4739e079b932 Mon Sep 17 00:00:00 2001
From: prafull-opensignlabs <prafull.navkar@nxglabs.com>
Date: Tue, 2 Apr 2024 14:53:16 +0530
Subject: [PATCH] fix: Expired document message appears partially before
 appearing fully

---
 apps/OpenSign/src/pages/PdfRequestFiles.js      |  4 +---
 apps/OpenSign/src/primitives/PdfDeclineModal.js | 12 ++----------
 2 files changed, 3 insertions(+), 13 deletions(-)

diff --git a/apps/OpenSign/src/pages/PdfRequestFiles.js b/apps/OpenSign/src/pages/PdfRequestFiles.js
index 7c05fa4ec..f53be40a9 100644
--- a/apps/OpenSign/src/pages/PdfRequestFiles.js
+++ b/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.`}
diff --git a/apps/OpenSign/src/primitives/PdfDeclineModal.js b/apps/OpenSign/src/primitives/PdfDeclineModal.js
index 7de7f4b35..ee8507762 100644
--- a/apps/OpenSign/src/primitives/PdfDeclineModal.js
+++ b/apps/OpenSign/src/primitives/PdfDeclineModal.js
@@ -8,19 +8,11 @@ function CustomModal({
   bodyMssg,
   footerMessage,
   declineDoc,
-  setIsDecline,
-  containerWH
+  setIsDecline
 }) {
-  const isMobile = window.innerWidth < 767;
   return (
     show && (
-      <div
-        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-black bg-opacity-[75%] absolute z-[999] flex flex-col items-center justify-center w-full h-full rounded">
         <div className="bg-white rounded outline-none md:w-[40%] w-[80%]">
           <div className="bg-[#de4337] text-white p-[10px] rounded-t">
             {headMsg && headMsg}