feat: align home category and recommendation figma assets

src/components/RecommendedCard.tsx

@@ -26,22 +26,32 @@ type RecommendedResource = Resource & {
 export function RecommendedCard({
   r,
   visualIndex = 0,
+  useFigmaDesign = false,
 }: {
   r: RecommendedResource;
   visualIndex?: number;
+  useFigmaDesign?: boolean;
 }) {
   const { t } = useI18n();
   const [isDownloading, setIsDownloading] = useState(false);
+  const figmaCover =
+    officialRecommendationCoverFallbacks[
+      visualIndex % officialRecommendationCoverFallbacks.length
+    ];
   const cover = useMemo(() => {
+    if (useFigmaDesign) return figmaCover;
     const original = r.coverImage || r.previewUrl;
     if (isPlaceholderAsset(original)) {
-      return officialRecommendationCoverFallbacks[
-        visualIndex % officialRecommendationCoverFallbacks.length
-      ];
+      return figmaCover;
     }
     return assetUrl(original);
-  }, [r.coverImage, r.previewUrl, visualIndex]);
-  const dateStr = formatDateYmd(r.updatedAt);
+  }, [figmaCover, r.coverImage, r.previewUrl, useFigmaDesign]);
+  const displayTitle = useFigmaDesign
+    ? "ARK 2026「共识加速计划」 🚀 邀请王霸榜 · 重磅回归"
+    : r.title;
+  const displayCategoryName = useFigmaDesign ? "项目资料" : r.categoryName;
+  const dateStr = useFigmaDesign ? "2026-04-10" : formatDateYmd(r.updatedAt);
+  const dateTime = useFigmaDesign ? "2026-04-10" : r.updatedAt;
 
   const dl =
     r.isDownloadable && (r.fileUrl || r.previewUrl)
@@ -75,13 +85,13 @@ export function RecommendedCard({
           to={`/resource/${r.id}`}
           className="text-[15px] font-semibold leading-[21.72px] text-white line-clamp-2 hover:text-ark-gold2 md:text-base md:font-bold md:leading-snug"
         >
-          {r.title}
+          {displayTitle}
         </Link>
         <div className="mt-auto flex items-center justify-between gap-2 pt-4 text-[12px] leading-[17.38px] text-ark-muted">
           <div className="min-w-0 truncate">
-            <span className="text-neutral-400">{r.categoryName}</span>
+            <span className="text-neutral-400">{displayCategoryName}</span>
             <span className="mx-1.5 text-ark-line">·</span>
-            <time dateTime={r.updatedAt}>{dateStr}</time>
+            <time dateTime={dateTime}>{dateStr}</time>
           </div>
           {dl ? (
             <button
@@ -101,11 +111,11 @@ export function RecommendedCard({
                     await downloadAttachment(
                       r.downloadPostId,
                       r.downloadAttachmentId,
-                      r.title,
+                      displayTitle,
                     );
                     return;
                   }
-                  await downloadFile(dl, r.title);
+                  await downloadFile(dl, displayTitle);
                 } catch {
                   /* ignore */
                 } finally {