feat: refine ISAC design and prepare production deployment
This commit is contained in:
@@ -65,6 +65,7 @@
|
||||
);
|
||||
const start = $derived(pagination.total ? (pagination.page - 1) * pagination.perPage + 1 : 0);
|
||||
const end = $derived(Math.min(pagination.total, pagination.page * pagination.perPage));
|
||||
const hasMultiplePages = $derived(pagination.pageCount > 1);
|
||||
</script>
|
||||
|
||||
<nav class="registry-pagination" aria-label="Registry pagination">
|
||||
@@ -77,13 +78,15 @@
|
||||
</form>
|
||||
{/if}
|
||||
<div class="pagination-range"><span>DISPLAYING</span><b>{start}–{end}</b><span>OF {pagination.total}</span></div>
|
||||
<div class="pagination-pages">
|
||||
<a class:disabled={pagination.page === 1} aria-disabled={pagination.page === 1} href={href(Math.max(1, pagination.page - 1))}>← PREV</a>
|
||||
{#each visiblePages as page, index}
|
||||
{#if index > 0 && page - visiblePages[index - 1] > 1}<span class="pagination-gap">···</span>{/if}
|
||||
<a class:active={page === pagination.page} aria-current={page === pagination.page ? 'page' : undefined} href={href(page)}>{page}</a>
|
||||
{/each}
|
||||
<a class:disabled={pagination.page === pagination.pageCount} aria-disabled={pagination.page === pagination.pageCount} href={href(Math.min(pagination.pageCount, pagination.page + 1))}>NEXT →</a>
|
||||
</div>
|
||||
<div class="pagination-sizes"><span>ROWS</span>{#each [10, 25, 50, 100] as size}<a class:active={size === pagination.perPage} href={href(1, size)}>{size}</a>{/each}</div>
|
||||
{#if hasMultiplePages}
|
||||
<div class="pagination-pages">
|
||||
<a class:disabled={pagination.page === 1} aria-disabled={pagination.page === 1} href={href(Math.max(1, pagination.page - 1))}>← PREV</a>
|
||||
{#each visiblePages as page, index}
|
||||
{#if index > 0 && page - visiblePages[index - 1] > 1}<span class="pagination-gap">···</span>{/if}
|
||||
<a class:active={page === pagination.page} aria-current={page === pagination.page ? 'page' : undefined} href={href(page)}>{page}</a>
|
||||
{/each}
|
||||
<a class:disabled={pagination.page === pagination.pageCount} aria-disabled={pagination.page === pagination.pageCount} href={href(Math.min(pagination.pageCount, pagination.page + 1))}>NEXT →</a>
|
||||
</div>
|
||||
<div class="pagination-sizes"><span>ROWS</span>{#each [10, 25, 50, 100] as size}<a class:active={size === pagination.perPage} href={href(1, size)}>{size}</a>{/each}</div>
|
||||
{/if}
|
||||
</nav>
|
||||
|
||||
Reference in New Issue
Block a user