style adjustment

This commit was merged in pull request #686.
This commit is contained in:
victorAnumudu
2024-04-01 11:41:29 +01:00
parent a4307310ad
commit cab461bd2e
9 changed files with 814 additions and 198 deletions
@@ -56,7 +56,7 @@ export default function AssignMediaTask({
amount: "",
job_description: "",
timeline_days: "",
media_uid: activeMedia.uid,
media_uid: activeMedia?.uid,
family_uid: family_uid,
media_type: "COMMON"
};
@@ -89,7 +89,7 @@ export default function AssignMediaTask({
className={`job-action-modal-body w-full min-h-[450px] max-h-[450px] overflow-y-auto md:grid md:grid-cols-2`}
>
<div className="p-4 pt-0">
<div className="p-4 w-full min-h-[400px] max-h-[400px] overflow-y-auto bg-slate-100 rounded-md dark:bg-[#11131f] dark:text-white">
<div className="p-4 w-full min-h-[410px] max-h-[410px] overflow-y-auto bg-slate-100 rounded-md dark:bg-[#11131f] dark:text-white">
{commonMedia?.data?.length ? (
commonMedia?.data?.map((item, index) => (
<div
@@ -140,12 +140,12 @@ export default function AssignMediaTask({
</Suspense>
</div>
</div>
<div className="grid grid-cols-2 gap-3">
<div className="grid grid-cols-3 gap-3">
{/* Price */}
<div className="field w-full">
<label htmlFor="price" className="job-label flex gap-1">
Price
<span className='text-red-500 text-[10px]'>{props.errors.amount && props.touched.amount && props.errors.amount}</span>
<span className='text-red-500 text-base'>{props.errors.amount && props.touched.amount && '*'}</span>
</label>
<InputCom
fieldClass="px-6 text-right"
@@ -168,7 +168,7 @@ export default function AssignMediaTask({
className="job-label flex gap-1"
>
Currency
{props.errors.currency && props.touched.currency && <span className="text-[10px] text-red-500">{props.errors.currency}</span>}
{props.errors.currency && props.touched.currency && <span className="text-base text-red-500">*</span>}
</label>
<select
id="currency"
@@ -184,7 +184,7 @@ export default function AssignMediaTask({
) : walletDetails.data.length ? (
<>
<option className="text-slate-500 text-[13.975px]" value="">
Currency
Select
</option>
{walletDetails.data?.map((item, index) => (
<option
@@ -203,48 +203,48 @@ export default function AssignMediaTask({
)}
</select>
</div>
</div>
{/* Duration */}
<div className="field w-full">
<label
htmlFor="timeline_days"
className="job-label flex gap-1"
>
Timeline
{props.errors.timeline_days && props.touched.timeline_days && <span className="text-[12px] text-red-500">{props.errors.timeline_days}</span>}
</label>
<select
id="timeline_days"
name="timeline_days"
value={props.values.timeline_days}
className={`input-field w-full h-[42px] flex items-center px-2 mt-2 rounded-full placeholder:text-base text-dark-gray dark:text-white bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-none`}
onChange={props.handleChange}
>
{publicArray.length && (
<>
<option className="text-slate-500 text-[13.975px]" value="">
Duration
</option>
{publicArray.map(({ name, duration }, idx) => (
<option
key={idx}
className="text-slate-500 text-[13.975px]"
value={duration}
>
{name}
{/* Duration */}
<div className="field w-full">
<label
htmlFor="timeline_days"
className="job-label flex gap-1"
>
Timeline
{props.errors.timeline_days && props.touched.timeline_days && <span className="text-base text-red-500">*</span>}
</label>
<select
id="timeline_days"
name="timeline_days"
value={props.values.timeline_days}
className={`input-field w-full h-[42px] flex items-center px-2 mt-2 rounded-full placeholder:text-base text-dark-gray dark:text-white bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-none`}
onChange={props.handleChange}
>
{publicArray.length && (
<>
<option className="text-slate-500 text-[13.975px]" value="">
Duration
</option>
))}
</>
)}
</select>
{publicArray.map(({ name, duration }, idx) => (
<option
key={idx}
className="text-slate-500 text-[13.975px]"
value={duration}
>
{name}
</option>
))}
</>
)}
</select>
</div>
</div>
{/* Delivery Detail */}
<div className="my-3">
<label className="w-full job-label flex gap-1">
Delivery Detail
{props.errors.job_description && props.touched.job_description && <span className="text-[12px] text-red-500">{props.errors.job_description}</span>}
{props.errors.job_description && props.touched.job_description && <span className="text-base text-red-500">*</span>}
</label>
<textarea
className={`p-1 w-full text-sm text-slate-900 dark:text-white bg-transparent outline-none border border-slate-300 rounded-md`}