feat ui设计稿bug修复

src/components/CaseCard.vue

@@ -67,11 +67,13 @@ const meta = computed<Array<{ label: string; value: string }>>(() => [
 
 <style lang="less" scoped>
 .case-card {
+  // 设计稿卡片 396×267 白底 bd #E1DFDF/1
   overflow: hidden;
+  height: 267px;
+  box-sizing: border-box;
   border: 1px solid @cases-card-border;
   border-radius: @radius-base;
   background: @white;
-  box-shadow: @cases-card-shadow;
   cursor: pointer;
   transition: box-shadow 0.2s, transform 0.2s;
 
@@ -82,7 +84,8 @@ const meta = computed<Array<{ label: string; value: string }>>(() => [
 
   &__cover {
     position: relative;
-    aspect-ratio: 396 / 138; // 设计04 封面 396×137.8，通栏无留白
+    // 设计封面 396×137.81（通栏无留白）
+    height: 137px;
     overflow: hidden;
   }
 
@@ -92,21 +95,24 @@ const meta = computed<Array<{ label: string; value: string }>>(() => [
     object-fit: cover;
 
     &--placeholder {
-      background: @primary-strong; // 设计04 封面占位实底 rgba(2,79,255)
+      background: @primary-strong;
     }
   }
 
   &__tag {
     position: absolute;
-    top: 6px;
-    left: 14px;
-    height: 19px; // 设计15 标签 24 × 0.77
-    padding: 0 6px;
+    // 设计标签文字 @(628.6,540.35)，卡 @(606,423) → 卡内 (22.6,117) 高 44
+    top: 87px;
+    left: 22px;
+    height: 44px;
+    padding: 0 14px;
     border-radius: @radius-sm;
     background: @primary-strong;
     color: @white;
-    font-size: 11px; // 设计 10 → 7.7，取可读下限 11
-    line-height: 19px;
+    // 设计 28/500
+    font-size: 28px;
+    font-weight: 500;
+    line-height: 44px;
 
     &--hardware {
       background: @tag-hardware;
@@ -160,12 +166,19 @@ const meta = computed<Array<{ label: string; value: string }>>(() => [
   }
 
   &__body {
-    padding: 13px 16px 11px; // 上 17 / 左 20 / 下 14 × 0.77
+    position: relative;
+    // 设计标题 @(626.45,578.03)，卡 @(606,423) → 卡内 (20,155)
+    padding: 18px 20px 0;
+    height: 129px;
+    box-sizing: border-box;
   }
 
   &__title {
-    font-size: 12px; // 设计 16 × 0.77 ≈ 12.3
+    // 设计标题 16/500 #333333
+    margin: 0;
+    font-size: 16px;
     font-weight: 500;
+    line-height: 21.5px;
     color: @cases-text;
     .ellipsis();
   }
@@ -173,28 +186,31 @@ const meta = computed<Array<{ label: string; value: string }>>(() => [
   &__meta {
     display: grid;
     grid-template-columns: repeat(3, minmax(0, 1fr));
-    gap: 6px @spacing-sm;
-    margin-top: @spacing-sm;
-    font-size: 11px; // 设计 10 → 7.7，取可读下限 11
-    line-height: 1.5;
+    // 设计两行：y610.33 / y631.86 → 行距 21.5
+    gap: 21.5px 12px;
+    margin-top: 10px;
+    // 设计元信息 10/400 #333333
+    font-size: 10px;
+    line-height: 14px;
     color: @cases-text;
 
     li {
-      /* 值可能较长（如「完成时间：2026/11/30」），换行而非截断，避免丢信息 */
       overflow-wrap: anywhere;
     }
   }
 
   &__label {
-    color: inherit; // 设计04 标签与值同色 rgba(51,51,51)
+    color: inherit;
   }
 
   &__more {
-    display: block;
-    width: fit-content;
-    margin: 11px 0 0 auto; // 设计 14 × 0.77
-    color: @primary-strong; // 设计04 实取 rgba(2,79,255)
-    font-size: 11px; // 设计 12 → 9.2，取可读下限 11
+    position: absolute;
+    // 设计 @(926.67,659.85)，卡 @(606,423) → 卡内 (320.67,236.85)
+    right: 20px;
+    bottom: 14px;
+    color: @primary-strong;
+    // 设计 12/400 #024FFF
+    font-size: 12px;
     font-weight: 400;
   }
 }