收敛个人页和编辑弹窗素材卡片样式

app/profile/page.tsx

@@ -419,7 +419,7 @@ export default function ProfilePage() {
               {materials.map((material) => (
                 <div
                   key={material.id}
-                  className="relative aspect-[3/4] rounded-2xl overflow-hidden cursor-pointer hover:opacity-90 transition-opacity"
+                  className="relative aspect-[3/4] rounded-lg border border-slate-200 dark:border-slate-700 overflow-hidden cursor-pointer hover:opacity-90 transition-opacity bg-slate-100 dark:bg-slate-900"
                   onClick={async () => {
                     // 获取完整的素材信息
                     try {
@@ -499,9 +499,9 @@ export default function ProfilePage() {
                     unoptimized
                     className="object-cover"
                   />
-                  <div className="absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/70 to-transparent p-2">
-                    <p className="text-white text-xs font-medium truncate">{material.productModel}</p>
-                    <div className="flex items-center gap-2 text-[10px] text-white/80 mt-1">
+                  <div className="absolute bottom-0 left-0 right-0 border-t border-slate-200/80 dark:border-slate-800/80 bg-white/90 dark:bg-slate-950/90 p-2">
+                    <p className="text-slate-900 dark:text-slate-100 text-xs font-medium truncate">{material.productModel}</p>
+                    <div className="flex items-center gap-2 text-[10px] text-slate-500 dark:text-slate-400 mt-1">
                       <span>下载 {material.downloadCount}</span>
                       <span>点赞 {material.likeCount}</span>
                     </div>
@@ -522,7 +522,7 @@ export default function ProfilePage() {
               {favoriteMaterials.map((material) => (
                 <div
                   key={material.id}
-                  className="relative aspect-[3/4] rounded-2xl overflow-hidden cursor-pointer hover:opacity-90 transition-opacity"
+                  className="relative aspect-[3/4] rounded-lg border border-slate-200 dark:border-slate-700 overflow-hidden cursor-pointer hover:opacity-90 transition-opacity bg-slate-100 dark:bg-slate-900"
                   onClick={async () => {
                     // 获取完整的素材信息
                     try {
@@ -602,9 +602,9 @@ export default function ProfilePage() {
                     unoptimized
                     className="object-cover"
                   />
-                  <div className="absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/70 to-transparent p-2">
-                    <p className="text-white text-xs font-medium truncate">{material.productModel}</p>
-                    <div className="flex items-center gap-2 text-[10px] text-white/80 mt-1">
+                  <div className="absolute bottom-0 left-0 right-0 border-t border-slate-200/80 dark:border-slate-800/80 bg-white/90 dark:bg-slate-950/90 p-2">
+                    <p className="text-slate-900 dark:text-slate-100 text-xs font-medium truncate">{material.productModel}</p>
+                    <div className="flex items-center gap-2 text-[10px] text-slate-500 dark:text-slate-400 mt-1">
                       <span>下载 {material.downloadCount}</span>
                       <span>点赞 {material.likeCount}</span>
                     </div>
@@ -625,7 +625,7 @@ export default function ProfilePage() {
               {browseHistory.map((material) => (
                 <div
                   key={material.id}
-                  className="relative aspect-[3/4] rounded-2xl overflow-hidden cursor-pointer hover:opacity-90 transition-opacity"
+                  className="relative aspect-[3/4] rounded-lg border border-slate-200 dark:border-slate-700 overflow-hidden cursor-pointer hover:opacity-90 transition-opacity bg-slate-100 dark:bg-slate-900"
                   onClick={() => router.push(`/share/${material.id}`)}
                   title="点击查看详情"
                 >
@@ -636,9 +636,9 @@ export default function ProfilePage() {
                     unoptimized
                     className="object-cover"
                   />
-                  <div className="absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/70 to-transparent p-2">
-                    <p className="text-white text-xs font-medium truncate">{material.productModel}</p>
-                    <div className="flex items-center gap-2 text-[10px] text-white/80 mt-1">
+                  <div className="absolute bottom-0 left-0 right-0 border-t border-slate-200/80 dark:border-slate-800/80 bg-white/90 dark:bg-slate-950/90 p-2">
+                    <p className="text-slate-900 dark:text-slate-100 text-xs font-medium truncate">{material.productModel}</p>
+                    <div className="flex items-center gap-2 text-[10px] text-slate-500 dark:text-slate-400 mt-1">
                       <span>{material.materialType || '未分类'}</span>
                     </div>
                   </div>

components/EditMaterialModal.tsx

@@ -468,7 +468,7 @@ export default function EditMaterialModal({ material, onClose, onSuccess, isOpen
       <form onSubmit={handleSubmit} className="space-y-6" noValidate>
         {error && (
           <div className={cn(
-            'px-4 py-3 rounded-xl border',
+            'px-4 py-3 rounded-lg border',
             'bg-red-50 dark:bg-red-900/20 border-red-200 dark:border-red-800',
             'text-red-600 dark:text-red-400'
           )}>
@@ -477,7 +477,7 @@ export default function EditMaterialModal({ material, onClose, onSuccess, isOpen
         )}
         {success && (
           <div className={cn(
-            'px-4 py-3 rounded-xl border',
+            'px-4 py-3 rounded-lg border',
             'bg-emerald-50 dark:bg-emerald-900/20 border-emerald-200 dark:border-emerald-800',
             'text-emerald-700 dark:text-emerald-400'
           )}>
@@ -493,20 +493,21 @@ export default function EditMaterialModal({ material, onClose, onSuccess, isOpen
           <div
             onClick={() => previewInputRef.current?.click()}
             className={cn(
-              styles.inputStyles.base,
-              'border-2 border-dashed cursor-pointer flex flex-col sm:flex-row gap-4 items-center p-4',
-              'hover:border-indigo-400 dark:hover:border-indigo-500 hover:bg-slate-50/50 dark:hover:bg-slate-800/40'
+              'rounded-lg border border-dashed cursor-pointer flex flex-col sm:flex-row gap-4 items-center p-4 transition-colors',
+              theme === 'dark'
+                ? 'border-slate-700 bg-slate-900 text-slate-100 hover:border-slate-500 hover:bg-slate-800/60'
+                : 'border-slate-300 bg-white text-slate-900 hover:border-slate-500 hover:bg-slate-50'
             )}
           >
-            <div className="relative w-28 h-28 sm:w-32 sm:h-32 rounded-2xl overflow-hidden border border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-900 flex-shrink-0">
+            <div className="relative w-28 h-28 sm:w-32 sm:h-32 rounded-lg overflow-hidden border border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-900 flex-shrink-0">
               <Image src={previewUrl} alt="预览图" fill unoptimized className="object-cover" />
             </div>
             <div className="flex-1 text-left space-y-1">
               <p className={cn('text-sm font-semibold', theme === 'dark' ? 'text-slate-200' : 'text-slate-800')}>
-                点击或拖拽替换预览图
+                更换预览图
               </p>
               <p className={cn('text-xs', theme === 'dark' ? 'text-slate-400' : 'text-slate-500')}>
-                推荐上传 600px 以上的 JPG/PNG/WebP，系统会自动等比压缩
+                支持 JPG/PNG/WebP
               </p>
               <button
                 type="button"
@@ -514,9 +515,9 @@ export default function EditMaterialModal({ material, onClose, onSuccess, isOpen
                   e.stopPropagation()
                   previewInputRef.current?.click()
                 }}
-                className="inline-flex items-center text-xs font-medium text-blue-600 hover:text-blue-500 dark:text-blue-300 dark:hover:text-blue-200"
+                className="inline-flex items-center text-xs font-medium text-slate-700 transition-colors hover:text-slate-900 dark:text-slate-300 dark:hover:text-white"
               >
-                更换预览图
+                选择文件
                 <svg className="w-3.5 h-3.5 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                   <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 4v12m0 0l3-3m-3 3l-3-3M5 20h14" />
                 </svg>

docs/商业化地基排查问题清单_20260524.md

@@ -1046,6 +1046,7 @@ NAS 私有化系统可能在平板或窄屏浏览器里使用。模板编辑器
 - `app/page.tsx:400`：精品、下载榜、点赞榜使用多段渐变角标。
 - `app/page.tsx`：排序方式已从大号胶囊按钮改为普通矩形按钮组。
 - `app/page.tsx`：首页素材卡片已从大圆角、轻阴影和黑色半透明胶囊收为普通 `rounded-lg` 边框卡片、中性标签和弱化的素材型号标识。
+- `app/profile/page.tsx`：个人页“我的素材 / 我的点赞 / 浏览历史”卡片已从大圆角和黑色渐变覆盖层收为普通边框卡片和浅底信息条。
 - `components/RankingPanel.tsx`：浮动榜单面板已移除毛玻璃、重阴影、超大圆角和前三名金色卡片感，改为普通边框小面板。
 - `app/page.tsx`：榜单角标仍叠在素材封面上，但已从黑色高对比胶囊改为浅底中性标签，后续可继续评估是否移动到卡片信息区。
 - `app/page.tsx:2073`：点赞按钮使用悬浮圆形、阴影和毛玻璃。
@@ -1071,8 +1072,7 @@ NAS 私有化系统可能在平板或窄屏浏览器里使用。模板编辑器
 - `components/UploadModal.tsx`：已完成第二轮收口，恢复上传提示去掉 emoji，内部外壳去掉额外重阴影和卡片套卡片，上传区从大圆角虚线卡片收为普通 `rounded-lg` dropzone。
 - `components/UploadModal.tsx`：预览图、PSD 展示图和素材文件上传说明已压短，不再重复“点击或拖拽/支持格式”长提示；网络失败提示也改为一句明确结果和下一步。
 - `components/UploadModal.tsx:1661`、`components/UploadModal.tsx:1812`：必填字段不再使用蓝色渐变背景和大阴影，改为边框/浅底提示。
-- `components/EditMaterialModal.tsx:240`：编辑弹窗必填标识同样使用紫蓝渐变胶囊。
-- `components/EditMaterialModal.tsx:265`：编辑输入框也有必填渐变背景。
+- `components/EditMaterialModal.tsx`：编辑弹窗必填标识和必填输入框已是中性样式；本轮继续把预览图上传区从大圆角展示模块收为普通 `rounded-lg` 表单区，并缩短说明文案。
 - `components/AudioVisualizer.tsx`：音频默认封面和播放频谱已先从 Apple Music 式深色渐变、光晕、毛玻璃改成中性封面和低调频谱。
 - `components/MaterialPreviewModal.tsx`：音频、视频、图片预览外壳已从大圆角/阴影/舞台式容器收为普通 `rounded-lg` 预览区；视频预览生成中状态改为普通空状态。
 - `components/MaterialPreviewModal.tsx`：右侧详情标题不再优先显示素材 ID，标题字号从侧栏里的大标题收为 `text-lg`；转码状态说明已缩短。
@@ -1080,11 +1080,11 @@ NAS 私有化系统可能在平板或窄屏浏览器里使用。模板编辑器
 
 建议动作：
 
-- 弹窗统一走中性 Modal：8-12px 圆角、普通遮罩、轻阴影。上传弹窗和音频预览已先完成第一轮，编辑弹窗、视频预览状态和图片预览仍需继续。
+- 弹窗统一走中性 Modal：8-12px 圆角、普通遮罩、轻阴影。上传弹窗、编辑弹窗预览区和音频预览已先完成第一轮，视频预览状态和图片预览继续观察真实素材效果。
 - 上传区保留拖拽能力，但改成紧凑 dropzone 或普通表单行，hover 只变边框色。
 - 去掉 emoji，提示文案缩短，错误和状态集中显示。上传弹窗已完成，剩余弹窗继续检查。
-- 必填用红色星号或中性小字，不用渐变胶囊。上传弹窗已完成，编辑弹窗仍需跟进。
-- 输入框必填态只改边框或辅助提示，不用渐变背景。上传弹窗已完成，编辑弹窗仍需跟进。
+- 必填用红色星号或中性小字，不用渐变胶囊。上传弹窗和编辑弹窗已完成第一轮。
+- 输入框必填态只改边框或辅助提示，不用渐变背景。上传弹窗和编辑弹窗已完成第一轮。
 - 预览弹窗减少舞台感，优先突出文件本身和右侧字段信息。音频、视频和图片预览已完成第一轮收口，后续继续检查具体素材尺寸和移动端效果。
 
 ### P2-10 模板编辑器更像低代码演示器，后续需要工具化（预览区已完成第一轮收口）