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
@@ -74,21 +74,6 @@ export default function NewTasks({ formState, setFormState }) {
</div>
{/* Description */}
{/* <div className="field w-full mb-[5px]">
<label htmlFor="description" className="job-label">Description</label>
<InputCom
fieldClass="px-6"
// label="Description"
// labelClass="tracking-wide"
inputBg="bg-slate-100"
type="text"
name="description"
value={formState.description}
inputHandler={handleInputChange}
// blurHandler={props.handleBlur}
// error={props.errors.description && props.touched.description && props.errors.description}
/>
</div> */}
<div className="field flex flex-col sm:flex-row w-full gap-2">
<div className="w-full">
<label
@@ -100,7 +85,7 @@ export default function NewTasks({ formState, setFormState }) {
<textarea
id="description"
rows="5"
className={`input-field px-3 py-2 placeholder:text-base text-dark-gray dark:text-white w-full h-[100px] bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-[#dce4e9] rounded-[10px]`}
className={`input-field px-3 py-2 placeholder:text-base text-dark-gray dark:text-white w-full h-[80px] bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-[#dce4e9] rounded-[10px]`}
style={{ resize: "none" }}
name="description"
value={formState.description}
@@ -136,66 +121,68 @@ export default function NewTasks({ formState, setFormState }) {
{/* inputs starts here */}
<div className="w-full flex flex-col gap-2">
{/* Currency */}
<div className="field w-full">
<label
htmlFor="country"
className="job-label"
>
Currency
{/* {props.errors.country && props.touched.country && <span className="text-[12px] text-red-500">{props.errors.country}</span>} */}
</label>
<select
id="country"
name="country"
value={formState.country}
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={handleInputChange}
// onBlur={props.handleBlur}
>
{walletDetails?.loading ? (
<option className="text-slate-500 text-[13.975px]" value="">
Loading...
</option>
) : walletDetails.data.length ? (
<>
<option className="text-slate-500 text-[13.975px]" value="">
Currency
</option>
{walletDetails.data?.map((item, index) => (
<option
key={index}
className="text-slate-500 text-lg"
value={item?.country}
>
{item?.code}
</option>
))}
</>
) : (
<option className="text-slate-500 text-lg" value="">
No Options Found! Try Again
</option>
)}
</select>
</div>
<div className="grid grid-cols-2 gap-3">
{/* Price */}
<div className="field w-full">
<label htmlFor="price" className="job-label">Reward</label>
<InputCom
fieldClass="px-6 text-right"
// label="Price"
// labelClass="tracking-wide"
inputBg="bg-slate-100"
type="number"
name="price"
placeholder="0"
value={formState.price}
inputHandler={handleInputChange}
// blurHandler={props.handleBlur}
// error={props.errors.price && props.touched.price && props.errors.price}
/>
</div>
{/* Price */}
<div className="field w-full">
<label htmlFor="price" className="job-label">Price</label>
<InputCom
fieldClass="px-6 text-right"
// label="Price"
// labelClass="tracking-wide"
inputBg="bg-slate-100"
type="number"
name="price"
placeholder="0"
value={formState.price}
inputHandler={handleInputChange}
// blurHandler={props.handleBlur}
// error={props.errors.price && props.touched.price && props.errors.price}
/>
{/* Currency */}
<div className="field w-full">
<label
htmlFor="country"
className="job-label"
>
Currency
{/* {props.errors.country && props.touched.country && <span className="text-[12px] text-red-500">{props.errors.country}</span>} */}
</label>
<select
id="country"
name="country"
value={formState.country}
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={handleInputChange}
// onBlur={props.handleBlur}
>
{walletDetails?.loading ? (
<option className="text-slate-500 text-[13.975px]" value="">
Loading...
</option>
) : walletDetails.data.length ? (
<>
<option className="text-slate-500 text-[13.975px]" value="">
Select
</option>
{walletDetails.data?.map((item, index) => (
<option
key={index}
className="text-slate-500 text-lg"
value={item?.country}
>
{item?.code}
</option>
))}
</>
) : (
<option className="text-slate-500 text-lg" value="">
No Options Found! Try Again
</option>
)}
</select>
</div>
</div>
{/* Duration */}