refactor: removed uncessary css, files

This commit is contained in:
prafull-opensignlabs
2024-06-21 18:44:17 +05:30
parent cdff7e252d
commit 0b28e64111
25 changed files with 107 additions and 1200 deletions
@@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512" fill="currentColor"><!-- Font Awesome Pro 6.0.0-alpha2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) --><path d="M374.629 150.627L233.371 9.373C227.371 3.371 219.23 0 210.746 0H64C28.652 0 0 28.652 0 64V448C0 483.345 28.652 512 64 512H320C355.348 512 384 483.345 384 448V173.254C384 164.767 380.629 156.629 374.629 150.627ZM224 22.629L361.375 160H248C234.781 160 224 149.234 224 136V22.629ZM368 448C368 474.467 346.469 496 320 496H64C37.531 496 16 474.467 16 448V64C16 37.533 37.531 16 64 16H208V136C208 158.062 225.938 176 248 176H368V448ZM96 264C96 268.406 99.594 272 104 272H280C284.406 272 288 268.406 288 264S284.406 256 280 256H104C99.594 256 96 259.594 96 264ZM280 320H104C99.594 320 96 323.594 96 328S99.594 336 104 336H280C284.406 336 288 332.406 288 328S284.406 320 280 320ZM280 384H104C99.594 384 96 387.594 96 392S99.594 400 104 400H280C284.406 400 288 396.406 288 392S284.406 384 280 384Z"/></svg>

Before

Width:  |  Height:  |  Size: 1.0 KiB

@@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M64 480H448c35.3 0 64-28.7 64-64V160c0-35.3-28.7-64-64-64H288c-10.1 0-19.6-4.7-25.6-12.8L243.2 57.6C231.1 41.5 212.1 32 192 32H64C28.7 32 0 60.7 0 96V416c0 35.3 28.7 64 64 64z"/></svg>

Before

Width:  |  Height:  |  Size: 406 B

