master
mahdi andalib 3 years ago
parent 4ed807c571
commit 6043989623
  1. 79
      src/components/PopupCard/index.js

@ -24,7 +24,7 @@ const PopupCard = () => {
className="hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 w-full md:inset-0 h-modal md:h-full justify-center items-center" className="hidden overflow-y-auto overflow-x-hidden fixed top-0 right-0 left-0 z-50 w-full md:inset-0 h-modal md:h-full justify-center items-center"
> >
<div className="relative p-4 w-full h-full md:h-auto"> <div className="relative p-4 w-full h-full md:h-auto">
<div className="w-9/12 mx-auto relative bg-white rounded-lg shadow dark:bg-gray-700"> <div className="w-8/12 mx-auto relative bg-white rounded-lg shadow dark:bg-gray-700">
<div className="flex justify-between items-start p-5 rounded-t"> <div className="flex justify-between items-start p-5 rounded-t">
{/* cancle icon */} {/* cancle icon */}
<div <div
@ -36,43 +36,50 @@ const PopupCard = () => {
</div> </div>
</div> </div>
{/* modalBody */} {/* modalBody */}
{/* top */} <div className="w-11/12 mx-auto mt-3">
<div className="px-5 mt-3 flex "> {/* top */}
{/* right */} <div className="flex">
<input {/* right */}
type="text" <input
className="relative w-1/2 border-2 rounded-md text-sm h-12 type="text"
className="relative w-1/2 border-2 rounded-md text-sm h-12
focus:outline-none focus:border-[#22577E] focus:ring-1 focus:ring-[#22577E]" focus:outline-none focus:border-[#22577E] focus:ring-1 focus:ring-[#22577E]"
style={{ style={{
color: "#00253A", color: "#00253A",
borderColor: activeInput ? "#22577E" : "#06BACE", borderColor: activeInput ? "#22577E" : "#06BACE",
}} }}
onFocus={() => setActiveInput(true)} onFocus={() => setActiveInput(true)}
onBlur={() => setActiveInput(false)} onBlur={() => setActiveInput(false)}
/> />
{/* ${activeInput ? "text-red-500" : "text-yellow-400"} */} <span
<span className={`absolute right-20 -mt-2 bg-white text-xs px-2 font-bold`}
className={`absolute right-10 -mt-2 bg-white text-xs px-2 font-bold`} style={{ color: activeInput ? "#22577E" : "#06BACE" }}
style={{ color: activeInput ? "#22577E" : "#06BACE" }} >
> نام کارت
نام کارت </span>
</span> {/* divider */}
{/* left */} <div className="bg-[#DBDBDB] w-0.5 mx-5"></div>
{/* <div {/* left */}
date-rangepicker <div date-rangepicker className="flex items-center w-1/2">
className="flex items-center w-1/2 bg-red-600" <div className="relative w-full">
> <img src={calender} className="absolute top-3 left-2" />
<div className="relative w-full"> <input
<img src={calender} className="absolute top-3 left-2" /> name="start"
<input type="text"
name="start" className="w-full border-2 border-blue-400 rounded-md text-sm h-12
type="text" focus:outline-none focus:border-[#22577E] focus:ring-1 focus:ring-[#22577E]"
className="w-full border-2 border-blue-400 rounded-md text-sm h-12 placeholder="چهارشنبه 10 فروردین 1401 بماند به یادگار"
focus:outline-none focus:border-blue-500 focus:ring-1 focus:ring-blue-500" />
placeholder="چهارشنبه 10 فروردین 1401 بماند به یادگار" </div>
/>
</div> </div>
</div> */} </div>
{/* divider */}
<div className="border-2 border-red-600 my-5"></div>
{/* right */}
<div className="flex">
<textarea class="resize rounded-md w-1/2"></textarea>
<div className="bg-[#DBDBDB] w-0.5 mx-5"></div>
</div>
</div> </div>
</div> </div>
</div> </div>

Loading…
Cancel
Save