added modal style to wallet modal

This commit was merged in pull request #688.
This commit is contained in:
victorAnumudu
2024-04-01 18:23:34 +01:00
parent bf19dfe86a
commit 3775c520ff
9 changed files with 667 additions and 662 deletions
@@ -259,7 +259,7 @@ function AddFundDollars(props) {
<div className="w-full">
{/* switch button */}
<div className="flex">
<form className="add-fund-info flex items-center gap-3">
<form className="add-fund-info flex items-center gap-3 md:px-8 md:pt-4 px-4 pt-2">
<h1 className="text-xl font-bold text-dark-gray dark:text-white tracking-tighter my-1">
{countryWallet == "US" && "Payment Method"}
</h1>
@@ -313,7 +313,7 @@ function AddFundDollars(props) {
{/* previous selectedOption */}
{selectedOption === "previous" && (
<div className="p-4 previous-details w-full min-h-[16.5rem] flex flex-col">
<div className="px-8 py-4 previous-details w-full h-[300px] flex flex-col">
{payListCards.loading ? (
<LoadingSpinner size="10" color="sky-blue" />
) : payListCards?.data?.length ? (
@@ -367,7 +367,7 @@ function AddFundDollars(props) {
)}
{selectedOption === "new" && (
<div className="new-details w-full max-h-[22rem]">
<div className="new-details w-full">
{payListCards.loading ? (
<div className="pt-10 flex w-full h-full justify-center items-center">
<LoadingSpinner size="10" color="sky-blue" />
@@ -381,8 +381,8 @@ function AddFundDollars(props) {
>
{(props) => {
return (
<Form className="md:pl-8">
<div className="flex flex-col-reverse sm:flex-row">
<Form className="w-full">
<div className="flex flex-col-reverse sm:flex-row md:px-8 md:pt-4 px-4 pt-2">
<div className="flex-1 sm:mr-10">
<div className="fields w-full">
{/* Inputs */}
@@ -588,16 +588,16 @@ function AddFundDollars(props) {
</div>
</div>
<div className="add-fund-btn flex justify-end items-center gap-2 mt-4">
<div className="modal-footer-wrapper flex justify-end items-center gap-2">
<button
className="px-4 py-1 h-11 max-w-[100px] w-full flex justify-center bg-[#f5a430] text-black items-center text-base rounded-full"
className="custom-btn bg-[#f5a430] text-black text-base"
onClick={handleClose}
>
Cancel
</button>
<button
type="submit"
className="px-4 py-1 h-11 max-w-[115px] w-full flex justify-center items-center btn-gradient text-base rounded-full text-white"
className="custom-btn btn-gradient text-base text-white"
>
{loadingState ? (
<LoadingSpinner size="6" color="sky-blue" />
@@ -620,9 +620,9 @@ function AddFundDollars(props) {
</div>
{selectedOption == "previous" && (
<div className="md:py-8 add-fund-btn flex justify-end items-center gap-2 py-4">
<div className="modal-footer-wrapper flex justify-end items-center gap-2">
<button
className="px-4 py-1 h-11 max-w-[100px] w-full flex justify-center bg-[#f5a430] text-black items-center text-base rounded-full"
className="custom-btn bg-[#f5a430] text-black text-base"
onClick={props.onClose}
>
Cancel
@@ -631,7 +631,7 @@ function AddFundDollars(props) {
onClick={handleSubmit}
name="previous"
type="button"
className="px-4 py-1 h-11 max-w-[115px] w-full flex justify-center items-center btn-gradient text-base rounded-full text-white"
className="custom-btn btn-gradient text-base text-white"
>
{loadingState ? (
<LoadingSpinner size="6" color="sky-blue" />