@@ -313,7 +313,9 @@ function DriveBody(props) {
const signerName = getSignersName.join(", ");
return (
<span className="statusSpan w-[90%] break-words">{signerName}</span>
<span className="text-[12px] font-medium w-[90%] break-words">
{signerName}
</span>
);
};
return listType === "table" ? (
@@ -398,7 +400,7 @@ function DriveBody(props) {
className="w-[100px] border-[1.5px] border-black rounded-sm text-[10px]"
/>
) : (
<span className="foldName">{data.Name}</span>
<span className="fileName">{data.Name}</span>
)}
</div>
</ContextMenu.Trigger>
@@ -515,21 +517,17 @@ function DriveBody(props) {
<HoverCard.Portal>
<HoverCard.Content className="HoverCardContent" sideOffset={5}>
<strong className="text-[13px]">Title: </strong>
<span className="statusSpan" style={{ marginBottom: "0px" }}>
{" "}
{data.Name}
</span>
<span className="text-[12px] font-medium mb-0"> {data.Name}</span>
<br />
<strong className="text-[13px]">Status: </strong>
<span className="statusSpan"> {status}</span>
<span className="text-[12px] font-medium"> {status}</span>
<br />
<strong className="text-[13px]">Created Date: </strong>
<span className="statusSpan">{createddate}</span>
<span className="text-[12px] font-medium">{createddate}</span>
<br />
{signerExist && (
<>
<strong className="text-[13px]">Signers: </strong>
{/* <span className="statusSpan">kjefjjnejkfnkbjs bbfjkdsbjbfjkbjk kscbjkbjkb</span> */}
{signersName()}
</>
)}
@@ -175,7 +175,7 @@ function EmailComponent({
{isLoading && (
<div className="absolute w-full h-full flex flex-col justify-center items-center z-[20] bg-[#e6f2f2]/70">
<Loader />
<span className="text-[12px] font-bold">
<span className="text-[12px] text-base-content">
This might take some time
</span>
</div>
+26 -26
View File
@@ -53,7 +53,7 @@ function Header({
};
return (
<div style={{ padding: "5px 0px 5px 0px" }} className="mobileHead">
<div className="flex py-[5px]">
{isMobile && isShowHeader ? (
<div
id="navbar"
@@ -99,7 +99,7 @@ function Header({
>
<div className="flex flex-row">
<i
className="fa-light fa-arrow-down mr-[2px]"
className="fa-light fa-arrow-down mr-[3px]"
aria-hidden="true"
></i>
Download
@@ -117,7 +117,7 @@ function Header({
>
<div className="border-none bg-[#fff]">
<i
className="fa-light fa-award mr-[2px]"
className="fa-light fa-award mr-[3px]"
aria-hidden="true"
></i>
Certificate
@@ -131,7 +131,7 @@ function Header({
>
<div className="flex flex-row">
<i
className="fa-light fa-envelope mr-[2px]"
className="fa-light fa-envelope mr-[3px]"
aria-hidden="true"
></i>
Mail
@@ -146,7 +146,7 @@ function Header({
>
<div className="flex flex-row">
<i
className="fa-light fa-print mr-[2px]"
className="fa-light fa-print mr-[3px]"
aria-hidden="true"
></i>
Print
@@ -224,7 +224,7 @@ function Header({
}
>
<i
className="fa-light fa-arrow-down mr-[5px]"
className="fa-light fa-arrow-down mr-[3px]"
aria-hidden="true"
></i>
<span className="font-[500]">Download</span>
@@ -239,7 +239,7 @@ function Header({
</div>
</div>
) : (
<div className="flex flex-wrap justify-between items-center mt-[5px]">
<div className="flex flex-wrap justify-between items-center w-full gap-y-1 ml-1">
<PrevNext
pageNumber={pageNumber}
allPages={allPages}
@@ -270,7 +270,7 @@ function Header({
{setIsEditTemplate && (
<button
onClick={() => setIsEditTemplate(true)}
className="outline-none border-none text-center mr-[5px]"
className="outline-none border-none text-center mr-[3px]"
>
<i className="fa-light fa-gear fa-lg"></i>
</button>
@@ -278,14 +278,14 @@ function Header({
<button
onClick={() => navigate(-1)}
type="button"
className="op-btn op-btn-ghost op-btn-sm mr-[5px]"
className="op-btn op-btn-ghost op-btn-sm mr-[3px]"
>
Back
</button>
<button
disabled={isMailSend && true}
data-tut="reactourFour"
className="op-btn op-btn-primary op-btn-sm mr-[5px]"
className="op-btn op-btn-primary op-btn-sm mr-[3px]"
onClick={() => alertSendEmail()}
>
{completeBtnTitle
@@ -305,7 +305,7 @@ function Header({
onClick={() =>
handleDownloadCertificate(pdfDetails, setIsDownloading)
}
className="op-btn op-btn-secondary op-btn-sm mr-[5px] shadow"
className="op-btn op-btn-secondary op-btn-sm mr-[3px] shadow"
>
<i
className="fa-light fa-award py-[3px]"
@@ -318,7 +318,7 @@ function Header({
<button
onClick={(e) => handleToPrint(e, pdfUrl, setIsDownloading)}
type="button"
className="op-btn op-btn-neutral op-btn-sm mr-[5px] shadow"
className="op-btn op-btn-neutral op-btn-sm mr-[3px] shadow"
>
<i
className="fa-light fa-print py-[3px]"
@@ -329,7 +329,7 @@ function Header({
<button
type="button"
className="op-btn op-btn-primary op-btn-sm mr-[5px] shadow"
className="op-btn op-btn-primary op-btn-sm mr-[3px] shadow"
onClick={() =>
handleDownloadPdf(pdfDetails, pdfUrl, setIsDownloading)
}
@@ -346,21 +346,21 @@ function Header({
<button
onClick={() => navigate(-1)}
type="button"
className="op-btn op-btn-ghost op-btn-sm mr-[5px]"
className="op-btn op-btn-ghost op-btn-sm mr-[3px]"
>
Back
</button>
{currentSigner && (
<>
<button
className="op-btn op-btn-secondary op-btn-sm mr-[5px] shadow"
className="op-btn op-btn-secondary op-btn-sm mr-[3px] shadow"
onClick={() => handleDeclinePdfAlert()}
>
Decline
</button>
<button
type="button"
className="op-btn op-btn-primary op-btn-sm mr-[5px] shadow"
className="op-btn op-btn-primary op-btn-sm mr-[3px] shadow"
onClick={() => embedWidgetsData()}
>
Finish
@@ -411,37 +411,37 @@ function Header({
onClick={() =>
handleDownloadCertificate(pdfDetails, setIsDownloading)
}
className="op-btn op-btn-secondary op-btn-sm font-medium text-[13px] mr-[5px] shadow"
className="op-btn op-btn-secondary op-btn-sm gap-0 font-medium text-[12px] mr-[3px] shadow"
>
<i className="fa-light fa-award" aria-hidden="true"></i>
<span className="hidden lg:block">Certificate</span>
<span className="hidden lg:block ml-1">Certificate</span>
</button>
)}
<button
onClick={(e) => handleToPrint(e, pdfUrl, setIsDownloading)}
type="button"
className="op-btn op-btn-neutral op-btn-sm font-medium text-[13px] mr-[5px] shadow"
className="op-btn op-btn-neutral op-btn-sm gap-0 font-medium text-[12px] mr-[3px] shadow"
>
<i className="fa-light fa-print" aria-hidden="true"></i>
<span className="hidden lg:block">Print</span>
<span className="hidden lg:block ml-1">Print</span>
</button>
<button
type="button"
className="op-btn op-btn-primary op-btn-sm font-medium text-[13px] mr-[5px] shadow"
className="op-btn op-btn-primary op-btn-sm gap-0 font-medium text-[12px] mr-[3px] shadow"
onClick={() =>
handleDownloadPdf(pdfDetails, pdfUrl, setIsDownloading)
}
>
<i className="fa-light fa-download" aria-hidden="true"></i>
<span className="hidden lg:block">Download</span>
<span className="hidden lg:block ml-1">Download</span>
</button>
<button
type="button"
className="op-btn op-btn-info op-btn-sm font-medium text-[13px] mr-[5px] shadow"
className="op-btn op-btn-info op-btn-sm gap-0 font-medium text-[12px] mr-[3px] shadow"
onClick={() => setIsEmail(true)}
>
<i className="fa-light fa-envelope" aria-hidden="true"></i>
<span className="hidden lg:block">Mail</span>
<span className="hidden lg:block ml-1">Mail</span>
</button>
</div>
) : (
@@ -449,13 +449,13 @@ function Header({
<button
onClick={() => navigate(-1)}
type="button"
className="op-btn op-btn-ghost op-btn-sm mr-[5px]"
className="op-btn op-btn-ghost op-btn-sm mr-[3px]"
>
Back
</button>
<button
type="button"
className="op-btn op-btn-primary op-btn-sm mr-[5px]"
className="op-btn op-btn-primary op-btn-sm mr-[3px]"
onClick={() => {
if (!pdfUrl) {
embedWidgetsData();
+3 -3
View File
@@ -21,7 +21,7 @@ function PdfZoom(props) {
};
return (
// md:mt-[41px] xl:mt-[63px]mt=[]
<span className=" hidden md:flex flex-col gap-1 text-center md:w-[5%] mt-[50px] 2xl:mt-[63px]">
<span className="hidden md:flex flex-col gap-1 text-center md:w-[5%] mt-[50px] 2xl:mt-[63px]">
<span
className="bg-gray-50 px-[4px] 2xl:px-[15px] 2xl:py-[10px] cursor-pointer"
onClick={onClickZoomIn}
@@ -30,11 +30,11 @@ function PdfZoom(props) {
<i className="fa-light fa-magnifying-glass-plus text-gray-500 2xl:text-[30px]"></i>
</span>
<span
className="bg-gray-50 px-[4px] 2xl:px-[15px] 2xl:py-[10px] cursor-pointer "
className="bg-gray-50 px-[4px] 2xl:px-[15px] 2xl:py-[10px] cursor-pointer"
onClick={handleReset}
title="Reset"
>
<i className="fa-light fa-arrows-rotate text-gray-500 2xl:text-[30px]"></i>
<i className="fa-light fa-magnifying-glass-arrows-rotate text-gray-500 2xl:text-[30px]"></i>
</span>
<span
className="bg-gray-50 px-[4px] 2xl:px-[15px] 2xl:py-[10px]"
@@ -410,7 +410,7 @@ function Placeholder(props) {
e.stopPropagation();
handleOnClickSettingIcon();
}}
className="fa-light fa-gear settingIcon"
className="fa-light fa-gear icon"
style={{
color: "#188ae2",
right: "29px",
@@ -431,7 +431,7 @@ function Placeholder(props) {
e.stopPropagation();
handleOnClickSettingIcon();
}}
className="fa-light fa-gear settingIcon"
className="fa-light fa-gear icon"
style={{
color: "#188ae2",
right: props?.pos?.type === textWidget ? "32px" : "47px",
@@ -444,7 +444,7 @@ function Placeholder(props) {
{props.pos.type !== textWidget && !props.isSignYourself && (
<i
data-tut="assignSigner"
className="fa-light fa-user signUserIcon"
className="fa-light fa-user icon"
onClick={(e) => {
e.stopPropagation();
props.handleLinkUser(props.data.Id);
@@ -468,11 +468,7 @@ function Placeholder(props) {
top: "-19px",
right: props.isPlaceholder ? "60px" : "44px"
}}
className={
isShowDateFormat
? "dropdown signUserIcon show"
: "dropdown signUserIcon"
}
className={`${isShowDateFormat ? "show" : ""} dropdown icon`}
onClick={(e) => {
setIsShowDateFormat(!isShowDateFormat);
e.stopPropagation();
@@ -491,7 +487,7 @@ function Placeholder(props) {
}}
>
<i
className="fa-light fa-gear settingIcon"
className="fa-light fa-gear icon"
style={{
color: "#188ae2",
fontSize: "14px"
@@ -519,8 +515,7 @@ function Placeholder(props) {
setSelectDate(data);
handleSaveDate(data);
}}
className="dropdown-item itemColor"
style={{ fontSize: "12px" }}
className="dropdown-item text-[13px]"
>
{data?.date ? data?.date : "nodata"}
</span>
@@ -530,13 +525,13 @@ function Placeholder(props) {
</div>
)}
<i
className="fa-light fa-copy signCopy"
className="fa-light fa-copy icon"
onClick={(e) => handleCopyPlaceholder(e)}
onTouchEnd={(e) => handleCopyPlaceholder(e)}
style={{ color: "#188ae2", right: "12px", top: "-18px" }}
></i>
<i
className="fa-light fa-circle-xmark signCloseBtn"
className="fa-light fa-circle-xmark icon"
onClick={(e) => {
e.stopPropagation();
@@ -249,7 +249,7 @@ const RecipientList = (props) => {
props.isSelectListId === ind
? "text-[#424242]"
: "text-base-content"
} cursor-pointer ml-[5px]`}
} cursor-pointer`}
>
<i className="fa-light fa-trash-can 2xl:text-[30px]"></i>
</div>
+3 -3
View File
@@ -473,7 +473,7 @@ function SignPad({
hidden
/>
<i className="fa-light fa-cloud-upload-alt uploadImgLogo"></i>
<div className="uploadImg">Upload</div>
<div className="text-[10px]">Upload</div>
</div>
</div>
) : (
@@ -509,7 +509,7 @@ function SignPad({
) : isTab === "type" ? (
<div>
<div className="flex justify-between items-center">
<span className="signatureText">
<span className="mr-[5px] text-[12px]">
{isInitial ? "Initials" : "Signature"}:
</span>
<input
@@ -525,7 +525,7 @@ function SignPad({
}}
/>
</div>
<div className="fontOptionContainer">
<div className="border-[1px] border-[#d6d3d3] mt-[10px] ml-[5px]">
{fontOptions.map((font, ind) => {
return (
<div
+6 -2
View File
@@ -19,8 +19,12 @@ function Signedby({ pdfDetails }) {
</span>
</div>
<div className="flex flex-col">
<span className="userName">{pdfDetails.ExtUserPtr.Name}</span>
<span className="useEmail">{pdfDetails.ExtUserPtr.Email}</span>
<span className="text-[12px] font-bold text-[#424242] w-[100px] whitespace-nowrap overflow-hidden text-ellipsis">
{pdfDetails.ExtUserPtr.Name}
</span>
<span className="text-[10px] font-medium text-[#424242] w-[100px] whitespace-nowrap overflow-hidden text-ellipsis">
{pdfDetails.ExtUserPtr.Email}
</span>
</div>
</div>
</div>
@@ -43,9 +43,10 @@ function SignerListComponent(props) {
</span>
</div>
<div className="flex flex-col">
<span className="userName">{props.obj?.Name || props?.obj?.Role}</span>
<span className="useEmail">
{" "}
<span className="text-[12px] font-bold text-[#424242] w-[100px] whitespace-nowrap overflow-hidden text-ellipsis">
{props.obj?.Name || props?.obj?.Role}
</span>
<span className="text-[10px] font-medium text-[#424242] w-[100px] whitespace-nowrap overflow-hidden text-ellipsis">
{props.obj?.Email || props.obj?.email}
</span>
</div>
@@ -6,14 +6,14 @@ function SignerListPlace(props) {
return (
<div>
<div className="mx-2 pr-2 pt-2 pb-1 text-[15px] text-base-content font-semibold border-b-[1px] border-base-300">
<span>
<span className="relative">
{props.title ? props.title : "Recipients"}
<span className="absolute text-xs z-[30] mt-1 ml-0.5">
{props?.title === "Roles" && (
<>
<a data-tooltip-id="my-tooltip">
<sup>
<i className="fa-light fa-question rounded-full border-[1.5px] border-base-content text-[11px] py-[1px] px-[3px]"></i>
<i className="fa-light fa-question rounded-full border-[1px] border-base-content text-[11px] py-[1px] px-[3px]"></i>
</sup>
</a>
<Tooltip id="my-tooltip" className="z-[100]">
@@ -252,7 +252,7 @@ function WidgetComponent({
<div
data-tut={dataTut}
id="navbar"
className="stickyfooter"
className="fixed z-[99] bottom-0 righit-0"
style={{ width: window.innerWidth + "px" }}
>
<div className="mx-1">
+1 -1
View File
@@ -761,7 +761,7 @@ const Forms = (props) => {
Send In Order
<a data-tooltip-id="sendInOrder-tooltip" className="ml-1">
<sup>
<i className="fa-light fa-question rounded-full border-[#33bbff] text-[#33bbff] text-[13px] border-[1.5px] py-[1.5px] px-[4px]"></i>
<i className="fa-light fa-question rounded-full border-[#33bbff] text-[#33bbff] text-[13px] border-[1px] py-[1.5px] px-[4px]"></i>
</sup>
</a>
<Tooltip id="sendInOrder-tooltip" className="z-50">
+5 -11
View File
@@ -249,16 +249,10 @@ const ManageSign = () => {
</div>
)}
{isAlert?.message && <Alert type={isAlert.type}>{isAlert.message}</Alert>}
<div
className="mainDiv"
style={{
width: "100%",
paddingRight: "10px"
}}
>
<div className="relative w-full pr-[10px]">
<div className="m-[20px]">
<div className="font-[700] text-[15px] pb-[8px]">My Signature</div>
<div className="signBlock mt-4">
<div className=" flex flex-col md:flex-row gap-0 md:gap-[12px] mt-4">
<div>
<div className="relative">
<div className="flex flex-row justify-between w-1/2 pl-[10px]">
@@ -274,7 +268,7 @@ const ManageSign = () => {
<span
onClick={() => handleUploadBtn()}
className="imgupload"
className="signature min-w-[105px]"
>
Upload Image
</span>
@@ -364,7 +358,7 @@ const ManageSign = () => {
<div>
<div
type="button"
className="clearbtn cursor-pointer"
className="op-link"
onClick={() => handleClear()}
>
Clear
@@ -465,7 +459,7 @@ const ManageSign = () => {
<div>
<div
type="button"
className="clearbtn cursor-pointer"
className="op-link"
onClick={() => handleClearInitials()}
>
Clear
+10 -8
View File
@@ -598,11 +598,13 @@ function Opensigndrive() {
{isLoading.isLoad ? (
<div className="flex flex-col justify-center items-center h-[100vh] w-full">
<Loader />
<span className="text-[13px] text-[gray]">{isLoading.message}</span>
<span className="text-[13px] text-base-content">
{isLoading.message}
</span>
</div>
) : handleError ? (
<div className="flex justify-center items-center h-[100vh] w-full">
<span className="text-[20px] text-[gray]">{handleError}</span>
<span className="text-[20px] text-base-content">{handleError}</span>
</div>
) : (
<>
@@ -625,7 +627,7 @@ function Opensigndrive() {
>
{handleFolderTab(folderName)}
</div>
<div className="dropMenuBD">
<div className="flex flex-row items-center">
<div
id="folder-menu"
className={
@@ -647,7 +649,7 @@ function Opensigndrive() {
>
<div className="flex flex-col">
<span
className="dropdown-item itemColor"
className="dropdown-item text-[10px] md:text-[13px]"
onClick={() => setIsFolder(true)}
>
<i
@@ -657,14 +659,14 @@ function Opensigndrive() {
Create folder
</span>
<span
className="dropdown-item itemColor"
className="dropdown-item text-[10px] md:text-[13px]"
onClick={() => navigate("/form/sHAnZphf69")}
>
<i className="fa-light fa-pen-nib mr-[5px]"></i>
Sign Yourself
</span>
<span
className="dropdown-item itemColor"
className="dropdown-item text-[10px] md:text-[13px]"
onClick={() => navigate("/form/8mZzFxbG1z")}
>
<i className="fa-light fa-file-signature mr-[5px]"></i>
@@ -707,7 +709,7 @@ function Opensigndrive() {
setSelectedSort(value);
sortingData(value, null, pdfData);
}}
className="dropdown-item itemColor"
className="dropdown-item text-[10px] md:text-[13px]"
style={{
paddingLeft: selectedSort !== value && "31px"
}}
@@ -732,7 +734,7 @@ function Opensigndrive() {
setSortingOrder(order);
sortingData(null, order, pdfData);
}}
className="dropdown-item itemColor"
className="dropdown-item text-[10px] md:text-[13px]"
style={{
paddingLeft: sortingOrder !== order && "31px"
}}
+2 -2
View File
@@ -1388,7 +1388,7 @@ function PdfRequestFiles() {
{isUiLoading && (
<div className="absolute h-[100vh] w-full flex flex-col justify-center items-center z-[999] bg-[#e6f2f2] bg-opacity-80">
<Loader />
<span style={{ fontSize: "13px", fontWeight: "bold" }}>
<span className="text-[13px] text-base-content">
This might take some time
</span>
</div>
@@ -1551,7 +1551,7 @@ function PdfRequestFiles() {
pageNumber={pageNumber}
/>
{/* pdf render view */}
<div className=" w-full md:w-[57%] flex mr-4">
<div className=" w-full md:w-[57%] flex mr-4">
<PdfZoom
setScale={setScale}
scale={scale}
+3 -2
View File
@@ -514,6 +514,7 @@ function PlaceHolderSign() {
const getYPosition = signBtnPosition[0]
? y - signBtnPosition[0].yPos
: y;
console.log("getxyPos", getXPosition, getYPosition);
const dropObj = {
xPosition: getXPosition / (containerScale * scale),
yPosition: getYPosition / (containerScale * scale),
@@ -1742,7 +1743,7 @@ function PlaceHolderSign() {
{isUiLoading && (
<div className="absolute h-[100vh] w-full flex flex-col justify-center items-center z-[999] bg-[#e6f2f2] bg-opacity-80">
<Loader />
<span className="text-[13px] font-bold">
<span className="text-[13px] text-base-content">
This might take some time
</span>
</div>
@@ -1779,7 +1780,7 @@ function PlaceHolderSign() {
pageNumber={pageNumber}
/>
{/* pdf render view */}
<div className=" w-full md:w-[57%] flex mr-4">
<div className=" w-full md:w-[57%] flex mr-4">
<PdfZoom
setScale={setScale}
scale={scale}
+2 -2
View File
@@ -1166,7 +1166,7 @@ function SignYourSelf() {
{isUiLoading && (
<div className="absolute h-[100vh] w-full z-[999] flex flex-col justify-center items-center bg-[#e6f2f2] bg-opacity-80">
<Loader />
<span style={{ fontSize: "13px", fontWeight: "bold" }}>
<span className="text-[13px] text-base-content">
This might take some time
</span>
</div>
@@ -1214,7 +1214,7 @@ function SignYourSelf() {
pageNumber={pageNumber}
containerWH={containerWH}
/>
<div className=" w-full md:w-[57%] flex mr-4">
<div className=" w-full md:w-[57%] flex mr-4">
<PdfZoom
setScale={setScale}
scale={scale}
@@ -423,6 +423,7 @@ const TemplatePlaceholder = () => {
(dragTypeValue === "stamp" || dragTypeValue === "image") && true,
key: key,
scale: containerScale,
// isMobile: isMobile,
zIndex: posZIndex,
type: item.text,
options: addWidgetOptions(dragTypeValue),
@@ -1338,7 +1339,7 @@ const TemplatePlaceholder = () => {
/>
{/* pdf render view */}
<div className=" w-full md:w-[57%] flex mr-4">
<div className=" w-full md:w-[57%] flex mr-4">
<PdfZoom
setScale={setScale}
scale={scale}
@@ -4,7 +4,6 @@ import Loader from "./Loader";
function LoaderWithMsg({ isLoading }) {
return (
<div className="flex flex-col justify-center items-center h-[100vh]">
{/* <img alt="loader" src={loader} className="w-[80px] h-[80px]" /> */}
<Loader />
<span className="text-[13px] text-base-cotent">{isLoading.message}</span>
</div>
+2 -2
View File
@@ -6,7 +6,7 @@ const Tooltip = ({ id, message, url, iconColor }) =>
<button onClick={() => openInNewTab(url)} className={"text-center"}>
<sup>
<i
className="fa-light fa-question rounded-full border-[1.5px] py-[1.5px] px-[4px] text-[13px]"
className="fa-light fa-question rounded-full border-[1px] py-[1.5px] px-[4px] text-[13px]"
style={{
borderColor: iconColor ? iconColor : "#33bbff",
color: iconColor ? iconColor : "#33bbff"
@@ -23,7 +23,7 @@ const Tooltip = ({ id, message, url, iconColor }) =>
>
<sup>
<i
className="fa-light fa-question rounded-full border-[1.5px] py-[1.5px] px-[4px] text-[13px]"
className="fa-light fa-question rounded-full border-[1px] py-[1.5px] px-[4px] text-[13px]"
style={{
borderColor: iconColor ? iconColor : "#33bbff",
color: iconColor ? iconColor : "#33bbff"
+6 -127
View File
@@ -1,12 +1,3 @@
.mainDiv {
position: relative;
}
.successBtn {
background: #3ac9d6;
border: 1px solid #3ac9d6;
}
.warning {
position: absolute;
padding: 8px;
@@ -38,16 +29,6 @@
margin: 0 auto;
}
.successBox {
z-index: 1;
position: absolute;
top: 5%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 13px;
animation: inAnimation 2s ease-in-out;
}
@keyframes inAnimation {
0% {
opacity: 0;
@@ -83,117 +64,15 @@
font-size: 12px;
font-weight: 600;
border-radius: 2px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.18);
box-shadow:
0 1px 3px rgba(0, 0, 0, 0.1),
0 1px 2px rgba(0, 0, 0, 0.18);
}
.signature:hover {
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.18);
box-shadow:
0 2px 4px rgba(0, 0, 0, 0.1),
0 2px 4px rgba(0, 0, 0, 0.18);
background: #13a8da;
color: white;
}
.imgupload {
color: white;
cursor: pointer;
padding: 10px 14px 10px;
background: #15b4e9;
font-size: 12px;
font-weight: 600;
border-radius: 2px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.18);
min-width: 105px;
}
.imgupload:hover {
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.18);
background: #13a8da;
color: white;
}
.loaderContainer {
position: fixed;
inset: 0%;
width: 100%;
height: 100svh;
background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7));
display: flex;
align-items: center;
justify-content: center;
}
.loader {
width: 70px;
height: 70px;
border-top: 4px solid #1b8ef4;
border-left: 4px solid #1b8ef4;
border-radius: 80%;
animation: spin 0.5s linear infinite;
}
@keyframes spin {
from {
transform: rotate(0);
}
to {
transform: rotate(360deg);
}
}
.customBtn {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.18);
padding: 10px 14px 10px;
color: white;
font-weight: 600;
font-size: 12px;
text-transform: uppercase;
border-radius: 2px;
margin-left: 10px;
width: 100px;
}
.clearbtn {
font-size: 15px;
}
.clearbtn:hover {
text-decoration: underline;
text-underline-offset: 2px;
color: blue;
}
.successBtn:hover {
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.18);
background: #1ab6ce;
color: white;
}
.resetBtn {
background: #188ae2;
margin-left: 10;
border: 1px solid #188ae2;
}
.resetBtn:hover {
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.18);
background: #177ecd;
color: white;
}
.signBlock {
display: flex;
flex-direction: row;
gap: 12px;
}
.signInputManage {
width: 50%;
}
@media (max-width: 815px) {
.signBlock {
display: flex;
flex-direction: column;
}
.signInputManage {
width: 100%;
}
}
+4 -249
View File
@@ -9,7 +9,8 @@
border-radius: 6px;
overflow: hidden;
padding: 5px;
box-shadow: 0px 10px 38px -10px rgba(22, 23, 24, 0.35),
box-shadow:
0px 10px 38px -10px rgba(22, 23, 24, 0.35),
0px 10px 20px -15px rgba(22, 23, 24, 0.2);
z-index: 99;
}
@@ -106,110 +107,14 @@
color: var(--violet-11);
}
.itemColor {
font-size: 13px !important;
}
.folderComponent {
padding: 30px;
height: 100%;
border-radius: 5px;
}
.inputStyle {
border: 1.6px solid #ccc !important;
}
.folderComponent::-webkit-scrollbar {
display: none;
/* for Chrome, Safari, and Opera */
}
.modal {
margin-top: 50px;
}
.folderBox {
/* box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
margin: 10px ;
padding: 5px 0px 5px 40px; */
/* overflow: scroll;
display: flex;
justify-content: space-between;
width: 200px; */
margin: 10px;
/* box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px; */
}
.folderContainer {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
/* .folderBox:hover{
box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
font-weight: bold;
} */
.pdfName {
font-size: 10px;
font-weight: 600;
}
.viewbotton {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.18);
padding: 8px 20px;
color: white;
font-weight: 600;
font-size: 14px;
border: none;
border-radius: 2px;
margin-left: 10px;
}
.viewbotton:focus {
border: none;
outline: none;
}
.folderRender {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
cursor: pointer;
position: relative;
width: 100px;
height: 100px;
margin: 20px;
display: inline-block;
}
.pdfContainer {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-top: 20px;
align-items: center;
justify-content: space-around;
}
.pdfContainer .box:last-child {
margin-left: 0;
/* Override the margin on the last box */
margin-right: auto;
/* Align it to the start */
}
.icon-container {
position: relative;
width: 100px;
height: 100px;
margin: 10px;
display: inline-block;
cursor: pointer;
}
.hrStyle {
margin-top: 0rem !important;
@@ -218,17 +123,11 @@
border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.pdf-icon {
width: 100%;
height: 100%;
}
.status-badge {
position: absolute;
top: 0;
right: 0;
background-color: #fff;
width: 24px;
height: 24px;
display: flex;
@@ -268,14 +167,6 @@
color: #fff;
}
.add {
background-color: #05bbdb;
color: #fff;
padding: 8px 15px;
text-align: center;
display: flex;
margin: 5px;
}
.sort {
padding: 8px 15px;
@@ -292,56 +183,6 @@
border-radius: 2px;
}
/* Hover effect */
.info-box {
position: absolute;
bottom: 100%;
left: 0;
background-color: #fff;
border: 1px solid #ccc;
border-radius: 4px;
padding: 5px;
width: 180px;
display: none;
z-index: 10;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
text-align: center;
}
.icon-container:hover .info-box {
display: block;
}
.folderRender:hover .info-box {
display: block;
}
.info-box:hover {
z-index: 999;
}
.addFolderInput {
padding: 10px;
border-radius: 4px;
/* width: 440px; */
font-size: 15px;
border: 0.5px solid rgb(198, 195, 195);
}
.tooltip-inner {
background-color: #fff;
border: 1px solid black;
font-weight: 600;
opacity: 1 !important;
color: rgb(0, 0, 0);
border-radius: 3px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
font-size: 12px;
}
.fileName {
display: inline-block;
width: 100px;
@@ -353,22 +194,6 @@
font-weight: 480;
}
.foldName {
display: inline-block;
width: 100px;
white-space: nowrap;
overflow: hidden !important;
text-overflow: ellipsis;
font-size: 11px;
text-align: center;
font-weight: 480;
}
.statusSpan {
font-size: 12px;
font-weight: 500;
}
a {
all: unset;
}
@@ -378,7 +203,8 @@ a {
padding: 5px 10px;
width: 170px;
background-color: white;
box-shadow: hsl(206 22% 7% / 35%) 0px 10px 38px -10px,
box-shadow:
hsl(206 22% 7% / 35%) 0px 10px 38px -10px,
hsl(206 22% 7% / 20%) 0px 10px 20px -15px;
animation-duration: 400ms;
animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
@@ -455,85 +281,14 @@ a {
}
}
.dropMenuBD {
display: flex;
flex-direction: row;
align-items: center;
}
.dropMenuSS {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
display: none;
}
.folderPath {
overflow-x: auto;
white-space: nowrap;
cursor: pointer;
user-select: none;
}
.folderPath::-webkit-scrollbar {
display: none;
/* for Chrome, Safari, and Opera */
}
.docDeleteBtn {
/* box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.18); */
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),
var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
padding: 7px 17px;
color: white;
font-weight: 600 !important;
font-size: 12px !important;
border: none;
border-radius: 2px;
}
.docDeleteBtn:focus {
border: none;
outline: none;
}
.docDeleteBtn:hover {
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.18);
color: white;
}
@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;
}
.folderComponent {
margin: 10px;
}
}
@media screen and (max-width: 309px) {
.pdfContainer {
justify-content: center;
}
.sort {
padding: 2px;
}
.folderComponent {
margin: 10px;
}
}
+8 -728
View File
@@ -3,18 +3,6 @@
@import url("https://fonts.googleapis.com/css2?family=Delicious+Handrawn&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Cedarville+Cursive&display=swap");
.placeholderBlock {
padding: 0px;
position: absolute;
border-style: dashed;
width: 150px;
height: 60px;
background: #daebe0;
text-align: center;
justify-content: center;
border-width: 0.2px;
}
.react-datepicker__input-container {
position: initial !important;
}
@@ -37,46 +25,6 @@
border-radius: 50px;
}
.drodown-input {
padding: 5px;
width: 100%;
font-size: 0.75rem;
border: 1px solid #8ad5ce;
/* border: 1px solid #e2dddd; */
/* background-color: #e0e5f5; */
color: black;
font-family: inherit;
font-feature-settings: inherit;
font-variation-settings: inherit;
font-weight: inherit;
overflow: visible;
}
.drodown-input:focus {
outline: none;
border: 1px solid #099b8d;
}
.dropdownAdd {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.18);
color: white;
font-weight: 600;
font-size: 13px;
border: none;
margin-left: 10px;
}
.dropdownAdd:focus {
outline: none;
}
.dropdownList {
display: flex;
flex-direction: column;
justify-content: center;
width: 50%;
}
.signatureCanvas {
border: 2px solid #888;
background-color: rgb(255, 255, 255);
@@ -102,10 +50,6 @@
width: 460px;
}
.penContainerInitial {
width: 183px;
}
.borderResize {
position: absolute;
display: inline-block;
@@ -117,190 +61,14 @@
cursor: sw-resize;
}
.dropdown-date-menu {
min-width: 7rem;
}
.mailBtn {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.18);
padding: 3px 15px !important;
background-color: rgb(79 190 241);
border: none !important;
color: white !important;
}
.mailBtn:hover {
box-shadow: 0 2px 4px rgba(154, 36, 36, 0.1), 0 2px 4px rgba(0, 0, 0, 0.18);
}
.signatureBtn {
border: 1.5px solid #47a3ad;
border-radius: 3px;
display: flex;
padding: 0px;
justify-content: space-between;
background: white;
transition-duration: 0.4s;
cursor: all-scroll;
width: 'auto';
height: 30px;
color: black;
}
.disableSign {
border: 1.5px solid #47a3ad;
margin-bottom: 10px;
border-radius: 3px;
display: flex;
padding: 0px;
justify-content: space-between;
background: white;
transition-duration: 0.4s;
cursor: all-scroll;
width: 150px;
height: 30px;
color: black;
border: 1px solid rgb(203, 203, 203);
cursor: text;
}
.emailInput {
padding: 10px;
border: 1.5px solid gray;
border-radius: 4px;
width: 100%;
font-size: 15px;
padding-bottom: 20px;
}
.emailInput:focus {
outline: none;
border: 1.5px solid #47a3ad;
}
.addEmail {
padding: "0px";
border: 1.5px solid #47a3ad;
border-radius: 4px;
width: 100%;
font-size: 15px;
}
.addEmail,
.emailInput {
outline: none;
}
.addEmailInput {
border: none;
outline: none;
}
.emailChip {
background-color: #47a3ad;
margin: 4px;
border-radius: 10px;
padding: 5px 10px;
}
.addEmailInput {
padding: 10px;
border-radius: 4px;
width: 100%;
font-size: 15px;
}
.addEmailInput:focus {
outline: none;
border: none;
}
.signatureInput {
width: 80%;
border-radius: 4px;
font-size: 20px;
border: 1px solid #e2dddd;
color: black;
font-family: inherit;
font-feature-settings: inherit;
font-variation-settings: inherit;
font-weight: inherit;
overflow: visible;
height: 30px;
}
.signatureInput:focus {
outline: none;
border: 1px solid blue;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.18);
}
.resizable-box-overlay {
.icon {
position: absolute;
border: 2px solid #ddd;
overflow: hidden;
background-color: white;
}
.box-content {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
}
.close-button {
align-self: flex-end;
margin: 8px;
cursor: pointer;
}
.placeholdCloseBtn {
position: absolute;
right: -5px;
top: -5px;
border-radius: 100%;
font-size: 10px;
cursor: pointer;
padding: 0px 5.1px 1px 5px;
}
.signCloseBtn {
position: absolute;
font-size: 14px;
cursor: pointer;
z-index: 2;
background: white;
}
.signCopy {
position: absolute;
font-size: 13px;
cursor: pointer;
z-index: 2;
background: white;
}
.signUserIcon {
position: absolute;
font-size: 13px;
cursor: pointer;
z-index: 2;
background: white;
}
.settingIcon {
position: absolute;
font-size: 13px;
cursor: pointer;
z-index: 2;
background: white;
}
.ScrollbarsCustom-TrackY {
width: 4px !important;
}
@@ -315,19 +83,10 @@
align-items: center !important;
}
.finishBtn {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.18);
padding: 3px 30px;
color: white;
font-weight: 500 !important;
font-size: 14px !important;
border: none;
margin-left: 10px;
border-radius: 2px;
}
.sendMail {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.18);
box-shadow:
0 1px 3px rgba(0, 0, 0, 0.1),
0 1px 2px rgba(0, 0, 0, 0.18);
padding: 3px 30px;
color: white;
font-weight: 500 !important;
@@ -336,105 +95,7 @@
margin-left: 10px;
}
.finishBtn:focus {
border: none;
outline: none;
}
.finishBtn:hover {
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.18);
}
.saveBtn {
padding: 3px 18px !important;
}
.disabledFinish {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.18);
padding: 3px 30px;
color: white;
font-weight: 600;
font-size: 14px;
border: none;
margin-left: 10px;
}
.sendHover:hover {
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.18);
color: white;
}
.defaultSignBox {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.18);
width: 90%;
height: 111px;
padding: 8px 20px;
color: white;
font-weight: 600;
font-size: 14px;
border: none;
border-radius: 2px;
margin-left: 10px;
}
.defaultBtn {
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.18);
padding: 3px 26px;
color: black;
font-weight: 500;
font-size: 14px;
border: 1px solid gray;
border-radius: 2px;
margin-left: 10px;
border: "none";
}
.defaultBtn:focus {
border: none;
outline: none;
}
.signerList {
overflow-y: scroll;
max-height: 180px;
}
.signerList::-webkit-scrollbar {
display: none;
}
.showScroll {
height: 100%;
overflow: scroll;
}
.showScroll::-webkit-scrollbar {
display: none;
}
.hideScroll {
height: 100%;
overflow: scroll;
}
.signedStyle {
color: white;
padding: 5px;
font-family: sans-serif;
font-size: 15px !important;
}
.userName {
font-size: 12px !important;
font-weight: bold !important;
color: #424242 !important;
width: 100px;
white-space: nowrap;
overflow: hidden !important;
text-overflow: ellipsis;
}
.user{
.user {
white-space: nowrap;
overflow: hidden !important;
text-overflow: ellipsis;
@@ -447,26 +108,6 @@
/* background-color: #888; */
}
.useEmail {
font-size: 10px;
color: #424242;
font-weight: 500;
width: 100px;
white-space: nowrap;
overflow: hidden !important;
text-overflow: ellipsis;
}
.spanTagHead {
color: white !important;
font-size: 17px;
font-weight: 500;
}
.pTagBody {
font-size: 15px !important;
}
.signTab {
cursor: pointer !important;
font-weight: 400 !important;
@@ -474,71 +115,10 @@
font-size: 15px !important;
}
.cancelBtn {
color: black;
border: 1px solid #ccc;
}
.draggable-button {
padding: 10px 20px;
background: #3498db;
color: #fff;
border: none;
cursor: grab;
transition: transform 0.2s;
}
.draggable-button.dragging {
opacity: 0.5;
/* Reduce opacity while dragging */
transform: scale(1.1);
/* Apply a scaling effect while dragging */
}
.signatureContainer {
display: flex;
flex-direction: row;
justify-content: space-between;
/* background-color: #ebebeb; */
position: "relative";
}
.signerComponent {
/* box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px; */
/* width: 180px; */
background-color: white;
}
.modalBody {
padding: 1rem !important;
padding-top: 2rem !important;
}
.signLayoutContainer1 {
padding: 15px;
display: flex;
/* flex-direction: column; */
/* justify-content: start; */
align-items: center;
}
.signLayoutContainer2 {
display: none;
}
.preBtn1 {
display: flex;
align-items: center;
}
.preBtn2 {
display: none;
}
.headerBtn2 {
display: none;
}
.uploadImgLogo {
@@ -606,7 +186,6 @@
gap: 5px;
border: none;
background-color: #887abf;
width: 100px;
white-space: nowrap;
overflow: hidden !important;
@@ -668,7 +247,8 @@ option {
overflow: hidden;
background-color: white;
border-radius: 6px;
box-shadow: 0px 10px 38px -10px rgba(22, 23, 24, 0.35),
box-shadow:
0px 10px 38px -10px rgba(22, 23, 24, 0.35),
0px 10px 20px -15px rgba(22, 23, 24, 0.2);
}
@@ -733,11 +313,6 @@ option {
cursor: default;
}
.fontOptionContainer {
border: 1px solid #d6d3d3;
margin: 10px 0px 5px 0px;
}
.dropDownStyle {
width: auto;
}
@@ -754,16 +329,6 @@ option {
width: 76%;
}
.regxSelect {
border: 1px solid #8ad5ce;
width: 80%;
}
.regxSelect:focus {
outline: none;
border: 1px solid #8ad5ce;
}
.radioGroupInput {
width: 100%;
}
@@ -774,75 +339,15 @@ option {
justify-content: flex-start;
}
.labelWidthDesktop {
min-width: 100%;
min-height: 100%;
}
.labelWidthMobile {
width: 100%;
height: 100%;
}
.labelTextArea {
font-size: 12px;
border: 1px solid #007bff;
outline: none;
z-index: 999;
border-radius: 2px;
resize: none;
overflow: hidden;
}
.labelTextArea:focus {
outline: none;
border: 1px solid #188ae2;
}
@media screen and (max-width: 766px) {
.validateInputText {
width: 93%;
}
.regxSelect {
width: 100%;
}
.validateText {
display: flex;
flex-direction: column;
justify-content: flex-start;
}
.showPages {
display: none;
}
.dropdown-menu {
min-width: 0rem !important;
}
.signatureContainer {
display: flex;
flex-direction: column;
}
/* .signerComponent {
display: none;
} */
.preBtn1 {
display: none;
}
.preBtn2 {
display: flex;
align-items: center;
justify-content: space-between;
background-color: #ebebeb;
padding: 5px 10px;
}
#navbar {
overflow: hidden;
z-index: 49;
@@ -879,51 +384,13 @@ option {
position: fixed;
}
.stickyfooter {
position: fixed;
z-index: 99 !important;
bottom: 0px;
right: 0rem;
}
/* Add some top padding to the page content
to prevent sudden quick movement (as the
navigation bar gets a new position at the top of the
page (position:fixed and top:0) */
.stickyHead+.content {
.stickyHead + .content {
padding-top: 60px;
}
.signLayoutContainer2 {
display: flex;
flex-direction: row;
justify-content: space-around;
margin-top: 5px;
padding: 2px 5px 10px 5px;
position: sticky;
align-items: center;
}
.headerBtn {
display: none;
}
.headerBtn2 {
display: flex;
flex-direction: column;
justify-content: space-between;
margin-top: 5px;
}
.mobileHead {
display: flex;
}
.signatureText {
margin-right: 5px;
font-size: 12px;
}
}
@media screen and (max-width: 487px) and (min-width: 351px) {
@@ -940,17 +407,8 @@ option {
font-size: 30px;
}
.hidePdf {
display: none;
}
.mobileHead {
display: flex;
}
.signTab {
font-weight: 500 !important;
font-size: 12px !important;
}
}
@@ -968,10 +426,6 @@ option {
width: 280px;
}
.hidePdf {
display: none;
}
.signTab {
font-weight: 500 !important;
@@ -981,14 +435,6 @@ option {
.uploadImgLogo {
font-size: 25px;
}
.uploadImg {
font-size: 10px !important;
}
.mobileHead {
display: flex;
}
}
@media screen and (max-width: 310px) {
@@ -1001,178 +447,12 @@ option {
width: 230px;
}
.hidePdf {
display: none;
}
.signTab {
font-weight: 500 !important;
font-size: 8px !important;
}
.uploadImgLogo {
font-size: 20px;
}
.uploadImg {
font-size: 10px !important;
}
.mobileHead {
display: flex;
}
}
.signature-backdrop {
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
background-color: #000;
}
.signature-backdrop.fade.in {
opacity: 0.5;
}
.modaloverlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.75);
justify-content: center;
align-items: center;
z-index: 900;
}
.modalcontainer {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: #fff;
border-radius: 5px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
z-index: 901;
max-height: 80%;
min-width: 500px;
overflow-y: auto;
scrollbar-width: none;
/* Firefox */
-ms-overflow-style: none;
/* Internet Explorer and Edge */
}
.dropdownModal {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: #fff;
border-radius: 5px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
z-index: 901;
max-height: 80%;
min-width: 40%;
overflow-y: auto;
scrollbar-width: none;
/* Firefox */
-ms-overflow-style: none;
/* Internet Explorer and Edge */
}
/* Hide scrollbar for Webkit browsers */
.modalcontainer::-webkit-scrollbar {
display: none;
}
/* Hide scrollbar for Webkit browsers */
.dropdownModal::-webkit-scrollbar {
display: none;
}
.modalheader {
display: flex;
justify-content: space-between;
align-items: center;
padding: 10px 20px;
border-bottom: 1px solid #ccc;
color: #ffffff;
}
/* Styling for the modal title */
.modaltitle {
font-size: 1.2rem;
font-weight: normal;
}
/* Styling for the close button */
.closebtn {
background: none;
border: none;
font-size: 1.5rem;
cursor: pointer;
}
.defaultOptions {
font-size: 12px;
margin-left: 5px;
}
.defaultOptions:focus {
outline: none;
}
@media (max-width: 767px) {
.modalcontainer {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: #fff;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
z-index: 1000;
max-height: 80%;
min-width: 90%;
overflow-y: auto;
}
.signatureBtn {
width: max-content;
}
.dropdownModal {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: #fff;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
z-index: 1000;
max-height: 80%;
min-width: 60%;
overflow-y: auto;
}
}
@media (max-width: 464px) {
.dropdownModal {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: #fff;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
z-index: 1000;
max-height: 80%;
min-width: 78%;
overflow-y: auto;
}
}