Overview
HOME
<section class="rise flex flex-wrap items-end justify-between gap-3">
    <h1 class="text-3xl font-medium tracking-tight md:text-4xl">Overview</h1>
    <span class="text-sm text-muted-foreground">
        Minecraft version <span data-stat="version" class="text-foreground">—</span>
    </span>
</section>

<section class="mt-8 grid gap-4 sm:grid-cols-2 lg:grid-cols-4">

    <article class="rise rise-1 ring-card relative flex flex-col overflow-hidden rounded-2xl bg-card p-5">
        <div class="flex items-center justify-between">
            <span class="text-sm text-muted-foreground">Players</span>
            <svg class="size-4 text-muted-foreground" aria-hidden="true"><use href="#i-users"/></svg>
        </div>
        <div class="mt-4 flex items-baseline gap-2">
            <span data-stat="players-online" class="tabular text-4xl font-medium tracking-tight">—</span>
            <span class="text-sm text-muted-foreground">/ <span data-stat="players-max" class="tabular">—</span></span>
        </div>
        <div class="mt-5 h-1 overflow-hidden rounded-full bg-muted">
            <div data-stat="players-bar" class="h-full rounded-full bg-primary transition-[width] duration-500" style="width:0"></div>
        </div>
        <div class="mt-auto flex items-center justify-between pt-3 text-xs text-muted-foreground">
            <span>online</span>
            <a href="/players/" class="inline-flex items-center gap-1 text-foreground/80 hover:text-foreground">
                view list <svg class="size-3" aria-hidden="true"><use href="#i-arrow-right"/></svg>
            </a>
        </div>
    </article>

    <article class="rise rise-2 ring-card relative flex flex-col overflow-hidden rounded-2xl bg-card p-5">
        <div class="flex items-center justify-between">
            <span class="text-sm text-muted-foreground">CPU</span>
            <svg class="size-4 text-muted-foreground" aria-hidden="true"><use href="#i-chip"/></svg>
        </div>
        <div class="mt-4 flex items-baseline gap-1.5">
            <span data-stat="cpu-process-value" class="tabular text-4xl font-medium tracking-tight">—</span>
        </div>
        <div class="mt-5 h-1 overflow-hidden rounded-full bg-muted">
            <div data-stat="cpu-bar" class="h-full rounded-full bg-primary transition-[width] duration-500" style="width:0"></div>
        </div>
        <div class="mt-auto flex items-center justify-between pt-3 text-xs text-muted-foreground">
            <span>process · <span data-stat="cpu-cores" class="tabular text-foreground/80">—</span> cores</span>
            <span>sys <span data-stat="cpu-system-value" class="tabular text-foreground/80">—</span></span>
        </div>
    </article>

    <article class="rise rise-3 ring-card relative flex flex-col overflow-hidden rounded-2xl bg-card p-5">
        <div class="flex items-center justify-between">
            <span class="text-sm text-muted-foreground">Memory</span>
            <svg class="size-4 text-muted-foreground" aria-hidden="true"><use href="#i-database"/></svg>
        </div>
        <div class="mt-4 flex items-baseline gap-1.5">
            <span data-stat="mem-value" class="tabular text-4xl font-medium tracking-tight">—</span>
            <span data-stat="mem-unit" class="text-sm text-muted-foreground">—</span>
        </div>
        <div class="mt-5 h-1 overflow-hidden rounded-full bg-muted">
            <div data-stat="mem-bar" class="h-full rounded-full bg-primary transition-[width] duration-500" style="width:0"></div>
        </div>
        <div class="mt-auto flex items-center justify-between pt-3 text-xs text-muted-foreground">
            <span>heap · <span data-stat="mem-percent" class="tabular text-foreground/80">—</span></span>
            <span>max <span data-stat="mem-max" class="tabular text-foreground/80">—</span></span>
        </div>
    </article>

    <article class="rise rise-4 ring-card relative flex flex-col overflow-hidden rounded-2xl bg-card p-5">
        <div class="flex items-center justify-between">
            <span class="text-sm text-muted-foreground">Ticks per second</span>
            <svg class="size-4 text-muted-foreground" aria-hidden="true"><use href="#i-chart"/></svg>
        </div>
        <div class="mt-4 flex items-baseline gap-1.5">
            <span data-stat="tps-1m" data-tps-state class="tabular text-4xl font-medium tracking-tight text-success">—</span>
            <span class="text-sm text-muted-foreground">/ 20.00</span>
        </div>
        <svg data-spark="tps" viewBox="0 0 600 60" preserveAspectRatio="none" class="mt-3 h-12 w-full overflow-visible">
            <defs>
                <linearGradient id="spark-fill" x1="0" x2="0" y1="0" y2="1">
                    <stop offset="0%" stop-color="currentColor" stop-opacity="0.18"/>
                    <stop offset="100%" stop-color="currentColor" stop-opacity="0"/>
                </linearGradient>
            </defs>
            <polygon data-spark-area class="text-primary" fill="url(#spark-fill)" points=""/>
            <polyline data-spark-line fill="none" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round" stroke-linecap="round" class="text-primary" points=""/>
        </svg>
        <div class="mt-1 flex items-center justify-between text-xs text-muted-foreground">
            <span>5m <span data-stat="tps-5m" class="tabular text-foreground/80">—</span></span>
            <span>15m <span data-stat="tps-15m" class="tabular text-foreground/80">—</span></span>
        </div>
    </article>

