Compare commits
4 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 victorAnumudu
|
d65522ee64 | ||
 ameye
|
f8f5fbc3af | ||
|
victorAnumudu
|
ae494b3e48 | ||
|
ameye
|
d2de4e8d56 |
@@ -35,7 +35,7 @@ export default function LoginLayout({ slogan, children }) {
|
||||
>
|
||||
</div> */}
|
||||
<div className="p-5 sm:p-7 flex place-content-center">
|
||||
<div className="pt-8 pb-5 w-full sm:w-11/12 max-w-[550px] shadow-md bg-slate-50 dark:bg-dark-white rounded-[0.475rem]">
|
||||
<div className="pt-5 pb-5 w-full sm:w-11/12 max-w-[550px] shadow-md bg-slate-50 dark:bg-dark-white rounded-[0.475rem]">
|
||||
<div className="w-full flex justify-center items-center">
|
||||
{children && children}
|
||||
</div>
|
||||
|
||||
@@ -42,11 +42,11 @@ export default function LoginLanding() {
|
||||
{/* <div className="content-wrapper login shadow-md w-10/12 mx-auto flex justify-center items-center xl:bg-white dark:bg-dark-white 2xl:w-[828px] rounded-[0.475rem] sm:p-7 p-5"> */}
|
||||
<div className="flex place-content-center">
|
||||
<div className="w-10/12">
|
||||
<div className='grid grid-cols-1 sm:grid-cols-3 gap-3'>
|
||||
<div className='grid grid-cols-1 sm:grid-cols-5 gap-3'>
|
||||
{/* APP DOWNLOAD STORE */}
|
||||
<div className="col-span-1 order-2 sm:col-span-1 sm:order-1 w-full">
|
||||
<div className="sm:border-r-2 border-slate-400 w-full h-full flex sm:flex-col justify-center gap-4">
|
||||
<div className="w-28 lg:w-32">
|
||||
<div className="col-span-1 order-2 sm:col-span-2 sm:order-1 w-full">
|
||||
<div className="relative w-full h-full flex sm:flex-col justify-center gap-4">
|
||||
<div className="w-28 sm:w-36">
|
||||
<a
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
@@ -55,7 +55,7 @@ export default function LoginLanding() {
|
||||
<img src={IOSDownload} className='w-full h-auto' alt='IOS Download' />
|
||||
</a>
|
||||
</div>
|
||||
<div className="w-28 lg:w-32">
|
||||
<div className="w-28 sm:w-36">
|
||||
<a
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
@@ -64,15 +64,16 @@ export default function LoginLanding() {
|
||||
<img src={GoogleDownload} className='w-full h-auto' alt='IOS Download' />
|
||||
</a>
|
||||
</div>
|
||||
<div className='hidden sm:block absolute top-0 bottom-0 right-0 w-1 rounded-full bg-[linear-gradient(180deg,_#94a3b8,_#0f172a,_#94a3b8)]'></div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-span-1 order-1 sm:col-span-2 sm:order-2 title-area flex flex-col gap-5 justify-center items-center relative text-center mb-5">
|
||||
<h1 className="text-[#181c32] font-medium dark:text-white leading-6 text-2xl tracking-wide">
|
||||
<span className='font-semibold'>Log in</span> as a:
|
||||
<div className="col-span-1 order-1 sm:col-span-3 sm:order-2 title-area flex flex-col gap-5 justify-center items-center relative text-center mb-5">
|
||||
<h1 className="text-gray-400 font-medium text-[16.25px] leading-[24.375px]">
|
||||
<span className='font-semibold text-[#4687ba] hover:text-[#009ef7] transition'>Log in</span> as a:
|
||||
</h1>
|
||||
|
||||
<div className='w-full flex flex-col gap-4'>
|
||||
<button name='full' onClick={()=>navigate('/login/parent', {state:{loginType:'full'}})} className='w-full mx-auto flex justify-between items-center p-4 md:p-8 rounded-lg bg-[#e0f7eb] text-emerald-800 cursor-pointer'>
|
||||
<button name='full' onClick={()=>navigate('/login/parent', {state:{loginType:'full'}})} className='w-full mx-auto flex justify-between items-center p-4 md:p-8 rounded-lg bg-[#d5ebf8] text-[#009ef7] cursor-pointer'>
|
||||
<div className='flex items-center gap-4'>
|
||||
<img className='w-12 h-auto' src={ParentIcon} alt='login key' />
|
||||
<p className='text-lg font-semibold'>Adult or Parent</p>
|
||||
@@ -91,11 +92,11 @@ export default function LoginLanding() {
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="text-gray-400 font-medium text-xl leading-[24.375px]">
|
||||
<div className="text-gray-400 font-medium text-[16.25px] leading-[24.375px]">
|
||||
Don't have an account?{" "}
|
||||
<Link
|
||||
to="/signup"
|
||||
className="font-semibold text-emerald-800 hover:text-emerald-600 transition"
|
||||
className="font-semibold text-[#4687ba] hover:text-[#009ef7] transition"
|
||||
>
|
||||
Sign Up
|
||||
</Link>
|
||||
|
||||
@@ -327,6 +327,7 @@ export default function Login() {
|
||||
{/* END of switch login component */}
|
||||
|
||||
{/* for login component */}
|
||||
<h1 className='pb-2 text-center font-medium text-2xl leading-[24.375px]'>{loginType == 'full' ? 'Login' : 'Kids and Teens'}</h1>
|
||||
{
|
||||
loginType == "full" ? (
|
||||
//user login component
|
||||
|
||||
@@ -271,12 +271,12 @@ export default function SignUp() {
|
||||
</button>
|
||||
<span
|
||||
onClick={rememberMe}
|
||||
className="cursor-default text-dark-gray dark:text-white text-[15px] group-checked:text-white transition-all duration-200 group-checked:cursor-default"
|
||||
className="cursor-default text-gray-400 font-medium text-[16.25px] leading-[24.375px] group-checked:text-white transition-all duration-200 group-checked:cursor-default"
|
||||
>
|
||||
I agree with all
|
||||
<Link
|
||||
href="#"
|
||||
className="text-base text-[#4687ba] hover:text-[#009ef7] mx-1 inline-block"
|
||||
className="font-semibold text-[#4687ba] hover:text-[#009ef7] transition mx-1 inline-block"
|
||||
>
|
||||
terms and condition
|
||||
</Link>
|
||||
|
||||
@@ -51,7 +51,7 @@ export default function FamilyWalletBox({ wallet, payment }) {
|
||||
height="min-h-[240px]"
|
||||
/>
|
||||
</div>
|
||||
) : wallet?.data.length > 0 ? (
|
||||
) : wallet?.data?.length > 0 ? (
|
||||
<>
|
||||
{wallet?.data?.length > 1 && (
|
||||
<div className="wal-selection px-5 py-2 text-black dark:text-white flex items-center gap-2">
|
||||
@@ -87,6 +87,11 @@ export default function FamilyWalletBox({ wallet, payment }) {
|
||||
<p className="text-base sm:text-lg text-white tracking-wide my-3 text-center">
|
||||
Current Balance
|
||||
</p>
|
||||
{selectedWallet?.brand && selectedWallet?.card_last4 ? // FOR VIRTUAL CARD NUMBER ELSE WALLET BALANCE DISPLAY
|
||||
<p className="text-2xl font-bold text-white dark:text-white leading-10">
|
||||
{selectedWallet.brand} <span> **** **** ***** </span> {selectedWallet?.card_last4}
|
||||
</p>
|
||||
:
|
||||
<p className="text-[44px] lg:text-[62px] font-bold text-white tracking-wide leading-10">
|
||||
{PriceFormatter(
|
||||
selectedWallet?.amount / 100,
|
||||
@@ -95,6 +100,7 @@ export default function FamilyWalletBox({ wallet, payment }) {
|
||||
"text-[2rem]"
|
||||
)}
|
||||
</p>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
|
||||
Reference in New Issue
Block a user