Merge branch 'dev' into fix/challenge-page-padding

Author: Odile078

public/locales/bg/common.json

@@ -383,5 +383,8 @@
   "kyc.default.button": "Start verification",
   "kyc.default.button.completed": "Go to profile",
   "kyc.payout.reason": "To cashout, you need to verify your identity first.",
-  "kyc.payout.button.completed": "Proceed to  cashout"
+  "kyc.payout.button.completed": "Proceed to  cashout",
+  "job.offers.title": "Работни оферти",
+  "job.offers.description": "Заинтересовани ли сте относно потенциални работни възможности? Попълнете този Google формуляр и ние ще се свържем с вас относно подходящите позиции.",
+  "job.offers.button.next": "Cледващ"
 }

public/locales/en/common.json

@@ -119,14 +119,14 @@
   "communities.overview.challenge.certificate": "Certificate",
   "communities.overview.challenge.subtitle": "Upon successful completion",
   "communities.overview.challenge.expiry": "Challenge expiry date:",
-  "communities.overview.challenge.take.challenge":"Take the challenge",
+  "communities.overview.challenge.take.challenge": "Take the challenge",
   "communities.overview.challenge.see.challenge": "See the challenge",
-  "communities.overview.challenge.for.certificate":"for the certificate",
-  "communities.overview.challenge.for.feedback":"for every feedback",
-  "communities.overview.challenge.unlock.certificate":"Unlock with Certificate",
-  "communities.overview.challenge.participate":"Participate in {{token}} hackathons",
+  "communities.overview.challenge.for.certificate": "for the certificate",
+  "communities.overview.challenge.for.feedback": "for every feedback",
+  "communities.overview.challenge.unlock.certificate": "Unlock with Certificate",
+  "communities.overview.challenge.participate": "Participate in {{token}} hackathons",
   "communities.overview.challenge.learning.modules.included": "Learning modules included",
-  "communities.overview.challenge.no.learning.modules":"No learning modules included",
+  "communities.overview.challenge.no.learning.modules": "No learning modules included",
   "communities.overview.challenge.learning.title": "The following learning materials will equip you with the technical expertise required to successfully address the challenge.",
   "communities.overview.challenge.learning.start": "Start now",
   "communities.overview.challenge.team.setup.title": "Form your team",
@@ -203,7 +203,7 @@
   "course.challenge.reward": "REWARD",
   "course.challenge.reward.description": "By completing the challenge in this course you can earn {{amount}} {{token}}",
   "course.challenge.reward.stable.description": "By completing the challenge in this course you can earn {{currency}}{{amount}} in {{token}}",
-  "course.challenge.reward.certificate.description":"Complete the course to achieve the certificate and unlock new opportunities",
+  "course.challenge.reward.certificate.description": "Complete the course to achieve the certificate and unlock new opportunities",
   "course.challenge.certificate": "CERTIFICATE",
   "course.challenge.certificate.description": "By completing the challenge in this course you can earn a certificate.",
   "course.scoreboard.button": "Load more",
@@ -222,8 +222,8 @@
   "testimonials.text": "Dacade is really encouraging, I didn't realize the little that I know would matter. Thank you for making us learn more and to make research too.",
   "footer.text": "Dacade is an open-sourced platform and is created in collaboration with multiple contributors. Go to the <a href=\"https://github.com/dacadeorg/dacade-frontend-app\"> repository  </a>  to start contributing.",
   "footer.privacy-policy": "Impressum & Privacy Policy",
-  "footer.open.source" : "Dacade is an open-sourced platform.",
-  "footer.open.source.contribute":"Become one of our contributors",
+  "footer.open.source": "Dacade is an open-sourced platform.",
+  "footer.open.source.contribute": "Become one of our contributors",
   "feedback.bounty": "Feedback bounty",
   "feedback.issued": "Issued",
   "feedback.ends": "ending in ",
@@ -441,5 +441,8 @@
   "kyc.default.button": "Start verification",
   "kyc.default.button.completed": "Go to profile",
   "kyc.payout.reason": "To cashout, you need to verify your identity first.",
-  "kyc.payout.button.completed": "Proceed to  cashout"
+  "kyc.payout.button.completed": "Proceed to  cashout",
+  "job.offers.title": "Job offers",
+  "job.offers.description": "Interested in potential job opportunities? Fill in this google form and we’ll contact you for relevant roles.",
+  "job.offers.button.next": "Next"
 }

public/locales/es/common.json

@@ -397,5 +397,8 @@
   "kyc.default.button": "Start verification",
   "kyc.default.button.completed": "Go to profile",
   "kyc.payout.reason": "To cashout, you need to verify your identity first.",
