54 lines
2.9 KiB
PHP
54 lines
2.9 KiB
PHP
@php
|
|
$themes = config('card_themes');
|
|
@endphp
|
|
|
|
@foreach ($cards as $c)
|
|
@php
|
|
$themeId = $c->template_id ?? 1;
|
|
$theme = $themes[$themeId] ?? $themes[1];
|
|
@endphp
|
|
<div class="rounded-[24px] border p-6 shadow-sm hover:shadow-md hover:-translate-y-1 transition-all duration-300 flex flex-col justify-between h-full group"
|
|
style="background: {{ $theme['card_bg'] }}; border-color: {{ $theme['border_color'] }};">
|
|
<div>
|
|
<div class="flex items-center justify-between mb-4">
|
|
<span class="text-xs font-bold text-gray-400 flex items-center gap-1.5">
|
|
<span class="text-[14px]">{{ $theme['icon'] }}</span> Từ
|
|
</span>
|
|
<span class="text-[11px] font-extrabold px-2.5 py-0.5 rounded-full"
|
|
style="background-color: {{ $theme['badge_bg'] }}; color: {{ $theme['accent_color'] }};">
|
|
{{ $c->received }} Thẻ ({{ $theme['name'] }})
|
|
</span>
|
|
</div>
|
|
<div class="flex items-start gap-3.5">
|
|
<div class="relative shrink-0">
|
|
@if($c->senderUser)
|
|
<x-avatar :user="$c->senderUser" class="w-12 h-12 rounded-full object-cover border-2" style="border-color: {{ $theme['border_color'] }};" />
|
|
@else
|
|
<div class="w-12 h-12 rounded-full bg-gray-50/50 border flex items-center justify-center font-bold text-gray-400"
|
|
style="border-color: {{ $theme['border_color'] }};">
|
|
{{ strtoupper(substr($c->sender ?? 'U', 0, 1)) }}
|
|
</div>
|
|
@endif
|
|
</div>
|
|
<div class="flex-1 min-w-0">
|
|
<h4 class="font-extrabold text-[#1a2b49] text-[15px] leading-snug truncate" title="{{ $c->senderUser ? $c->senderUser->name : ($c->sender ?? '---') }}">
|
|
{{ $c->senderUser ? $c->senderUser->name : ($c->sender ?? '---') }}
|
|
</h4>
|
|
<p class="text-xs text-gray-400 font-semibold mt-0.5">
|
|
MSNV: {{ $c->senderUser ? $c->senderUser->msnv : ($c->sender ?? '---') }}
|
|
</p>
|
|
<p class="text-xs text-gray-400 truncate mt-0.5" title="{{ $c->senderUser ? $c->senderUser->mail : '---' }}">
|
|
{{ $c->senderUser ? $c->senderUser->mail : '---' }}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex items-center justify-between pt-4 border-t text-[11px] font-semibold text-gray-400 mt-6"
|
|
style="border-top-color: {{ $theme['footer_border'] }}; border-top-style: dashed;">
|
|
<span>Ngày nhận:</span>
|
|
<span class="font-bold" style="color: {{ $theme['accent_color'] }};">{{ \Carbon\Carbon::parse($c->date)->format('d/m/Y') }}</span>
|
|
</div>
|
|
</div>
|
|
@endforeach
|