feat: 赞助卡片支持头像展示,优化布局

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-06-02 00:30:16 +08:00
parent 18951fa1c8
commit 68ce6089e8
4 changed files with 70 additions and 52 deletions
+9 -3
View File
@@ -47,14 +47,20 @@ useSeoMeta({
style="border-color: var(--color-border); background-color: var(--color-bg-card);"
>
<div class="flex items-center gap-4">
<div class="flex h-12 w-12 shrink-0 items-center justify-center rounded-full text-lg font-bold" style="background: var(--color-bg-hover); color: var(--color-text-secondary);">
<img
v-if="sponsor.avatar"
:src="sponsor.avatar"
:alt="sponsor.name"
class="h-12 w-12 shrink-0 rounded-full object-cover"
/>
<div v-else class="flex h-12 w-12 shrink-0 items-center justify-center rounded-full text-lg font-bold" style="background: var(--color-bg-hover); color: var(--color-text-secondary);">
{{ sponsor.name.charAt(0) }}
</div>
<div class="flex-1">
<div class="flex-1 min-w-0">
<div class="font-semibold">{{ sponsor.name }}</div>
<div class="text-sm text-muted-foreground">{{ sponsor.date }}</div>
<div v-if="sponsor.amount" class="text-sm font-medium text-primary mt-1">{{ sponsor.amount }}</div>
</div>
<div class="text-sm font-medium text-primary">{{ sponsor.amount }}</div>
</div>
</div>
</div>