-  "kyc.payout.button.completed": "Proceed to  cashout"
+  "kyc.payout.button.completed": "Proceed to  cashout",
+  "job.offers.title": "Ofertas de trabajo",
+  "job.offers.description": "¿Interesado en oportunidades laborales potenciales? Completa este formulario de Google y nos pondremos en contacto contigo para roles relevantes.",
+  "job.offers.button.next": "Siguiente"
 }

public/locales/hr/common.json

@@ -383,5 +383,8 @@
   "kyc.default.button": "Start verification",
   "kyc.default.button.completed": "Go to profile",
   "kyc.payout.reason": "To cashout, you need to verify your identity first.",
-  "kyc.payout.button.completed": "Proceed to  cashout"
+  "kyc.payout.button.completed": "Proceed to  cashout",
+  "job.offers.title": "Poslovne ponude",
+  "job.offers.description": "Zainteresirani za potencijalne poslovne prilike? Ispunite ovaj Google obrazac i kontaktirat ćemo vas za relevantne uloge.",
+  "job.offers.button.next": "Sljedeći"
 }

src/components/cards/Numbered.tsx

@@ -27,11 +27,11 @@ interface NumberedProps {
  */
 export default function Numbered({ index = 1, title = "", text = "" }: NumberedProps): ReactElement {
   return (
-    <div>
-      <div className="hidden xl:block md:block">
-        <div className="w-14 h-14 border border-solid border-gray-400 text-gray-400 font-medium rounded-full flex items-center justify-center">{index}</div>
+    <div className="flex items-center md:flex-col md:items-start gap-2.5">
+      <div className="block">
+        <div className="w-9 h-9 md:w-14 md:h-14 border border-solid border-gray-400 text-gray-400 font-medium rounded-full flex items-center justify-center">{index}</div>
       </div>
-      <div className="mt-2.5">
+      <div>
         <span className="font-medium">{title}</span> <span>{text}</span>
       </div>
     </div>

src/components/cards/challenge/Badges.tsx

@@ -25,8 +25,10 @@ export default function Badges({ challenge, className }: BadgeProps) {
     return setChallengeLevel("course.challenge.level-2");
   }, [challenge.level]);
 
+  if (!challenge?.level && !challenge?.isTeamChallenge) return <></>;
+
   return (
-    <div className={`uppercase flex flex-wrap gap-2 mb-6 ${className}`}>
+    <div className={`uppercase flex flex-wrap gap-2 mb-3 ${className}`}>
       {challenge?.level && <Tag>{t(challengeLevel)}</Tag>}
       {challenge?.isTeamChallenge && <Tag type="light">{challenge?.isHackathon ? "Hackathon" : "Team"} challenge</Tag>}
     </div>

src/components/cards/challenge/Challenge.tsx

@@ -27,30 +27,28 @@ export default function ChallengeCard({ data, community, isCourseEnd }: Challeng
   const link = `/communities/${community.slug}/challenges/${data.id}`;
   const expiresAt = useMemo(() => (data.expiresAt ? new Date(data.expiresAt).toLocaleDateString() : null), [data.expiresAt]);
   const reward = isCourseEnd ? data?.rewards?.find((reward) => reward.type === "SUBMISSION") : data?.reward;
-  const learningModulesCount = data?.learningModules?.length || 0;
+  const learningMaterialsCount = data?.learningModules?.length + data?.courses?.length
 
   return (
-    <div className="w-full justify-between- flex flex-col sm:flex-row  md:flex-col lg:flex-row  border-solid border border-gray-200 bg-gray-50 rounded-3xl mb-5 group text-gray-700">
-      <div className="border-solid border-b border-gray-300 bg-white rounded-3xl sm:p-8 sm:pb-6 p-6 lg:w-2/3">
+    <div className="w-full flex flex-col sm:flex-row  md:flex-col lg:flex-row  border-solid border border-gray-200 bg-gray-50 rounded-3xl mb-5 group text-gray-700">
+      <div className="border-solid border -m-px border-gray-200 bg-white rounded-3xl sm:p-8 sm:pb-6 p-6 sm:w-2/3 md:w-auto lg:w-2/3">
         <div className="flex flex-col mb-1">
-          <div className="lg:pr-20 lg:w-3/5-">
-            <div className="text-gray-400 lg:w-2/3 text-sm font-normal mb-6 lg:mb-0">
-              {expiresAt && (
-                <>
-                  <span>{t("communities.overview.challenge.deadline")}</span>
-                  <span className="font-medium pl-1">{expiresAt}</span>
-                </>
-              )}
-            </div>
-            <div className="text-lg text-gray-900 font-medium leading-normal mb-6">{data.name}</div>
-            <Badges challenge={data} className="" />
-            <div className="text-sm pb-2 text-gray-700">{data.description}</div>
+          <div className="lg:pr-20">
+            {expiresAt && (
+              <div className="text-gray-400 text-sm font-normal mb-4.5 md:mb-6">
+                <span>{t("communities.overview.challenge.deadline")}</span>
+                <span className="font-medium pl-1">{expiresAt}</span>
+              </div>
+            )}
+            <div className="text-lg text-gray-900 font-medium leading-normal mb-3">{data.name}</div>
+            <Badges challenge={data} />
+            <div className="text-sm text-gray-700">{data.description}</div>
           </div>
-          <div className="divide-y-2 divide-gray-200 divide-dotted flex flex-col mt-3">
-            <p className="pb-6">
-              {learningModulesCount ? `${learningModulesCount}  learning ${learningModulesCount === 1 ? "module" : "modules"} included` : "No learning modules included"}
-            </p>
-            <div className="lg:flex lg:flex-row flex-col justify-between pt-6 items-center">
+          <div className="divide-y-2 divide-gray-200 divide-dotted flex flex-col mt-8">
+            {learningMaterialsCount && (
+              <p className="pb-3 md:pb-4 text-sm font-medium text-gray-400">{`${learningMaterialsCount}  Learning ${learningMaterialsCount === 1 ? "material" : "materials"} included`}</p>
+            )}
+            <div className="lg:flex lg:flex-row flex-col justify-between pt-3 md:pt-4 items-center">
               <Link href={link}>
                 <ArrowButton communityStyles={true} variant="outline-primary">
                   {isCourseEnd ? t("communities.overview.challenge.take.challenge") : t("communities.overview.challenge.see.challenge")}
@@ -60,15 +58,15 @@ export default function ChallengeCard({ data, community, isCourseEnd }: Challeng
           </div>
         </div>
       </div>
-      <div className="p-6">
-        <div className={"mx-auto relative rounded-full mb-5 w-[147px] h-[184px]"}>
-          <Image src={data?.certificateData?.icon} alt="achievement" fill />
+      <div className="p-6 lg:flex-1">
+        <div className="mx-auto relative rounded-full mb-5 w-[147px] h-[184px]">
+          <Image src={data?.certificateData?.icon} alt="achievement" fill priority />
         </div>
         <div className="">
-          <h1 className="font-bold text-gray-400 text-xs uppercase pb-2">{t("communities.overview.challenge.unlock.certificate")}</h1>
-          <RewardCertificate rewards={data?.rewards}/>
+          <h1 className="font-bold text-gray-400 text-xs uppercase pb-3">{t("communities.overview.challenge.unlock.certificate")}</h1>
+          <RewardCertificate rewards={data?.rewards} />
         </div>
-        {data?.isHackathon && <p className="py-2 border-t border-gray-200 text-sm">{t("communities.overview.challenge.participate", { token: reward?.token })}</p>}
+        {data?.isHackathon && <p className="py-1.5 border-t border-gray-200 text-sm">{t("communities.overview.challenge.participate", { token: reward?.token })}</p>}
       </div>
     </div>
   );

src/components/cards/challenge/RewardCertificate.tsx

@@ -26,8 +26,8 @@ export default function RewardCertificate({ rewards, isReward }: RewardCertifica
         <div
           key={reward.id}
           className={classNames(
-            "flex items-center gap-1 border-gray-200 pb-2",
-            { "pt-2": index !== 0 },
+            "flex items-center gap-1 border-gray-200 pb-1.5",
+            { "pt-1.5": index !== 0 },
             { "border-b": (index !== rewards.length - 1 && isReward) || (rewards.length === 1 && isReward) || index !== rewards.length - 1 }
           )}
         >

src/components/cards/community/index.tsx

@@ -59,9 +59,9 @@ export default function CommunityCard({ showRewards = true, community }: Communi
   }, [colors]);
 
   return (
-    <ThemeWrapper colors={community.colors}>
+    <ThemeWrapper colors={community.colors} className="mt-2 md:mt-0">
       <div onClick={() => router.push(path)} className="block h-full hover:cursor-pointer">
-        <div className="flex flex-col h-full p-6 pb-3 space-y-5 divide-y-2 group bg-theme-primary text-theme-text divide-dotted divide-theme-accent">
+        <div className="flex flex-col h-full p-6 space-y-5 divide-y-2 group bg-theme-primary text-theme-text divide-dotted divide-theme-accent">
           <div className="flex-grow">
             <div className="flex flex-col justify-between space-y-5 sm:flex-row lg:flex-col 2xl:flex-row">
               <div className="text-.5xl md:text-2xl max-w-sm min-h-2xs md:min-h-3xs lg:min-h-2xs xl:min-h-2xs font-medium pb-5">

src/components/layout/Footer.tsx

@@ -31,6 +31,11 @@ const socialLinks = [
     url: "https://www.youtube.com/channel/UC08wXfDvuqBJvuZfNZkv3xQ",
     icon: "youtube",
   },
+  {
+    title: "LinkedIn",
+    url: "https://www.linkedin.com/company/dacade-org/",
+    icon: "linkedin",
+  },
 ];
 
 /**