style: 图片高度统一

README.md

@@ -79,8 +79,8 @@ npm run build:prod
   - [x] 展示基础卡片
     - [x] 图片
     - [x] 点击 Cover 预览所有图片
-    - [x] TODO: 懒加载 -> 有瀑布流后大概可以不需要懒加载了？
-    - [ ] TODO: 图片高度统一
+    - [x]  懒加载 -> 有瀑布流后大概可以不需要懒加载了？
+    - [x]  图片高度统一
     - [x] 语言
   - [x] TAG
     - [x] 展示

src/Content.svelte

@@ -386,6 +386,12 @@
 
 {#if List.length}
   <div class="cardContainer justify-evenly gap-4 my-3" transition:fade={{ delay: 0, duration: 300 }}>
+    <!-- 示例卡片, 留着 -->
+    <!-- <Card raw_tags="|示例1|示例2|" cover="123"/> -->
+    <!-- <Card raw_tags="|示例1|示例2|" /> -->
+    <!-- <Card raw_tags="|示例1|示例2|" /> -->
+    <!-- <Card raw_tags="|示例1|示例2|" /> -->
+
     {#each List as item}
       <Card
         title={item.cn_name}
@@ -399,12 +405,6 @@
         p_searchCategory={searchCategory}
       />
     {/each}
-
-    <!-- 示例卡片, 留着 -->
-    <!-- <Card raw_tags="|示例1|示例2|" /> -->
-    <!-- <Card raw_tags="|示例1|示例2|" /> -->
-    <!-- <Card raw_tags="|示例1|示例2|" /> -->
-    <!-- <Card raw_tags="|示例1|示例2|" /> -->
   </div>
 {/if}
 

src/components/card.svelte

@@ -84,8 +84,20 @@
 
 <div class="card w-80 bg-primary text-primary-content shadow-xl">
   <!-- NOTE: Cover -->
-  <figure>
+  <figure class="relative">
+    <!-- {#if !_picError} -->
     <img
+      class="w-80 h-60 object-cover blur-lg"
+      src={cover ?? '/favicon.ico'}
+      alt={title ?? 'default alt'}
+      style={_picError ? 'height: 240px; width: 320px;' : ''}
+      on:click={getInfoPics}
+      onclick="globalModal.showModal()"
+      on:keypress={() => {}}
+    />
+    <!-- {/if} -->
+    <img
+      class="left-0 top-0 absolute w-80 h-60 object-contain"
       src={cover ?? '/favicon.ico'}
       alt={title ?? 'default alt'}
       style={_picError ? 'height: 240px; width: 320px;' : ''}
@@ -95,7 +107,7 @@
       on:keypress={() => {}}
     />
   </figure>
-  <div class="card-body">
+  <div class="card-body justify-between">
     <h2 class="card-title block text-lg">
       <!-- NOTE: 游戏类别 -->
       <div