mirror of
https://github.com/Moe-Sakura/frontend.git
synced 2026-03-15 04:53:18 +08:00
@@ -391,16 +391,20 @@
|
||||
>
|
||||
<!-- 图片区域 -->
|
||||
<div class="w-full relative">
|
||||
<!-- 骨架屏占位 (padding-bottom: 133.33% = 3:4 比例) -->
|
||||
<div class="w-full pb-[133.33%] skeleton bg-rose-100 dark:bg-rose-900/30" />
|
||||
<img
|
||||
v-if="char.image"
|
||||
:src="char.image"
|
||||
:alt="char.name"
|
||||
class="absolute inset-0 w-full h-full object-cover"
|
||||
loading="lazy"
|
||||
@load="($event.target as HTMLElement).parentElement?.querySelector('.skeleton')?.classList.add('hidden')"
|
||||
/>
|
||||
<!-- 占位 (padding-bottom: 133.33% = 3:4 比例) -->
|
||||
<div class="w-full pb-[133.33%]" />
|
||||
<!-- 有图片时:骨架屏 + 图片 -->
|
||||
<template v-if="char.image">
|
||||
<div class="absolute inset-0 skeleton bg-rose-100 dark:bg-rose-900/30" />
|
||||
<img
|
||||
:src="char.image"
|
||||
:alt="char.name"
|
||||
class="absolute inset-0 w-full h-full object-cover"
|
||||
loading="lazy"
|
||||
@load="($event.target as HTMLElement).parentElement?.querySelector('.skeleton')?.classList.add('hidden')"
|
||||
/>
|
||||
</template>
|
||||
<!-- 无图片时:占位符 -->
|
||||
<div v-else class="absolute inset-0 flex items-center justify-center bg-rose-50 dark:bg-rose-900/30">
|
||||
<Users :size="24" class="text-rose-400 dark:text-rose-600" />
|
||||
</div>
|
||||
|
||||
@@ -35,6 +35,12 @@
|
||||
"desc": "galgame资源分享站",
|
||||
"url": "https://kisugal.icu",
|
||||
"logo": "https://kisugal.icu/wp-content/uploads/2025/11/logo-1.jpg"
|
||||
},
|
||||
{
|
||||
"name": "玖黎ACG",
|
||||
"desc": "一个免费分享Gal,Cos,Asmr的网站(∠・ω< )⌒★",
|
||||
"url": "https://jiuliacg.com",
|
||||
"logo": "https://img.alicdn.com/imgextra/i4/2201716776317/O1CN01kwy3QY1wXF2tUVkUx_!!2201716776317.webp"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user