From bb5a96624961ccc5560396c98a589ca52c3366e0 Mon Sep 17 00:00:00 2001
From: victorAnumudu <anumuduchukwuebuka@gmail.com>
Date: Mon, 1 Apr 2024 21:42:29 +0100
Subject: [PATCH 1/2] added media layout

---
 .../FamilyPopout/AssignMediaTask.jsx          |  6 ++--
 .../MyActiveJobs/ActiveJobsMedia.jsx          | 28 +++++++++++++------
 .../JobActions/CurrentTaskAction.jsx          |  2 +-
 src/components/Partials/MediaHeader.jsx       |  4 +--
 4 files changed, 25 insertions(+), 15 deletions(-)

diff --git a/src/components/FamilyAcc/FamilyPopout/AssignMediaTask.jsx b/src/components/FamilyAcc/FamilyPopout/AssignMediaTask.jsx
index 9b7fd88..1741542 100644
--- a/src/components/FamilyAcc/FamilyPopout/AssignMediaTask.jsx
+++ b/src/components/FamilyAcc/FamilyPopout/AssignMediaTask.jsx
@@ -144,7 +144,7 @@ export default function AssignMediaTask({
                                             </div>
                                             <div className="grid grid-cols-3 gap-3">
                                                 {/* Price */}
-                                                <div className="field w-full">
+                                                <div className="field w-full flex flex-col justify-between">
                                                     <label htmlFor="price" className="job-label flex gap-1">
                                                         Reward
                                                         <span className='text-red-500 text-base'>{props.errors.amount && props.touched.amount && '*'}</span>
@@ -164,7 +164,7 @@ export default function AssignMediaTask({
                                                 </div>
 
                                                 {/* Currency */}
-                                                <div className="field w-full">
+                                                <div className="field w-full flex flex-col justify-between">
                                                     <label
                                                     htmlFor="currency"
                                                     className="job-label flex gap-1 invisible"
@@ -224,7 +224,7 @@ export default function AssignMediaTask({
                                                 </div>
                                             
                                                 {/* Duration */}
-                                                <div className="field w-full">
+                                                <div className="field w-full flex flex-col justify-between">
                                                     <label
                                                     htmlFor="timeline_days"
                                                     className="job-label flex gap-1"
diff --git a/src/components/MyActiveJobs/ActiveJobsMedia.jsx b/src/components/MyActiveJobs/ActiveJobsMedia.jsx
index 679af8d..f2877a8 100644
--- a/src/components/MyActiveJobs/ActiveJobsMedia.jsx
+++ b/src/components/MyActiveJobs/ActiveJobsMedia.jsx
@@ -277,7 +277,7 @@ function ActiveJobsMedia(props) {
         state={props.details.accountDetails}
     >
         {/* job title */}
-            <div className="py-[20px] bg-white dark:bg-black dark:text-white px-4 rounded-2xl shadow-md md:flex justify-between items-start gap-16">
+            {/* <div className="py-[20px] bg-white dark:bg-black dark:text-white px-4 rounded-2xl shadow-md md:flex justify-between items-start gap-16">
                 <div className="w-full">
                     <div className="w-full flex justify-start space-x-3 items-start">
                         <button
@@ -310,7 +310,7 @@ function ActiveJobsMedia(props) {
                         </h1>
                     </div>
                 </div>
-            </div>
+            </div> */}
         {/* end of job title */}
 
         <div className="my-4 lg:flex justify-between items-start space-y-4 lg:space-x-4 lg:space-y-0">
@@ -320,7 +320,7 @@ function ActiveJobsMedia(props) {
                 <VideoElement videoId={props?.details?.media_uid} />
             </div>
 
-            <div className="w-full p-4 bg-white dark:bg-black rounded-2xl shadow-md md:flex md:justify-between gap-2">
+            <div className="w-full p-4 bg-white dark:bg-black rounded-2xl shadow-md md:flex md:justify-between gap-8">
                 <div className="w-full flex flex-col justify-between">
                     <div className="w-full">
                         <p className="w-full text-base text-right text-sky-blue">
@@ -330,13 +330,23 @@ function ActiveJobsMedia(props) {
                             <p className="font-semibold text-black dark:text-white">
                                 Description:{" "}
                             </p>
-                            <p className="p-2 border border-sky-blue">
+                            <p className="p-2 ml-8 border border-sky-blue">
                                 {props?.details && props.details.description}
                             </p>
                         </div>
-                    </div>
-                    <div className="my-2">
-                        <IndexJobActions details={props.details} />
+                        <div className="mt-6 w-full lg:flex gap-8">
+                            <div className="w-full text-base dark:text-white tracking-wide text-sky-blue">
+                                <p className="font-semibold text-black dark:text-white">
+                                    Delivery Detail:{" "}
+                                </p>
+                                <p className="p-2 ml-8">
+                                    {props?.details && props.details.job_description}
+                                </p>
+                            </div>
+                            <div className="my-2 lg:my-0">
+                                <IndexJobActions details={props.details} />
+                            </div>
+                        </div>
                     </div>
                 </div>
 
@@ -389,14 +399,14 @@ function ActiveJobsMedia(props) {
                         day(s)
                         </span>
                     </div>
-                    <div className="my-1 text-base text-slate-700 tracking-wide flex items-center gap-3">
+                    {/* <div className="my-1 text-base text-slate-700 tracking-wide flex items-center gap-3">
                         <span className="font-semibold text-black dark:text-white">
                         No:{" "}
                         </span>
                         <span className="">
                         {props.details?.contract && props.details.contract}
                         </span>
-                    </div>
+                    </div> */}
                 </div>
                 {/* end of job details */}
             </div>
diff --git a/src/components/MyActiveJobs/JobActions/CurrentTaskAction.jsx b/src/components/MyActiveJobs/JobActions/CurrentTaskAction.jsx
index eb8b393..363f21a 100644
--- a/src/components/MyActiveJobs/JobActions/CurrentTaskAction.jsx
+++ b/src/components/MyActiveJobs/JobActions/CurrentTaskAction.jsx
@@ -65,7 +65,7 @@ function CurrentTaskAction({jobDetails}) {
           <div className="w-full text-sm text-left text-gray-500">
             {jobDetails.job_type == 'MEDIA' ?
             <div className="flex justify-center items-center">
-                <button onClick={popUpHandler} type="button" className="custom-btn btn-gradient text-white">
+                <button onClick={popUpHandler} type="button" className="p-1 lg:p-2 border-4 border-slate-300 text-lg lg:text-xl font-medium text-orange-600 rounded-2xl hover:opacity-80 transition-all duration-300">
                     I have completed this task
                 </button>
             </div>
diff --git a/src/components/Partials/MediaHeader.jsx b/src/components/Partials/MediaHeader.jsx
index b3ac67f..9915b83 100644
--- a/src/components/Partials/MediaHeader.jsx
+++ b/src/components/Partials/MediaHeader.jsx
@@ -165,7 +165,7 @@ export default function MediaHeader({ logoutModalHandler, sidebarHandler, backpa
           </div>
 
           {/* Back BTN AND TITLE */}
-          {/* <div className="pl-4 w-full flex justify-start gap-3 items-center">
+          <div className="pl-4 w-full flex justify-start gap-3 items-center">
             <button
             type="button"
             className="min-w-[35px] h-auto text-[#374557] border border-sky-blue p-1 rounded-full"
@@ -202,7 +202,7 @@ export default function MediaHeader({ logoutModalHandler, sidebarHandler, backpa
             <h1 className="text-base md:text-[20px] font-bold text-dark-gray dark:text-white tracking-wide">
             {title && title}
             </h1>
-          </div> */}
+          </div>
           
 
           {/* user info */}

From 8a7b56068d5bae7199de165b0c925ffa428355b1 Mon Sep 17 00:00:00 2001
From: victorAnumudu <anumuduchukwuebuka@gmail.com>
Date: Mon, 1 Apr 2024 21:47:00 +0100
Subject: [PATCH 2/2] added media layout

---
 src/components/MyActiveJobs/ActiveJobsMedia.jsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/MyActiveJobs/ActiveJobsMedia.jsx b/src/components/MyActiveJobs/ActiveJobsMedia.jsx
index f2877a8..6319e79 100644
--- a/src/components/MyActiveJobs/ActiveJobsMedia.jsx
+++ b/src/components/MyActiveJobs/ActiveJobsMedia.jsx
@@ -335,8 +335,8 @@ function ActiveJobsMedia(props) {
                             </p>
                         </div>
                         <div className="mt-6 w-full lg:flex gap-8">
-                            <div className="w-full text-base dark:text-white tracking-wide text-sky-blue">
-                                <p className="font-semibold text-black dark:text-white">
+                            <div className="w-full text-base dark:text-white tracking-wide">
+                                <p className="font-semibold text-sky-blue dark:text-white">
                                     Delivery Detail:{" "}
                                 </p>
                                 <p className="p-2 ml-8">