Compare commits

...

1 Commits

Author SHA1 Message Date
victorAnumudu a30bd2d72c return to wallet added and add fund style fixed 2023-06-17 22:56:24 +01:00
2 changed files with 40 additions and 15 deletions
+38 -13
View File
@@ -2,6 +2,7 @@ import React, {useState} from 'react'
import RecentActivityTable from './WalletComponent/RecentActivityTable' import RecentActivityTable from './WalletComponent/RecentActivityTable'
import LoadingSpinner from '../Spinners/LoadingSpinner' import LoadingSpinner from '../Spinners/LoadingSpinner'
import { useNavigate } from 'react-router-dom' import { useNavigate } from 'react-router-dom'
import InputCom from '../Helpers/Inputs/InputCom'
function AddFund({payment}) { function AddFund({payment}) {
@@ -39,7 +40,24 @@ function AddFund({payment}) {
<div> <div>
{/* heading */} {/* heading */}
<div className="sm:flex justify-between items-center mb-6"> <div className="sm:flex justify-between items-center mb-6">
<div className="mb-5 sm:mb-0"> <div className="w-full flex justify-start space-x-3 items-center">
<button
type="button"
className="min-w-[45px] h-auto text-[#374557] border border-sky-blue p-1 rounded-full"
onClick={() =>
navigate('/my-wallet', { replace: true })
}
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="35"
height="35"
viewBox="0 0 24 24"
fill="skyblue"
>
<path d="M19 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H19v-2z" />
</svg>
</button>
<h1 className="text-26 font-bold inline-flex gap-3 text-dark-gray dark:text-white items-center"> <h1 className="text-26 font-bold inline-flex gap-3 text-dark-gray dark:text-white items-center">
Add Credit Add Credit
</h1> </h1>
@@ -58,22 +76,29 @@ function AddFund({payment}) {
{/*<h2 className='md:p-8 p-4 text-slate-900 dark:text-white text-xl lg:text-2xl font-medium'>Add Credit with Account Deposit</h2>*/} {/*<h2 className='md:p-8 p-4 text-slate-900 dark:text-white text-xl lg:text-2xl font-medium'>Add Credit with Account Deposit</h2>*/}
{/*<hr />*/} {/*<hr />*/}
<form className='md:p-8 p-4 add-fund-info'> <form className='md:p-8 p-4 add-fund-info'>
<div className='md:flex items-center'> <div className="field w-full mb-6">
<label className='w-full md:w-2/4 text-slate-600 text-lg'>Amount(Naira) <span className='text-red-500'>*</span></label> <InputCom
<input className='w-full md:w-2/4 p-3 text-lg text-right bg-slate-100 rounded-md outline-0 placeholder:text-slate-500 placeholder:text-lg' fieldClass="px-6"
value={input} label="Amount(Naira)"
name='amount' type="text"
type="text" name="amount"
placeholder='Amount' placeholder="Amount"
required value={input}
onChange={handleChange} inputHandler={handleChange}
// blurHandler={props.handleBlur}
/> />
{inputError && <p className='text-base text-red-500'>{inputError}</p>}
</div> </div>
{inputError && <p className='text-base text-red-500'>{inputError}</p>}
</form> </form>
<hr /> <hr />
<div className='md:p-8 p-4 add-fund-btn flex justify-end items-center py-4'> <div className='md:p-8 p-4 add-fund-btn flex justify-end items-center py-4'>
<button onClick={handleSubmit} className='text-lg text-white bg-sky-blue px-4 py-2 hover:opacity-90 rounded-md'>Continue</button> <button
onClick={handleSubmit}
type="button"
className="px-2 py-1 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
>
<span className="text-white">Continue</span>
</button>
</div> </div>
</div> </div>
</div> </div>
@@ -81,7 +106,7 @@ function AddFund({payment}) {
<div className="content-wrapper w-full lg:flex xl:space-x-8 lg:space-x-4 bottomMargin"> <div className="content-wrapper w-full lg:flex xl:space-x-8 lg:space-x-4 bottomMargin">
<div className="lg:w-2/2 w-full mb-10 lg:mb-0"> <div className="lg:w-2/2 w-full mb-10 lg:mb-0">
<div className="wallet w-full md:p-8 p-4 h-full max-h-[590px] bg-white dark:bg-dark-white overflow-y-auto rounded-2xl shadow"> <div className="wallet w-full md:p-8 p-4 h-full min-h-[590px] bg-white dark:bg-dark-white rounded-2xl shadow">
<h2 className='text-gray-900 dark:text-white text-xl lg:text-2xl font-medium'>Recent Activity</h2> <h2 className='text-gray-900 dark:text-white text-xl lg:text-2xl font-medium'>Recent Activity</h2>
{/* <p className='text-base text-gray-600 dark:text-white'>Activity Report</p> */} {/* <p className='text-base text-gray-600 dark:text-white'>Activity Report</p> */}
{payment.loading ? {payment.loading ?
+2 -2
View File
@@ -129,7 +129,7 @@ function ConfirmAddFund({ payment }) {
<div className="md:p-8 p-4 add-fund-btn flex justify-end items-center py-4"> <div className="md:p-8 p-4 add-fund-btn flex justify-end items-center py-4">
<FlutterWaveButton <FlutterWaveButton
{...fwConfig} {...fwConfig}
className="text-lg text-white bg-sky-blue px-4 py-2 hover:opacity-90 rounded-md" className="px-2 py-1 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
/> />
</div> </div>
</div> </div>
@@ -137,7 +137,7 @@ function ConfirmAddFund({ payment }) {
)} )}
<div className="lg:w-1/2 w-full mb-10 lg:mb-0"> <div className="lg:w-1/2 w-full mb-10 lg:mb-0">
<div className="wallet w-full md:p-8 p-4 h-full max-h-[600px] bg-white dark:bg-dark-white overflow-y-auto rounded-2xl shadow"> <div className="wallet w-full md:p-8 p-4 h-full min-h-[600px] bg-white dark:bg-dark-white rounded-2xl shadow">
<h2 className="text-gray-900 dark:text-white text-xl lg:text-2xl font-medium"> <h2 className="text-gray-900 dark:text-white text-xl lg:text-2xl font-medium">
Recent Activity Recent Activity
</h2> </h2>