Compare commits

...

4 Commits

Author SHA1 Message Date
victorAnumudu 359344772e added space between buttons 2024-04-02 14:56:07 +01:00
ameye 1533465f8d Merge branch 'media-detail-style' of WrenchBoard/Users-Wrench into master 2024-04-02 12:03:37 +00:00
victorAnumudu 66b1ff5f92 updated style 2024-04-02 11:24:45 +01:00
ameye c141ab1ef2 Merge branch 'media-layout' of WrenchBoard/Users-Wrench into master 2024-04-01 20:53:44 +00:00
8 changed files with 169 additions and 157 deletions
+11 -11
View File
@@ -326,17 +326,17 @@ function ActiveJobsMedia(props) {
<p className="w-full text-base text-right text-sky-blue">
{props?.details && props.details.job_to}
</p>
<div className="text-base text-slate-700 dark:text-white tracking-wide">
<p className="font-semibold text-black dark:text-white">
<div className="text-base tracking-wide">
<p className="font-semibold text-black dark:text-white tracking-wider">
Description:{" "}
</p>
<p className="p-2 ml-8 border border-sky-blue">
<p className="p-2 ml-8 border-b border-sky-blue">
{props?.details && props.details.description}
</p>
</div>
<div className="mt-6 w-full lg:flex gap-8">
<div className="w-full text-base dark:text-white tracking-wide">
<p className="font-semibold text-sky-blue dark:text-white">
<div className="w-full text-base tracking-wide">
<p className="font-semibold text-black dark:text-white tracking-wider">
Delivery Detail:{" "}
</p>
<p className="p-2 ml-8">
@@ -352,7 +352,7 @@ function ActiveJobsMedia(props) {
{/* job details */}
<div className="w-full md:w-[200px]">
<p className="text-base text-sky-blue">Delivery Detail</p>
{/* <p className="text-base text-sky-blue">Delivery Detail</p> */}
{passDue ? (
<div className="my-1">
<p className="text-base text-slate-700">
@@ -385,7 +385,7 @@ function ActiveJobsMedia(props) {
<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">
Price:{" "}
Reward:{" "}
</span>
<span className="">{thePrice}</span>
</div>
@@ -442,7 +442,7 @@ function ActiveJobsMedia(props) {
</div>
{tab == "message" ? (
<textarea
className="p-4 w-full h-[150px] text-base text-slate-600 dark:text-white bg-white dark:bg-black border border-[#4687ba] outline-none"
className="p-4 w-full h-[150px] text-base text-slate-600 dark:text-white bg-white dark:bg-black border-4 border-[#4687ba] outline-none"
// rows="10"
style={{ resize: "none" }}
name="message"
@@ -451,7 +451,7 @@ function ActiveJobsMedia(props) {
autoFocus
/>
) : (
<div className="p-4 mb-2 h-[150px] text-base text-slate-600 border border-[#4687ba]">
<div className="p-4 mb-2 h-[150px] text-base text-slate-600 border-4 border-[#4687ba]">
<div className="files flex">
<label
htmlFor="file"
@@ -509,8 +509,8 @@ function ActiveJobsMedia(props) {
{/* End of error or success display */}
{/* Buttons Sections */}
<div className="py-1 sm:flex sm:justify-end sm:items-center">
<div className="w-full flex justify-center items-center gap-4">
<div className="py-1 grid grid-cols-1 xxs:grid-cols-3">
<div className="w-full col-span-3 col-start-1 xxs:col-span-2 xxs:col-start-2 flex justify-between items-center gap-4">
<button
type="button"
onClick={handleClearAll}
@@ -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="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">
<button onClick={popUpHandler} type="button" className="btn-gradient text-white p-1 lg:p-2 border-4 border-slate-300 text-lg lg:text-xl font-medium rounded-2xl">
I have completed this task
</button>
</div>
@@ -588,26 +588,28 @@ function AddFundDollars(props) {
</div>
</div>
<div className="modal-footer-wrapper flex justify-end items-center gap-2">
<button
className="custom-btn bg-[#f5a430] text-black text-base"
onClick={handleClose}
>
Cancel
</button>
<button
type="submit"
className="custom-btn btn-gradient text-base text-white"
>
{loadingState ? (
<LoadingSpinner size="6" color="sky-blue" />
) : (
<>
<span className="text-white">Continue</span>{" "}
<Icons name="chevron-right" />
</>
)}
</button>
<div className="modal-footer-wrapper grid grid-cols-1 xxs:grid-cols-3">
<div className="w-full col-span-1 xxs:col-span-2 xxs:col-start-2 flex justify-between items-center">
<button
className="custom-btn bg-[#f5a430] text-black text-base"
onClick={handleClose}
>
Cancel
</button>
<button
type="submit"
className="custom-btn btn-gradient text-base text-white"
>
{loadingState ? (
<LoadingSpinner size="6" color="sky-blue" />
) : (
<>
<span className="text-white">Continue</span>{" "}
<Icons name="chevron-right" />
</>
)}
</button>
</div>
</div>
</Form>
);
@@ -620,25 +622,27 @@ function AddFundDollars(props) {
</div>
{selectedOption == "previous" && (
<div className="modal-footer-wrapper flex justify-end items-center gap-2">
<button
className="custom-btn bg-[#f5a430] text-black text-base"
onClick={props.onClose}
>
Cancel
</button>
<button
onClick={handleSubmit}
name="previous"
type="button"
className="custom-btn btn-gradient text-base text-white"
>
{loadingState ? (
<LoadingSpinner size="6" color="sky-blue" />
) : (
<span className="text-white">Continue</span>
)}
</button>
<div className="modal-footer-wrapper grid grid-cols-1 xxs:grid-cols-3">
<div className="w-full col-span-1 xxs:col-span-2 xxs:col-start-2 flex justify-between items-center">
<button
className="custom-btn bg-[#f5a430] text-black text-base"
onClick={props.onClose}
>
Cancel
</button>
<button
onClick={handleSubmit}
name="previous"
type="button"
className="custom-btn btn-gradient text-base text-white"
>
{loadingState ? (
<LoadingSpinner size="6" color="sky-blue" />
) : (
<span className="text-white">Continue</span>
)}
</button>
</div>
</div>
)}
</>
+23 -21
View File
@@ -171,27 +171,29 @@ function AddFundPop({
{countryWallet == "NG" && <div className="h-[19rem]"></div>}
{countryWallet == "NG" && (
<div className="modal-footer-wrapper flex justify-end items-center py-4 gap-4">
<button
className="custom-btn bg-[#f5a430] text-black text-base"
onClick={onClose}
>
Cancel
</button>
<button
onClick={handleSubmit}
type="button"
className="custom-btn btn-gradient text-base text-white"
>
{__awaitComponent.loader ? (
<LoadingSpinner size="6" color="sky-blue" />
) : (
<>
<span className="text-white">Continue</span>{" "}
<Icons name="chevron-right" />
</>
)}
</button>
<div className="modal-footer-wrapper grid grid-cols-1 xxs:grid-cols-3">
<div className="w-full col-span-1 xxs:col-span-2 xxs:col-start-2 flex justify-between items-center">
<button
className="custom-btn bg-[#f5a430] text-black text-base"
onClick={onClose}
>
Cancel
</button>
<button
onClick={handleSubmit}
type="button"
className="custom-btn btn-gradient text-base text-white"
>
{__awaitComponent.loader ? (
<LoadingSpinner size="6" color="sky-blue" />
) : (
<>
<span className="text-white">Continue</span>{" "}
<Icons name="chevron-right" />
</>
)}
</button>
</div>
</div>
)}
</div>
@@ -424,35 +424,37 @@ function ConfirmAddFund({
</div>
</div>
<div className="modal-footer-wrapper flex justify-end items-center gap-4">
<button
className="custom-btn bg-[#f5a430] text-black text-base"
onClick={getBack}
>
Back
</button>
{__confirmCountry === "US" && (
<div className="modal-footer-wrapper grid grid-cols-1 xxs:grid-cols-3">
<div className="w-full col-span-1 xxs:col-span-2 xxs:col-start-2 flex justify-between items-center">
<button
className="custom-btn btn-gradient text-white text-base"
onClick={
__confirmData?.cardType === "prev"
? handlePrevCard
: handleNewCard
}
className="custom-btn bg-[#f5a430] text-black text-base"
onClick={getBack}
>
{confirmCredit?.show?.acceptConfirm?.loader ? (
<LoadingSpinner size="6" color="sky-blue" />
) : (
"Proceed"
)}
Back
</button>
)}
{__confirmCountry === "NG" && (
<FlutterWaveButton
{...fwConfig}
className="px-2 py-1 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
/>
)}
{__confirmCountry === "US" && (
<button
className="custom-btn btn-gradient text-white text-base"
onClick={
__confirmData?.cardType === "prev"
? handlePrevCard
: handleNewCard
}
>
{confirmCredit?.show?.acceptConfirm?.loader ? (
<LoadingSpinner size="6" color="sky-blue" />
) : (
"Proceed"
)}
</button>
)}
{__confirmCountry === "NG" && (
<FlutterWaveButton
{...fwConfig}
className="px-2 py-1 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
/>
)}
</div>
</div>
</>
);
@@ -387,37 +387,39 @@ function ConfirmNairaWithdraw({
>
{requestStatus.message && requestStatus.message}
</p>
<div className="modal-footer-wrapper flex justify-end items-center gap-2">
{!completeNairaWithdraw.show && (
<button
type="button"
onClick={action}
className="custom-btn bg-[#f5a430] text-black text-base"
>
Cancel
</button>
)}
<button
onClick={
completeNairaWithdraw.show
? action
: completeNairaWithdraw?.state?.internal_return < 0
? action
: handleSubmit
}
className="custom-btn btn-gradient text-base text-white"
>
{requestStatus.loading ? (
<LoadingSpinner size="6" color="sky-blue" />
) : completeNairaWithdraw.show ? (
"Okay"
) : completeNairaWithdraw?.state?.internal_return < 0 ? (
"Cancel"
) : (
"Transfer"
<div className="modal-footer-wrapper grid grid-cols-1 xxs:grid-cols-3">
<div className="w-full col-span-1 xxs:col-span-2 xxs:col-start-2 flex justify-between items-center">
{!completeNairaWithdraw.show && (
<button
type="button"
onClick={action}
className="custom-btn bg-[#f5a430] text-black text-base"
>
Cancel
</button>
)}
</button>
<button
onClick={
completeNairaWithdraw.show
? action
: completeNairaWithdraw?.state?.internal_return < 0
? action
: handleSubmit
}
className="custom-btn btn-gradient text-base text-white"
>
{requestStatus.loading ? (
<LoadingSpinner size="6" color="sky-blue" />
) : completeNairaWithdraw.show ? (
"Okay"
) : completeNairaWithdraw?.state?.internal_return < 0 ? (
"Cancel"
) : (
"Transfer"
)}
</button>
</div>
</div>
</>
)}
+25 -23
View File
@@ -794,30 +794,32 @@ function NairaWithdraw({
</div>
<div className="modal-footer-wrapper flex justify-end items-center gap-2 py-4">
<button
type="button"
onClick={action}
className="custom-btn bg-[#f5a430] text-black text-base"
>
Cancel
</button>
<div className="modal-footer-wrapper grid grid-cols-1 xxs:grid-cols-3">
<div className="w-full col-span-1 xxs:col-span-2 xxs:col-start-2 flex justify-between items-center">
<button
type="button"
onClick={action}
className="custom-btn bg-[#f5a430] text-black text-base"
>
Cancel
</button>
<button
type="submit"
disabled={
props.isSubmitting || sendMoneyFee.loading
? true
: false
}
className="custom-btn btn-gradient text-base text-white"
>
{requestStatus ? (
<LoadingSpinner size="6" color="sky-blue" />
) : (
"Continue"
)}
</button>
<button
type="submit"
disabled={
props.isSubmitting || sendMoneyFee.loading
? true
: false
}
className="custom-btn btn-gradient text-base text-white"
>
{requestStatus ? (
<LoadingSpinner size="6" color="sky-blue" />
) : (
"Continue"
)}
</button>
</div>
</div>
</Form>
)
+6 -6
View File
@@ -110,7 +110,7 @@ export default function MediaHeader({ logoutModalHandler, sidebarHandler, backpa
<>
<div className="header-wrapper backdrop-blur-sm bg-[#efedfe5e]/60 dark:bg-transparent w-full h-full flex items-center xl:px-0 md:px-10 px-5">
<div className="flex justify-between items-center w-full">
<button
{/* <button
className="xl:hidden block mr-10"
type="button"
onClick={sidebarHandler}
@@ -157,12 +157,12 @@ export default function MediaHeader({ logoutModalHandler, sidebarHandler, backpa
</linearGradient>
</defs>
</svg>
</button>
</button> */}
<div className="search-bar xl:hidden justify-center items-center w-[376px]">
{/* Home */}
{/* Home */}
{/* <div className="search-bar xl:hidden justify-center items-center w-[376px]">
<HomeButton />
</div>
</div> */}
{/* Back BTN AND TITLE */}
<div className="pl-4 w-full flex justify-start gap-3 items-center">
@@ -199,7 +199,7 @@ export default function MediaHeader({ logoutModalHandler, sidebarHandler, backpa
)}
</div>
<h1 className="text-base md:text-[20px] font-bold text-dark-gray dark:text-white tracking-wide">
<h1 className="text-base md:text-[20px] font-bold text-dark-gray dark:text-white tracking-wide line-clamp-1">
{title && title}
</h1>
</div>