master
mahdi andalib 3 years ago
parent 7714d8badf
commit 4301e42428
  1. 2
      src/App.js
  2. 54
      src/components/PopupCard/index.js

@ -117,7 +117,7 @@ function App() {
</div> */}
{/* <BreadCrumb /> */}
{/* <SearchBox /> */}
{/* <FileManager /> */}
<FileManager />
{/* <Playlist /> */}
{/* <Folderlists /> */}
{/* <Blogs /> */}

@ -6,6 +6,7 @@ import calender from "./calender.svg";
const PopupCard = ({ textArea }) => {
const [activeInput, setActiveInput] = useState(false);
const [checklist, setChecklist] = useState(0);
return (
<section className="">
@ -76,13 +77,10 @@ const PopupCard = ({ textArea }) => {
{/* divider */}
<div className="border border-[#DBDBDB] my-5"></div>
{/* middle */}
<div className="flex">
<div className="flex flex-row">
{/* right */}
<div className="flex flex-col">
<span
class="resize-y relative w-1/2 h-fit p-4 text-justify border-2 rounded-md text-sm border-[#06BACE]
focus:outline-none focus:border-[#22577E] focus:ring-1 focus:ring-[#22577E]"
>
<div className="flex flex-col w-1/2">
<span class="resize-y relative w-full h-fit p-4 text-justify border-2 rounded-md text-sm border-[#06BACE] focus:outline-none focus:border-[#22577E] focus:ring-1 focus:ring-[#22577E]">
{textArea}
</span>
<span
@ -90,13 +88,49 @@ const PopupCard = ({ textArea }) => {
>
نام کارت
</span>
<div className="my-5">
<input type="checkbox" />
<span className="text-sm mr-2">چک لیست ها</span>
<div className="my-5 flex flex-col">
<div>
<input
type="checkbox"
className="form-checkbox text-green-500"
/>
<span className="text-sm mr-2">چک لیست ها</span>
</div>
{checklist}
<textarea class="resize-y rounded-md my-5 text-sm border-[#06BACE] focus:outline-none focus:border-[#22577E] focus:ring-1 focus:ring-[#22577E]"></textarea>
<div>
<input
type="checkbox"
className="form-checkbox text-green-500"
onClick={() => setChecklist(checklist + 25)}
/>
<span className="text-sm mr-2">چک لیست ها</span>
</div>
<div>
<input
type="checkbox"
className="form-checkbox text-green-500"
onClick={() => setChecklist(checklist + 25)}
/>
<span className="text-sm mr-2">چک لیست ها</span>
</div>
</div>
</div>
{/* divider */}
<div className="bg-[#DBDBDB] w-0.5 mx-5"></div>
<div className="bg-[#DBDBDB] w-1 mx-5"></div>
{/* left */}
<div date-rangepicker className="flex items-center w-1/2">
<div className="relative w-full">
<img src={calender} className="absolute top-3 left-2" />
<input
name="start"
type="text"
className="w-full border-2 border-blue-400 rounded-md text-sm h-12
focus:outline-none focus:border-[#22577E] focus:ring-1 focus:ring-[#22577E]"
placeholder="چهارشنبه 10 فروردین 1401 بماند به یادگار"
/>
</div>
</div>
</div>
</div>
</div>

Loading…
Cancel
Save