WrenchBoard/Users-Wrench
3
0
Fork 0
Code Issues Pull Requests Releases Activity

referral layout and style fixed #176

Merged
ameye merged 1 commits from refferal-style into master 2023-06-15 20:37:21 +00:00
Conversation 0 Commits 1 Files Changed 3
+43 -42
3 changed files with 43 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Helpers/Inputs/InputCom/index.jsx
+2 -2
View File
@@ -68,13 +68,13 @@ export default function InputCom({
)}
</div>
<div
className={`input-wrapper border border-[#f5f8fa] dark:border-[#5e6278] w-full rounded-[0.475rem] h-[42px] overflow-hidden relative font-medium leading-6 bg-clip-padding text-[#5e6278] dark:text-gray-100 bg-[#f5f8fa] dark:bg-[#5e6278] text-base ${inputClass}`}
className={`input-wrapper border border-[#f5f8fa] dark:border-[#5e6278] w-full rounded-full h-[42px] overflow-hidden relative font-medium leading-6 bg-clip-padding text-[#5e6278] dark:text-gray-100 bg-[#f5f8fa] dark:bg-[#5e6278] text-base ${inputClass}`}
>
<input
placeholder={placeholder}
value={value}
onChange={inputHandler}
className={`input-field placeholder:text-base text-dark-gray w-full h-full ${
className={`input-field placeholder:text-base text-dark-gray w-full h-full tracking-wide ${
inputBg ? inputBg : "bg-[#FAFAFA]"
} dark:bg-[#11131F] focus:ring-0 focus:outline-none ${fieldClass}`}
type={type}
src/components/MyWallet/WalletComponent/ReferralTable.jsx
+1 -1
View File
@@ -15,7 +15,7 @@ function ReferralTable({history}) {
}
return (
<div className='flex flex-col justify-between h-full'>
<div className='flex flex-col justify-between min-h-[420px] overflow-x-auto'>
<table className="referral-list w-full table-auto border-collapse text-left">
<thead className='border-b-2'>
<tr className='text-slate-600'>
src/components/Referral/ReferralDisplay.jsx
+40 -39
View File
@@ -130,7 +130,7 @@ function ReferralDisplay() {
</div>
<div className="referral w-full md:p-8 p-4 bg-white dark:bg-dark-white rounded-2xl shadow">
<h2 className="text-slate-900 dark:text-white text-xl lg:text-2xl font-medium">
<h2 className="mb-4 text-slate-900 dark:text-white text-xl lg:text-2xl font-medium">
Send Referral
</h2>
<Formik
@@ -140,42 +140,44 @@ function ReferralDisplay() {
>
{(props) => (
<Form className="referral-info">
{/* Firstname */}
<div className="field w-full mb-6">
<InputCom
fieldClass="px-6"
label="Firstname"
type="text"
name="firstname"
placeholder="Firstname"
value={props.values.firstname}
inputHandler={props.handleChange}
blurHandler={props.handleBlur}
/>
{props.errors.firstname && props.touched.firstname && (
<p className="text-sm text-red-500">
{props.errors.firstname}
</p>
)}
</div>
<div className="block md:mb-6 md:flex gap-10">
{/* Firstname */}
<div className="field w-full mb-6 md:mb-0">
<InputCom
fieldClass="px-6"
label="Firstname"
type="text"
name="firstname"
placeholder="Firstname"
value={props.values.firstname}
inputHandler={props.handleChange}
blurHandler={props.handleBlur}
/>
{props.errors.firstname && props.touched.firstname && (
<p className="text-sm text-red-500">
{props.errors.firstname}
</p>
)}
</div>
{/* Lastname */}
<div className="field w-full mb-6">
<InputCom
fieldClass="px-6"
label="Lastname"
type="text"
name="lastname"
placeholder="Lastname"
value={props.values.lastname}
inputHandler={props.handleChange}
blurHandler={props.handleBlur}
/>
{props.errors.lastname && props.touched.lastname && (
<p className="text-sm text-red-500">
{props.errors.lastname}
</p>
)}
{/* Lastname */}
<div className="field w-full mb-6 md:mb-0">
<InputCom
fieldClass="px-6"
label="Lastname"
type="text"
name="lastname"
placeholder="Lastname"
value={props.values.lastname}
inputHandler={props.handleChange}
blurHandler={props.handleBlur}
/>
{props.errors.lastname && props.touched.lastname && (
<p className="text-sm text-red-500">
{props.errors.lastname}
</p>
)}
</div>
</div>
<div className="field w-full mb-6">
@@ -204,8 +206,7 @@ function ReferralDisplay() {
) : (
<button
type="submit"
className="text-lg text-white bg-sky-blue p-2 hover:opacity-90 rounded-md"
>
className="px-2 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white" >
Send Message
</button>
)}
@@ -215,7 +216,7 @@ function ReferralDisplay() {
</Formik>
</div>
<div className="w-full md:p-8 p-4 h-full max-h-[700px] bg-white dark:bg-dark-white overflow-y-auto rounded-2xl shadow">
<div className="w-full md:p-8 p-4 bg-white dark:bg-dark-white rounded-2xl shadow">
<h2 className="mb-2 text-slate-900 dark:text-white text-xl lg:text-2xl font-medium">
Referral List
</h2>