Merge pull request #89 from kleros/feat(frontend)/add-extra-curator-cards

feat: add support for extra cards on curator tab

Author: alcercu

frontend/src/components/CtaCard.tsx

@@ -45,7 +45,11 @@ const CtaCard: React.FC<ICtaCard> = ({
       <h2 className="mb-6 text-lg font-medium text-primary-text lg:text-xl">
         {title}
       </h2>
-      <p className="mb-6 text-base text-secondary-text lg:text-lg">
+      <p
+        className={
+          "mb-6 whitespace-pre-wrap text-base text-secondary-text lg:text-lg"
+        }
+      >
         {description}
       </p>
       {typeof arrowLink !== "undefined" ? (

frontend/src/components/Earn/TabSection/CuratorTabContent/index.tsx

@@ -18,9 +18,13 @@ const CuratorTabContent: React.FC<EarnPageBecomeACuratorTab> = ({
         {title}
       </div>
       <div className="text-secondary-text lg:text-lg">{description}</div>
-      <div className="grid grid-cols-1 gap-6 lg:grid-cols-3">
-        {ctaCard.map((card) => (
-          <CtaCard key={card.title} {...card} />
+      <div className="grid grid-cols-1 gap-6 lg:grid-cols-6">
+        {ctaCard.map((card, i) => (
+          <CtaCard
+            className={i + 1 < ctaCard.length / 2 ? "col-span-3" : "col-span-2"}
+            key={card.title}
+            {...card}
+          />
         ))}
       </div>
       <ExternalLink