feat: 赞助卡片支持头像展示,优化布局
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
+9
-3
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user