27 lines
1.4 KiB
PHP
27 lines
1.4 KiB
PHP
@props(['name', 'ip', 'status' => 'online', 'cpu' => 0, 'mem' => 0, 'os' => null])
|
|
@php
|
|
$label = ['online' => 'Online', 'warning' => 'Warnung', 'offline' => 'Offline'][$status] ?? ucfirst($status);
|
|
@endphp
|
|
<a href="#" class="flex items-center gap-3 rounded-md border border-line bg-inset px-3 py-2.5 transition-colors hover:border-line-strong">
|
|
<x-status-dot :status="$status" :ping="$status === 'online'" />
|
|
<div class="min-w-0 flex-1">
|
|
<p class="truncate text-sm text-ink">{{ $name }}</p>
|
|
<p class="truncate font-mono text-[11px] text-ink-3">{{ $ip }}@if ($os) · {{ $os }}@endif</p>
|
|
</div>
|
|
<div class="hidden shrink-0 items-center gap-4 sm:flex">
|
|
<div class="w-16">
|
|
<p class="font-mono text-[10px] uppercase text-ink-4">CPU</p>
|
|
<div class="mt-1 h-1 w-full overflow-hidden rounded-full bg-line">
|
|
<div class="h-full rounded-full bg-accent" style="width: {{ $cpu }}%"></div>
|
|
</div>
|
|
</div>
|
|
<div class="w-16">
|
|
<p class="font-mono text-[10px] uppercase text-ink-4">RAM</p>
|
|
<div class="mt-1 h-1 w-full overflow-hidden rounded-full bg-line">
|
|
<div class="h-full rounded-full bg-cyan" style="width: {{ $mem }}%"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<x-status-pill :status="$status" class="shrink-0">{{ $label }}</x-status-pill>
|
|
</a>
|