From 1920c05f51ee4873dba0ec02f06328bdf7a46781 Mon Sep 17 00:00:00 2001
From: WuYongJie <wuyongjie@example.com>
Date: Thu, 28 May 2026 21:34:08 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E9=A6=96=E9=A1=B5=E6=A6=9C?=
 =?UTF-8?q?=E5=8D=95=E6=A0=87=E7=AD=BE=E4=BD=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/page.tsx                            | 24 +++++++++---------------
 docs/商业化地基排查问题清单_20260524.md |  6 +++---
 2 files changed, 12 insertions(+), 18 deletions(-)

diff --git a/app/page.tsx b/app/page.tsx
index 75bf959..f788a13 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -2110,22 +2110,8 @@ export default function Home() {
                             <span>{videoStatusMeta?.label || '预览生成中'}</span>
                           </div>
                         )}
-                        {/* 榜单角标和SPU型号 - 使用z-20确保在音频/视频覆盖层之上 */}
+                        {/* 型号标识 - 使用z-20确保在音频/视频覆盖层之上 */}
                         <div className="absolute top-3 left-3 flex flex-col items-start gap-1.5 z-20">
-                          {rankingBadges.length > 0 && (
-                            <div className="flex flex-wrap gap-1">
-                              {rankingBadges.map((badge) => (
-                                <span
-                                  key={`card-badge-${material.id}-${badge.label}`}
-                                  className={cn(
-                                    'px-2 py-0.5 rounded-md border border-slate-200 bg-white/90 text-[11px] font-medium text-slate-700 dark:border-slate-700 dark:bg-slate-900/90 dark:text-slate-200'
-                                  )}
-                                >
-                                  {badge.label}
-                                </span>
-                              ))}
-                            </div>
-                          )}
                           {/* SPU型号 */}
                           <div className="rounded-md border border-slate-200 bg-white/90 text-slate-800 dark:border-slate-700 dark:bg-slate-900/90 dark:text-slate-100 px-2 py-1 text-xs font-medium">
                             {material.productModel}
@@ -2177,6 +2163,14 @@ export default function Home() {
 
                       <div className="p-4 flex flex-col flex-1">
                         <div className="flex items-center gap-1 mb-2 overflow-hidden whitespace-nowrap">
+                          {rankingBadges.length > 0 && rankingBadges.map((badge) => (
+                            <span
+                              key={`card-badge-${material.id}-${badge.label}`}
+                              className="shrink-0 rounded-md border border-slate-200 bg-slate-50 px-2 py-0.5 text-[11px] font-medium text-slate-600 dark:border-slate-700 dark:bg-slate-800 dark:text-slate-300"
+                            >
+                              {badge.label}
+                            </span>
+                          ))}
                           {getMaterialTemplateLabel(material) && (
                             <Tag
                               size="xs"
diff --git a/docs/商业化地基排查问题清单_20260524.md b/docs/商业化地基排查问题清单_20260524.md
index 965d3cd..65f0e56 100644
--- a/docs/商业化地基排查问题清单_20260524.md
+++ b/docs/商业化地基排查问题清单_20260524.md
@@ -1045,7 +1045,7 @@ NAS 私有化系统可能在平板或窄屏浏览器里使用。模板编辑器
 
 证据：
 
-- `app/page.tsx:400`：精品、下载榜、点赞榜使用多段渐变角标。
+- `app/page.tsx:400`：精品、下载榜、点赞榜仍作为素材卡片状态信息保留，但样式已收为信息区里的中性小标签。
 - `app/page.tsx`：排序方式已从大号胶囊按钮改为普通矩形按钮组。
 - `app/page.tsx`：首页素材类型筛选和筛选弹窗内选项已从胶囊按钮、hover 滑动显示数量和阴影状态，收为普通矩形按钮；数量默认稳定显示，不再依赖鼠标悬停。
 - `app/page.tsx`：首页“上传素材”主按钮已去掉硬编码靛蓝主按钮样式，改为跟随当前主题色的普通矩形主操作按钮。
@@ -1053,14 +1053,14 @@ NAS 私有化系统可能在平板或窄屏浏览器里使用。模板编辑器
 - `app/page.tsx`：首页素材卡片已从大圆角、轻阴影和黑色半透明胶囊收为普通 `rounded-lg` 边框卡片、中性标签和弱化的素材型号标识。
 - `app/profile/page.tsx`：个人页“我的素材 / 我的点赞 / 浏览历史”卡片已从大圆角和黑色渐变覆盖层收为普通边框卡片和浅底信息条。
 - `components/RankingPanel.tsx`：浮动榜单面板已移除毛玻璃、重阴影、超大圆角和前三名金色卡片感，改为普通边框小面板。
-- `app/page.tsx`：榜单角标仍叠在素材封面上，但已从黑色高对比胶囊改为浅底中性标签，后续可继续评估是否移动到卡片信息区。
+- `app/page.tsx`：榜单/精品信息已从素材封面移到卡片信息区，并使用浅底中性小标签，避免长期遮挡素材图。
 - `app/page.tsx`、`components/MaterialActionButtons.tsx`：素材卡片悬浮点赞按钮已是矩形轻边框样式；公共素材操作按钮也从 `rounded-xl` 和蓝色下载进度条收为 `rounded-md` 与中性进度条。
 - `app/page.tsx`：首页空状态已从“快来上传第一个吧”改为“暂无素材，请上传素材”；列表底部已改为“加载更多素材 / 暂无更多素材”。
 
 建议动作：
 
 - 已完成第一轮：素材卡片改为轻边框、少阴影、不上浮，排序控件、筛选按钮和上传按钮改成普通按钮组。
-- 仍需继续：榜单/精品信息最好进一步移到卡片信息区或排序条件，不长期压在素材封面上。
+- 已完成：榜单/精品信息已从素材封面移到卡片信息区，不再长期压在素材图上。
 - 已完成：工作状态文案改为“加载中”“加载更多素材”“暂无更多素材”等朴素表达。
 
 ### P2-09 上传、编辑、预览弹窗过圆、过亮、说明过多