67 lines
3.7 KiB
PHP
67 lines
3.7 KiB
PHP
<div>
|
|
@if ($paginator->hasPages())
|
|
<nav class="flex items-center gap-2">
|
|
{{-- Previous Page Link --}}
|
|
@if ($paginator->onFirstPage())
|
|
<button disabled
|
|
class="w-10 h-10 flex items-center justify-center rounded-full border border-home-foreground/10 text-home-foreground/30 cursor-not-allowed hover:bg-transparent">
|
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path>
|
|
</svg>
|
|
</button>
|
|
@else
|
|
<button wire:click="previousPage" wire:loading.attr="disabled"
|
|
class="w-10 h-10 flex items-center justify-center rounded-full border border-home-foreground/10 text-home-foreground hover:border-home-primary hover:text-home-primary transition-all">
|
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7">
|
|
</path>
|
|
</svg>
|
|
</button>
|
|
@endif
|
|
|
|
{{-- Pagination Elements --}}
|
|
@foreach ($elements as $element)
|
|
{{-- "Three Dots" Separator --}}
|
|
@if (is_string($element))
|
|
<span
|
|
class="w-10 h-10 flex items-center justify-center text-home-foreground/40">{{ $element }}</span>
|
|
@endif
|
|
|
|
{{-- Array Of Links --}}
|
|
@if (is_array($element))
|
|
@foreach ($element as $page => $url)
|
|
@if ($page == $paginator->currentPage())
|
|
<button wire:click="gotoPage({{ $page }})"
|
|
class="w-10 h-10 flex items-center justify-center rounded-full bg-home-primary text-white font-bold shadow-lg shadow-home-primary/20 transition-all">
|
|
{{ $page }}
|
|
</button>
|
|
@else
|
|
<button wire:click="gotoPage({{ $page }})"
|
|
class="w-10 h-10 flex items-center justify-center rounded-full text-home-foreground hover:bg-home-primary/5 transition-all font-medium">
|
|
{{ $page }}
|
|
</button>
|
|
@endif
|
|
@endforeach
|
|
@endif
|
|
@endforeach
|
|
|
|
{{-- Next Page Link --}}
|
|
@if ($paginator->hasMorePages())
|
|
<button wire:click="nextPage" wire:loading.attr="disabled"
|
|
class="w-10 h-10 flex items-center justify-center rounded-full border border-home-foreground/10 text-home-foreground hover:border-home-primary hover:text-home-primary transition-all">
|
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
|
|
</svg>
|
|
</button>
|
|
@else
|
|
<button disabled
|
|
class="w-10 h-10 flex items-center justify-center rounded-full border border-home-foreground/10 text-home-foreground/30 cursor-not-allowed hover:bg-transparent">
|
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
|
|
</svg>
|
|
</button>
|
|
@endif
|
|
</nav>
|
|
@endif
|
|
</div>
|