auth fonts adjusted

src/components/AuthPages/AuthLayout2.jsx

@@ -14,7 +14,7 @@ export default function LoginLayout({ slogan, children }) {
 
   return (
     <div
-      className={`min-h-screen overflow-y-auto bg-cover bg-center flex flex-col justify-between items-center`}
+      className={`relative min-h-screen overflow-y-auto bg-cover bg-center flex flex-col items-center`}
       style={{
         backgroundImage: `url(${countryMode == "NG" ? bgImgNig : bgImgCom})`,
       }}
@@ -28,59 +28,60 @@ export default function LoginLayout({ slogan, children }) {
               />
             </Link>
           </div>
-      <div className={`h-full w-full grid grid-cols-1 place-content-center`}>
+      <div className={`h-full w-full mb-5 grid grid-cols-1 place-content-center`}>
         {/* <div 
             className={`auth-bg hidden xl:block bg-blue-50 relative bg-cover bg-no-repeat border-0 after:content-[''] after:absolute after:inset-0`} 
             style={{backgroundImage: `url(${bgImg})`}}
         >
         </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>
           </div>
         </div>
       </div>
-
+      <div className='absolute left-0 right-0 bottom-0'>
-      <div className='w-full shadow-md bg-slate-50 dark:bg-dark-white'>
+        <div className='w-full shadow-md bg-slate-50 dark:bg-dark-white'>
-        <div className="w-full flex flex-col md:flex-row justify-center items-center px-10 py-2">
+          <div className="w-full flex flex-col md:flex-row justify-center items-center px-10 py-2">
-          <div className="flex justify-center items-center">
+            <div className="flex justify-center items-center">
-            <div className="flex items-center">
+              <div className="flex items-center">
-              <a
+                <a
-                href="https://www.wrenchboard.com/about-us"
+                  href="https://www.wrenchboard.com/about-us"
-                className="text-[#a1a5b7] text-[15px] px-2 font-medium hover:text-[#009ef7]"
+                  className="text-[#a1a5b7] text-[15px] px-2 font-medium hover:text-[#009ef7]"
-                target="_blank"
+                  target="_blank"
-                rel="noreferrer"
+                  rel="noreferrer"
-              >
+                >
-                About
+                  About
-              </a>
+                </a>
-              <a
+                <a
-                href="https://www.wrenchboard.com/service"
+                  href="https://www.wrenchboard.com/service"
-                className="text-[#a1a5b7] text-[15px] px-2 font-medium hover:text-[#009ef7]"
+                  className="text-[#a1a5b7] text-[15px] px-2 font-medium hover:text-[#009ef7]"
-                target="_blank"
+                  target="_blank"
-                rel="noreferrer"
+                  rel="noreferrer"
-              >
+                >
-                Services
+                  Services
-              </a>
+                </a>
-              <a
+                <a
-                href="https://www.wrenchboard.com/contact"
+                  href="https://www.wrenchboard.com/contact"
-                className="text-[#a1a5b7] text-[15px] px-2 font-medium hover:text-[#009ef7]"
+                  className="text-[#a1a5b7] text-[15px] px-2 font-medium hover:text-[#009ef7]"
-                target="_blank"
+                  target="_blank"
-                rel="noreferrer"
+                  rel="noreferrer"
-              >
+                >
-                Contact Us
+                  Contact Us
-              </a>
+                </a>
+              </div>
             </div>
+            <p className="text-black text-[15px] px-2 font-medium flex items-center gap-1">
+              <span className="dark:text-white">
+                &copy; {new Date().getFullYear()} -
+              </span>
+              <Link to="/" className="text-[#009ef7] ml-1">
+                WrenchBoard
+              </Link>{" "}
+            </p>
           </div>
-          <p className="text-black text-[15px] px-2 font-medium flex items-center gap-1">
-            <span className="dark:text-white">
-              &copy; {new Date().getFullYear()} -
-            </span>
-            <Link to="/" className="text-[#009ef7] ml-1">
-              WrenchBoard
-            </Link>{" "}
-          </p>
         </div>
       </div>
 

src/components/AuthPages/Login/LoginLanding.jsx

@@ -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="col-span-1 order-2 sm:col-span-2 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="relative w-full h-full flex sm:flex-col justify-center gap-4">
-                    <div className="w-28 lg:w-32">
+                    <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,11 +64,12 @@ 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">
+                <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-[#181c32] font-medium dark:text-white leading-6 text-2xl tracking-wide">
+                  <h1 className="text-gray-400 font-medium text-[16.25px] leading-[24.375px]">
-                    <span className='font-semibold'>Log in</span> as a:
+                    <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'>
@@ -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>

src/components/AuthPages/Login/index2.jsx

@@ -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

src/components/AuthPages/SignUp/index2.jsx

@@ -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>

src/components/MyWallet/FamilyWalletBox.jsx

@@ -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">