26 lines
1.2 KiB
PHP
26 lines
1.2 KiB
PHP
{{-- Skeleton loader for invoice card --}}
|
|
<div class="bg-gradient-to-br from-background-secondary/50 to-background-secondary/30 border border-neutral/50 p-6 rounded-xl shadow-lg
|
|
flex flex-col md:flex-row items-start md:items-center justify-between gap-4">
|
|
|
|
<div class="flex items-start md:items-center gap-4 flex-grow">
|
|
{{-- Icon skeleton --}}
|
|
<div class="p-3 rounded-full flex-shrink-0 bg-blue-500/20 w-12 h-12 skeleton-shimmer"></div>
|
|
|
|
<div class="flex flex-col flex-grow">
|
|
{{-- Title skeleton --}}
|
|
<div class="h-6 bg-neutral/20 rounded-lg w-40 mb-2 skeleton-shimmer"></div>
|
|
{{-- Amount and date skeleton --}}
|
|
<div class="h-4 bg-neutral/20 rounded w-56 mb-1 skeleton-shimmer"></div>
|
|
{{-- Due date skeleton --}}
|
|
<div class="h-3 bg-neutral/20 rounded w-36 skeleton-shimmer"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex items-center gap-3 flex-shrink-0 mt-3 md:mt-0">
|
|
{{-- Status badge skeleton --}}
|
|
<div class="h-7 bg-neutral/20 rounded-full w-20 skeleton-shimmer"></div>
|
|
{{-- Arrow skeleton --}}
|
|
<div class="h-6 w-6 bg-neutral/20 rounded skeleton-shimmer"></div>
|
|
</div>
|
|
</div>
|