fix: opensign-drive drop-down issue

Author: raktima-opensignlabs

microfrontends/SignDocuments/src/Component/LegaDrive/LegaDrive.css

@@ -84,14 +84,10 @@
   color: var(--mauve-8);
 }
 
-
 .dropdown-menu {
-
   min-width: 10rem;
-
 }
 
-
 .dropdown-item {
   display: block;
   width: 100%;
@@ -106,19 +102,15 @@
   cursor: pointer;
 }
 
-
 .dropdown-item:hover {
   background-color: #dad9db;
   color: var(--violet-11);
-
 }
 
 .itemColor {
   font-size: 13px !important;
 }
 
-
-
 .folderComponent {
   margin: 30px;
   height: 100%;
@@ -491,41 +483,52 @@ a {
   display: none;
 }
 
- .folderPath{
+.folderPath {
   overflow-x: auto;
   white-space: nowrap;
 
   cursor: pointer;
   user-select: none;
- }
- .folderPath::-webkit-scrollbar {
+}
+
+.folderPath::-webkit-scrollbar {
   display: none;
   /* for Chrome, Safari, and Opera */
 }
 
+@media screen and (max-width:766px) {
+  .itemColor {
+    font-size: 10px !important;
+  }
+
+}
 @media (min-width: 310px) and (max-width:550px) {
-  
+
   .pdfContainer {
     justify-content: space-around;
   }
+
   .sort {
-padding: 2px;
+    padding: 2px;
   }
-  .folderComponent{
+
+  .folderComponent {
     margin: 10px;
   }
-  
+
 }
 
-@media screen and  (max-width:309px) {
- 
+@media screen and (max-width:309px) {
+
   .pdfContainer {
     justify-content: center;
   }
+
   .sort {
     padding: 2px;
-      }
-      .folderComponent{
-        margin: 10px;
-      }
+  }
+
+  .folderComponent {
+    margin: 10px;
+  }
 }

microfrontends/SignDocuments/src/Component/LegaDrive/LegaDrive.js

@@ -508,7 +508,9 @@ function PdfFile() {
               <div className="dropMenuBD">
                 <div
                   id="folder-menu"
-                  className={isNewFol ? "dropdown show" : "dropdown"}
+                  className={
+                    isNewFol ? "dropdown show dropDownStyle" : "dropdown"
+                  }
                   onClick={() => setIsNewFol(!isNewFol)}
                 >
                   <div className="sort">

microfrontends/SignDocuments/src/Component/component/renderPdf.js

@@ -457,12 +457,7 @@ function RenderPdf({
                                           zIndex: pos.zIndex
                                         }}
                                         className="placeholderBlock"
-                                        onDrag={() =>
-                                          handleTabDrag(
-                                            pos.key
-                                            // data.signerObjId
-                                          )
-                                        }
+                                        onDrag={() => handleTabDrag(pos.key)}
                                         size={{
                                           width: pos.Width ? pos.Width : 150,
                                           height: pos.Height ? pos.Height : 60

microfrontends/SignDocuments/src/Component/placeHolderSign.js

@@ -21,7 +21,8 @@ import {
   pdfNewWidthFun,
   contractDocument,
   contractUsers,
-  getHostUrl
+  getHostUrl,
+  addZIndex
 } from "../utils/Utils";
 import RenderPdf from "./component/renderPdf";
 import ModalComponent from "./component/modalComponent";
@@ -430,6 +431,8 @@ function PlaceHolderSign() {
   //function for set and update x and y postion after drag and drop signature tab
   const handleStop = (event, dragElement, signerId, key) => {
     if (!isResize) {
+      const dataNewPlace = addZIndex(signerPos, key, setZIndex);
+      signerPos.splice(0, signerPos.length, ...dataNewPlace);
       const containerRect = document
         .getElementById("container")
         .getBoundingClientRect();

microfrontends/SignDocuments/src/css/signature.css

@@ -542,6 +542,7 @@ option {
   overflow-y: scroll;
 }
 
+
 .SelectTrigger:hover {
   border: none;
   outline: none;
@@ -647,12 +648,20 @@ option {
 
 }
 
+.dropDownStyle {
+  width: auto;
+}
+
 @media screen and (max-width:766px) {
 
   .showPages {
     display: none;
   }
 
+  .dropdown-menu {
+    min-width: 0rem !important;
+  }
+
   .signatureContainer {
     display: flex;
     flex-direction: column;
@@ -679,7 +688,7 @@ option {
 
   #navbar {
     overflow: hidden;
-    z-index: 99;
+    z-index: 49;
   }
 
   /* Navbar links */