From 86946a2c21e0739865f2a69a6eaafe98371f3435 Mon Sep 17 00:00:00 2001
From: RaktimaNXG <raktima.c@nxglabs.com>
Date: Wed, 14 Aug 2024 20:01:11 +0530
Subject: [PATCH] fix: date setting modal design in mobile view

---
 apps/OpenSign/src/components/pdf/Placeholder.js | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/apps/OpenSign/src/components/pdf/Placeholder.js b/apps/OpenSign/src/components/pdf/Placeholder.js
index 9a0511f63..f55c65074 100644
--- a/apps/OpenSign/src/components/pdf/Placeholder.js
+++ b/apps/OpenSign/src/components/pdf/Placeholder.js
@@ -922,10 +922,10 @@ function Placeholder(props) {
               {selectDate.format}
             </span>
           </div>
-          <div className="flex items-center mt-2">
+          <div className="flex items-center mt-4 md:mt-2">
             <span>{t("font-size")} :</span>
             <select
-              className="ml-[7px] op-select op-select-bordered op-select-sm focus:outline-none hover:border-base-content text-xs"
+              className="ml-[3px] md:ml:[7px] op-select op-select-bordered op-select-sm focus:outline-none hover:border-base-content text-xs"
               value={
                 props.fontSize ||
                 props.currWidgetsDetails?.options?.fontSize ||
@@ -941,14 +941,14 @@ function Placeholder(props) {
                 );
               })}
             </select>
-            <div className="flex flex-row gap-1 items-center ml-4">
+            <div className="flex flex-row gap-1 items-center ml-2 md:ml-4 ">
               <span>{t("color")}: </span>
               <select
                 value={
                   props.fontColor || props.pos.options?.fontColor || "black"
                 }
                 onChange={(e) => props.setFontColor(e.target.value)}
-                className="ml-[7px] op-select op-select-bordered op-select-sm focus:outline-none hover:border-base-content text-xs"
+                className="ml-[4px] md:ml[7px] op-select op-select-bordered op-select-sm focus:outline-none hover:border-base-content text-xs"
               >
                 {fontColorArr.map((color, ind) => {
                   return (
@@ -960,7 +960,8 @@ function Placeholder(props) {
               </select>
               <span
                 style={{
-                  background: props.fontColor || props.pos.options?.fontColor
+                  background:
+                    props.fontColor || props.pos.options?.fontColor || "black"
                 }}
                 className="w-5 h-[19px] ml-1"
               ></span>