33 lines
1.3 KiB
PHP
33 lines
1.3 KiB
PHP
@props([
|
|
'rows' => 3,
|
|
])
|
|
|
|
{{-- Page-level skeleton placeholder used as Livewire placeholder() during Lazy hydration --}}
|
|
<div {{ $attributes->merge(['class' => 'flex flex-col gap-6 animate-pulse']) }} data-testid="page-skeleton">
|
|
|
|
{{-- Hero header skeleton --}}
|
|
<div class="flex justify-between items-end gap-6">
|
|
<div class="flex-1 max-w-xl flex flex-col gap-3">
|
|
<div class="h-3 bg-line rounded w-24"></div>
|
|
<div class="h-8 bg-line rounded w-3/5"></div>
|
|
<div class="h-3 bg-line rounded w-4/5"></div>
|
|
</div>
|
|
<div class="h-10 w-40 bg-line rounded-lg"></div>
|
|
</div>
|
|
|
|
{{-- Content card skeleton --}}
|
|
<div class="bg-bg-soft border border-line rounded-xl p-5 shadow-sm flex flex-col gap-4">
|
|
@for($i = 0; $i < (int) $rows; $i++)
|
|
<div class="grid grid-cols-[44px_1fr_auto] gap-3 items-center py-2 border-t border-line first:border-t-0">
|
|
<div class="w-10 h-10 rounded-lg bg-line"></div>
|
|
<div class="flex flex-col gap-2">
|
|
<div class="h-3 bg-line rounded w-3/5"></div>
|
|
<div class="h-2 bg-line rounded w-2/5"></div>
|
|
</div>
|
|
<div class="h-7 w-20 bg-line rounded-lg"></div>
|
|
</div>
|
|
@endfor
|
|
</div>
|
|
|
|
</div>
|