31 lines
1.6 KiB
Svelte
31 lines
1.6 KiB
Svelte
<script lang="ts">
|
|
import DatabaseCategoryNav from '$lib/components/DatabaseCategoryNav.svelte';
|
|
import DatabaseItemCard from '$lib/components/DatabaseItemCard.svelte';
|
|
import DatabaseDiscoveryConsole from '$lib/components/DatabaseDiscoveryConsole.svelte';
|
|
let { data } = $props();
|
|
</script>
|
|
|
|
<svelte:head>
|
|
<title>{data.category.label} — The Division Resurgence database — SHD.build</title>
|
|
<meta name="description" content={`${data.category.description} Community-maintained data for The Division Resurgence.`}/>
|
|
</svelte:head>
|
|
|
|
<main class="page database-category-page">
|
|
<header class="database-category-command">
|
|
<div><p class="eyebrow"><span></span> ISAC PUBLIC ARCHIVE / DATABASE REGISTRY</p><h1>{data.category.label}</h1><p>{data.category.description}</p></div>
|
|
<div><strong>{data.pagination.total}</strong><span>ACTIVE RECORDS</span><a href="/database">DATABASE INDEX →</a></div>
|
|
</header>
|
|
<DatabaseCategoryNav active={data.category.slug}/>
|
|
<DatabaseDiscoveryConsole filters={data.filters} pagination={data.pagination} search={data.search} searchPlaceholder={`SEARCH ${data.category.label.toUpperCase()} BY NAME`}/>
|
|
<section class="database-item-grid">
|
|
{#each data.items as item}
|
|
<DatabaseItemCard item={item as any}/>
|
|
{:else}
|
|
<div class="database-empty">
|
|
<span>◇</span><strong>{data.search ? 'NO MATCHING RECORDS' : 'NO ACTIVE RECORDS'}</strong>
|
|
<p>{data.search ? `No ${data.category.label.toLocaleLowerCase()} match “${data.search}”.` : `No ${data.category.label.toLocaleLowerCase()} have been added yet.`}</p>
|
|
</div>
|
|
{/each}
|
|
</section>
|
|
</main>
|