style: add component table

control & pagination
main
Yuri Dimas 2025-10-09 23:29:28 +07:00
parent c7df999368
commit 86a146d50f
No known key found for this signature in database
GPG Key ID: 4A421F9108FB5D2C
2 changed files with 41 additions and 0 deletions

View File

@ -0,0 +1,18 @@
<div class="flex w-full flex-col items-center justify-between gap-2 rounded-t-md bg-gray-50 p-2 md:flex-row md:gap-0">
<div>
<span>Show</span>
<select class="select select-sm mx-1 w-16">
<option value="10" selected>10</option>
<option value="25">25</option>
<option value="50">50</option>
<option value="100">100</option>
</select>
<span>Entries</span>
</div>
<div>
<label class="input input-sm rounded-full">
<i class="ph ph-magnifying-glass"></i>
<input type="search" required placeholder="Cari data disini..." />
</label>
</div>
</div>

View File

@ -0,0 +1,23 @@
<div class="flex w-full flex-col items-center justify-between gap-2 p-2 md:flex-row md:gap-0">
<div>
<span>
Showing 1 to 10 of 57 entries
</span>
</div>
<div>
<div class="join">
<button class="join-item btn-ghost btn-sm btn" disabled>
<i class="ph ph-arrow-left"></i>
Prev
</button>
<button class="join-item btn-ghost btn-sm btn btn-active rounded-lg">1</button>
<button class="join-item btn-ghost btn-sm btn rounded-lg">2</button>
<button class="join-item btn-ghost btn-sm btn rounded-lg">3</button>
<button class="join-item btn-ghost btn-sm btn rounded-lg">4</button>
<button class="join-item btn-ghost btn-sm btn rounded-lg">
Next
<i class="ph ph-arrow-right"></i>
</button>
</div>
</div>
</div>