mirror of
https://github.com/plexusorg/Module-HTTPD.git
synced 2026-06-05 01:26:54 +00:00
Redesign the HTTPD
This commit is contained in:
@@ -1,5 +1,148 @@
|
||||
Home
|
||||
Overview
|
||||
HOME
|
||||
<h2>Welcome to the Plex HTTPD!</h2>
|
||||
<h4>Use the sidebar to navigate the available pages.</h4>
|
||||
<h4><br>There ${is_are} currently ${server_online_players} online out of ${server_total_players} total.</h4>
|
||||
<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="font-mono text-xs text-muted-foreground">
|
||||
Minecraft version <span data-stat="version">—</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 overflow-hidden rounded-2xl bg-card p-5">
|
||||
<div class="flex items-center justify-between">
|
||||
<span class="font-mono text-[11px] uppercase tracking-wider 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="font-mono 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-3 flex items-center justify-between font-mono text-[11px] 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 overflow-hidden rounded-2xl bg-card p-5">
|
||||
<div class="flex items-center justify-between">
|
||||
<span class="font-mono text-[11px] uppercase tracking-wider 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-3 flex items-center justify-between font-mono text-[11px] 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 overflow-hidden rounded-2xl bg-card p-5">
|
||||
<div class="flex items-center justify-between">
|
||||
<span class="font-mono text-[11px] uppercase tracking-wider 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="font-mono 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-3 flex items-center justify-between font-mono text-[11px] 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 overflow-hidden rounded-2xl bg-card p-5">
|
||||
<div class="flex items-center justify-between">
|
||||
<span class="font-mono text-[11px] uppercase tracking-wider 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="font-mono 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 font-mono text-[11px] 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 rounded-2xl bg-card p-5">
|
||||
<div class="flex items-center justify-between">
|
||||
<span class="font-mono text-[11px] uppercase tracking-wider 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 font-mono text-2xl tracking-tight">
|
||||
<span data-stat="uptime">—</span>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<article class="rise rise-5 ring-card rounded-2xl bg-card p-5">
|
||||
<div class="flex items-center justify-between">
|
||||
<span class="font-mono text-[11px] uppercase tracking-wider 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 grid-cols-3 gap-2 font-mono text-sm">
|
||||
<div>
|
||||
<dt class="text-[10px] uppercase tracking-wider text-muted-foreground">Worlds</dt>
|
||||
<dd data-stat="worlds" class="mt-1 tabular text-lg text-foreground">—</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt class="text-[10px] uppercase tracking-wider text-muted-foreground">Chunks</dt>
|
||||
<dd data-stat="chunks" class="mt-1 tabular text-lg text-foreground">—</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt class="text-[10px] uppercase tracking-wider text-muted-foreground">Entities</dt>
|
||||
<dd data-stat="entities" class="mt-1 tabular text-lg text-foreground">—</dd>
|
||||
</div>
|
||||
</dl>
|
||||
</article>
|
||||
|
||||
<article class="rise rise-6 ring-card rounded-2xl bg-card p-5">
|
||||
<div class="flex items-center justify-between">
|
||||
<span class="font-mono text-[11px] uppercase tracking-wider 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-3 flex gap-2">
|
||||
<a href="/api/commands/" class="inline-flex items-center gap-1.5 rounded-full bg-muted px-3 py-1 font-mono text-[11px] 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 font-mono text-[11px] 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>
|
||||
|
||||
Reference in New Issue
Block a user