</section>

<section class="mt-4 grid gap-4 sm:grid-cols-2 lg:grid-cols-3">

    <article class="rise rise-5 ring-card flex flex-col rounded-2xl bg-card p-5">
        <div class="flex items-center justify-between">
            <span class="text-sm text-muted-foreground">Uptime</span>
            <svg class="size-4 text-muted-foreground" aria-hidden="true"><use href="#i-clock"/></svg>
        </div>
        <div class="mt-3 flex flex-1 items-center justify-start font-mono text-4xl font-medium tracking-tight md:text-5xl">
            <span data-stat="uptime">—</span>
        </div>
    </article>

    <article class="rise rise-5 ring-card flex flex-col rounded-2xl bg-card p-5">
        <div class="flex items-center justify-between">
            <span class="text-sm text-muted-foreground">World</span>
            <svg class="size-4 text-muted-foreground" aria-hidden="true"><use href="#i-package"/></svg>
        </div>
        <dl class="mt-3 grid flex-1 grid-cols-3 items-center gap-3 text-center">
            <div>
                <dt class="text-xs text-muted-foreground">Worlds</dt>
                <dd data-stat="worlds" class="mt-1 tabular text-4xl font-medium tracking-tight text-foreground md:text-5xl">—</dd>
            </div>
            <div>
                <dt class="text-xs text-muted-foreground">Chunks</dt>
                <dd data-stat="chunks" class="mt-1 tabular text-4xl font-medium tracking-tight text-foreground md:text-5xl">—</dd>
            </div>
            <div>
                <dt class="text-xs text-muted-foreground">Entities</dt>
                <dd data-stat="entities" class="mt-1 tabular text-4xl font-medium tracking-tight text-foreground md:text-5xl">—</dd>
            </div>
        </dl>
    </article>

    <article class="rise rise-6 ring-card flex flex-col rounded-2xl bg-card p-5">
        <div class="flex items-center justify-between">
            <span class="text-sm text-muted-foreground">Plugins</span>
            <svg class="size-4 text-muted-foreground" aria-hidden="true"><use href="#i-code"/></svg>
        </div>
        <div class="mt-3 flex items-baseline gap-2">
            <span data-stat="plugins" class="tabular text-2xl font-medium tracking-tight">—</span>
            <span class="text-sm text-muted-foreground">active</span>
        </div>
        <div class="mt-auto flex gap-2 pt-3">
            <a href="/api/commands/" class="inline-flex items-center gap-1.5 rounded-full bg-muted px-3 py-1 text-xs text-muted-foreground transition-colors hover:bg-secondary hover:text-foreground">
                <svg class="size-3" aria-hidden="true"><use href="#i-arrow-right"/></svg> commands
            </a>
            <a href="/api/schematics/download/" class="inline-flex items-center gap-1.5 rounded-full bg-muted px-3 py-1 text-xs text-muted-foreground transition-colors hover:bg-secondary hover:text-foreground">
                <svg class="size-3" aria-hidden="true"><use href="#i-arrow-right"/></svg> schematics
            </a>
        </div>
    </article>

</section>

<script src="/assets/dashboard.js" defer></script>