reduced family banner button

.env.production

@@ -79,7 +79,7 @@ REACT_APP_ANDROID_APP='https://play.google.com/store/apps/details?id=com.wrenchb
 REACT_APP_APPLE_APP='https://itunes.apple.com/us/app/wrenchboard/id1435718367?ls=1&mt=8'
 
 # Displays the new family dashboard with boxes
-REACT_APP_SHOW_NEW_FAMILY_DASH=0
+REACT_APP_SHOW_NEW_FAMILY_DASH=1
 
 # Displays the account dashboard
-REACT_APP_SHOW_ACCOUNT_DASH=0
+REACT_APP_SHOW_ACCOUNT_DASH=1

src/components/Dashboards/AccountDashboard.jsx

@@ -85,7 +85,7 @@ const TopBanner = ({ image, title = "", desc = "", btn, link_path, key }) => {
           </Link>
         </div>
         <div className="flex justify-between w-full px-2 items-center">
-          <Link to={link_path} className="text-slate-300 font-semibold">
+          <Link to={link_path} className="text-slate-300 font-semibold text-sm">
             {btn}
           </Link>
           <button className="flex items-center justify-center gap-2">
@@ -125,7 +125,7 @@ const LowerBanner = ({ image, title = "", desc = "", btn, link_path, key }) => {
         </Link>
       </div>
       <div className="flex justify-between w-full px-2 items-center">
-        <Link to={link_path} className="text-slate-300 font-semibold">
+        <Link to={link_path} className="text-slate-300 font-semibold text-sm">
           {btn}
         </Link>
         <button className="flex items-center justify-center gap-2">

src/components/Dashboards/FamilyParentDashboard.jsx

@@ -16,7 +16,7 @@ export default function JobOwnerDashboard({
 
   return (
     <div
-      className={`w-full min-h-[100px] flex lg:p-8 p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
+      className={`w-full h-[75px] flex p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
         className || ""
       }`}
       style={{
@@ -28,12 +28,12 @@ export default function JobOwnerDashboard({
       <div className="h-full flex w-full justify-between mb-5 lg:mb-0">
         {/* heading */}
         <div className="flex gap-8">
-          <h1 className="lg:text-2xl text-xl font-medium text-white tracking-wide">
+          <h1 className="text-base ng font-medium text-white tracking-wide">
             Welcome
           </h1>
           {/* user */}
           <div>
-            <p className="text-3xl tracking-wide font-bold antise text-white">
+            <p className="text-base tracking-wide font-bold antise text-white">
               {`${firstname} ${lastname}`}
             </p>
             <p className="text-sm tracking-wide text-white">@{userEmail}</p>
@@ -72,7 +72,7 @@ export default function JobOwnerDashboard({
               </div>
             </div>
           )}
-        <span className="text-[18px] font-thin tracking-wide text-white flex items-end">
+        <span className="text-base font-thin tracking-wide text-white flex items-end">
           Last Login : {loginDate}
         </span>
       </div>

src/components/Dashboards/HomeDashboard.jsx

@@ -16,7 +16,7 @@ export default function JobOwnerDashboard({
 
   return (
     <div
-      className={`w-full min-h-[100px] flex lg:p-8 p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
+      className={`w-full h-[75px] flex p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
         className || ""
       }`}
       style={{
@@ -28,12 +28,12 @@ export default function JobOwnerDashboard({
       <div className="h-full flex w-full justify-between mb-5 lg:mb-0">
         {/* heading */}
         <div className="flex gap-8">
-          <h1 className="lg:text-2xl text-xl font-medium text-white tracking-wide">
+          <h1 className="text-base ng font-medium text-white tracking-wide">
             Welcome
           </h1>
           {/* user */}
           <div>
-            <p className="text-3xl tracking-wide font-bold antise text-white">
+            <p className="text-base tracking-wide font-bold antise text-white">
               {`${firstname} ${lastname}`}
             </p>
             <p className="text-sm tracking-wide text-white">@{userEmail}</p>
@@ -72,7 +72,7 @@ export default function JobOwnerDashboard({
               </div>
             </div>
           )}
-        <span className="text-[18px] font-thin tracking-wide text-white flex items-end">
+        <span className="text-base font-thin tracking-wide text-white flex items-end">
           Last Login : {loginDate}
         </span>
       </div>

src/components/Dashboards/JobOwnerDashboard.jsx

@@ -16,7 +16,7 @@ export default function JobOwnerDashboard({
 
   return (
     <div
-      className={`w-full min-h-[100px] flex lg:p-8 p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
+      className={`w-full h-[75px] flex p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
         className || ""
       }`}
       style={{
@@ -28,12 +28,12 @@ export default function JobOwnerDashboard({
       <div className="h-full flex w-full justify-between mb-5 lg:mb-0">
         {/* heading */}
         <div className="flex gap-8">
-          <h1 className="lg:text-2xl text-xl font-medium text-white tracking-wide">
+          <h1 className="text-base font-medium text-white tracking-wide">
             Welcome
           </h1>
           {/* user */}
           <div>
-            <p className="text-3xl tracking-wide font-bold antise text-white">
+            <p className="text-base tracking-wide font-bold antise text-white">
               {`${firstname} ${lastname}`}
             </p>
             <p className="text-sm tracking-wide text-white">@{userEmail}</p>
@@ -72,11 +72,10 @@ export default function JobOwnerDashboard({
               </div>
             </div>
           )}
-        <span className="text-[18px] font-thin tracking-wide text-white flex items-end">
+        <span className="text-base font-thin tracking-wide text-white flex items-end">
           Last Login : {loginDate}
         </span>
       </div>
     </div>
   );
 }
-

src/components/Dashboards/WorkerDashboard.jsx

@@ -16,7 +16,7 @@ export default function JobOwnerDashboard({
 
   return (
     <div
-      className={`w-full min-h-[100px] flex lg:p-8 p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
+      className={`w-full h-[75px] flex p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
         className || ""
       }`}
       style={{
@@ -28,12 +28,12 @@ export default function JobOwnerDashboard({
       <div className="h-full flex w-full justify-between mb-5 lg:mb-0">
         {/* heading */}
         <div className="flex gap-8">
-          <h1 className="lg:text-2xl text-xl font-medium text-white tracking-wide">
+          <h1 className="text-base ng font-medium text-white tracking-wide">
             Welcome
           </h1>
           {/* user */}
           <div>
-            <p className="text-3xl tracking-wide font-bold antise text-white">
+            <p className="text-base tracking-wide font-bold antise text-white">
               {`${firstname} ${lastname}`}
             </p>
             <p className="text-sm tracking-wide text-white">@{userEmail}</p>
@@ -72,7 +72,7 @@ export default function JobOwnerDashboard({
               </div>
             </div>
           )}
-        <span className="text-[18px] font-thin tracking-wide text-white flex items-end">
+        <span className="text-base font-thin tracking-wide text-white flex items-end">
           Last Login : {loginDate}
         </span>
       </div>

src/components/Home/FamilyDash.jsx

@@ -87,21 +87,20 @@ export default function FamilyDash({ familyOffers, MyActiveJobList }) {
                   <Link key={item} to={`/${action}`} className={`rounded-xl bg-white dark:bg-dark-white shadow-md flex justify-center items-center transition-all duration-300 hover:shadow-sm`}>
                     <div className="h-full w-full">
                       <img className="w-full h-[12rem] object-cover object-left rounded-t-xl" src={content.banner.image} alt='banner image' />
-                      <div className="h-[7rem] flex flex-col justify-between">
+                      <div className="flex flex-col justify-between">
-                        <div className="px-2 py-1 border-b border-slate-300 h-[5.4rem] overflow-hidden flex flex-col gap-2">
+                        <div className="px-2 py-2 border-b border-transparent min-h-[5.4rem] flex flex-col gap-1">
                           <h1 className="text-lg text-[#083e21] dark:text-white font-bold tracking-wide">{content.banner.text}</h1>
                           <p className="text-sm text-black dark:text-white">{content.banner.description}</p>
                         </div>
 
-                        <div className="px-2 py-1 flex justify-between items-center">
+                        {/* <div className="px-2 py-1 flex justify-between items-center">
                           <span className="text-slate-400 dark:text-slate-200 text-sm">6w ago</span>
-                          {/* Dots */}
                           <div className="flex justify-center gap-1">
                             <div className="w-1 h-1 bg-slate-400 rounded-full"></div>
                             <div className="w-1 h-1 bg-slate-400 rounded-full"></div>
                             <div className="w-1 h-1 bg-slate-400 rounded-full"></div>
                           </div>
-                        </div>
+                        </div> */}
                       </div>
                     </div>
                   </Link>
@@ -120,21 +119,20 @@ export default function FamilyDash({ familyOffers, MyActiveJobList }) {
                   <Link key={item.uid} to={item?.action} className={`rounded-xl bg-white dark:bg-dark-white shadow-md flex justify-center items-center transition-all duration-300 hover:shadow-sm`}>
                     <div className="h-full w-full">
                       <img className="w-full h-[12rem] object-cover rounded-t-xl" src={item?.banner} alt='banner image' />
-                      <div className="h-[7rem] flex flex-col justify-between">
+                      <div className="flex flex-col justify-between">
-                        <div className="px-2 py-1 border-b border-slate-300 h-[5.4rem] overflow-hidden flex flex-col gap-2">
+                        <div className="px-2 py-2 border-b border-transparent min-h-[5.4rem] flex flex-col gap-1">
                           <h1 className="text-lg text-[#083e21] dark:text-white font-bold tracking-wide">{item?.content}</h1>
                           {/* <p className="text-sm text-black dark:text-white">{'Description'}</p> */}
                         </div>
 
-                        <div className="px-2 py-1 flex justify-between items-center">
+                        {/* <div className="px-2 py-1 flex justify-between items-center">
                           <span className="text-slate-400 dark:text-slate-200 text-sm">6w ago</span>
-                          {/* Dots */}
                           <div className="flex justify-center gap-1">
                             <div className="w-1 h-1 bg-slate-400 rounded-full"></div>
                             <div className="w-1 h-1 bg-slate-400 rounded-full"></div>
                             <div className="w-1 h-1 bg-slate-400 rounded-full"></div>
                           </div>
-                        </div>
+                        </div> */}
                       </div>
                     </div>
                   </Link>