82 lines
4.8 KiB
PHP
82 lines
4.8 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="csrf-token" content="{{ csrf_token() }}">
|
|
<title>{{ $title ?? 'Clusev' }}</title>
|
|
@vite(['resources/css/app.css', 'resources/js/app.js'])
|
|
@livewireStyles
|
|
</head>
|
|
<body class="min-h-screen bg-void font-sans text-ink antialiased selection:bg-accent/25">
|
|
<div class="grid min-h-screen lg:grid-cols-[1.05fr_0.95fr]">
|
|
{{-- Brand panel — hidden below lg --}}
|
|
<aside class="relative hidden overflow-hidden border-r border-line bg-base p-10 lg:flex lg:flex-col lg:justify-between xl:p-12">
|
|
{{-- atmospheric glow mesh --}}
|
|
<div class="pointer-events-none absolute -left-28 -top-28 h-96 w-96 rounded-full bg-accent/10 blur-3xl" aria-hidden="true"></div>
|
|
<div class="pointer-events-none absolute -bottom-32 -right-24 h-96 w-96 rounded-full bg-cyan/[0.07] blur-3xl" aria-hidden="true"></div>
|
|
|
|
{{-- top: wordmark --}}
|
|
<div class="relative z-10 flex items-center gap-2.5">
|
|
<span class="grid h-9 w-9 place-items-center rounded-md border border-accent/25 bg-accent/10 text-accent shadow-[0_0_18px_-2px_var(--color-accent)]">
|
|
<x-icon name="server" class="h-5 w-5" />
|
|
</span>
|
|
<span class="font-display text-xl font-semibold tracking-wide text-ink">Clus<span class="text-accent">e</span>v</span>
|
|
</div>
|
|
|
|
{{-- middle: headline + faux terminal --}}
|
|
<div class="relative z-10 flex max-w-md flex-col gap-7">
|
|
<div class="space-y-3">
|
|
<h1 class="text-balance font-display text-4xl font-bold leading-[1.12] tracking-tight text-ink">
|
|
Eine Konsole für deine <span class="text-accent">gesamte Flotte</span>.
|
|
</h1>
|
|
<p class="max-w-sm text-sm leading-relaxed text-ink-2">
|
|
Agentenlos über SSH. Metriken, Dienste, Dateien und ein lückenloses Audit-Log — sicher aus einem Panel gesteuert.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="overflow-hidden rounded-lg border border-line bg-inset shadow-panel">
|
|
<div class="flex items-center gap-2 border-b border-line bg-raised px-3 py-2.5">
|
|
<span class="flex gap-1.5">
|
|
<span class="h-2 w-2 rounded-full bg-offline/50"></span>
|
|
<span class="h-2 w-2 rounded-full bg-warning/50"></span>
|
|
<span class="h-2 w-2 rounded-full bg-online/50"></span>
|
|
</span>
|
|
<span class="font-mono text-[10px] text-ink-4">ssh · control-plane</span>
|
|
</div>
|
|
<div class="space-y-1.5 p-4 font-mono text-xs leading-relaxed">
|
|
<p class="text-ink-2"><span class="text-ink-4">$</span> clusev connect <span class="text-accent-text">10.10.90.0/24</span></p>
|
|
<p class="text-online">24 Hosts erreichbar · Host-Keys gepinnt</p>
|
|
<p class="text-ink-2"><span class="text-ink-4">$</span> fleet status <span class="text-accent-text">--live</span></p>
|
|
<p class="text-ink-3">cpu 31% · mem 48% · load 0.86 · 0 Alarme</p>
|
|
<p class="flex items-center text-ink-2"><span class="text-ink-4">$</span><span class="ml-2 inline-block h-3.5 w-[7px] animate-pulse bg-accent"></span></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{{-- bottom: copyright + status --}}
|
|
<div class="relative z-10 flex items-center justify-between gap-4 font-mono text-[11px] text-ink-4">
|
|
<span>© {{ date('Y') }} Clusev · Fleet Control</span>
|
|
<span class="inline-flex items-center gap-1.5"><span class="h-1.5 w-1.5 rounded-full bg-online"></span> betriebsbereit</span>
|
|
</div>
|
|
</aside>
|
|
|
|
{{-- Form panel --}}
|
|
<main class="relative flex items-center justify-center px-5 py-10 sm:px-8">
|
|
<div class="w-full max-w-sm">
|
|
{{-- wordmark for small screens (brand panel hidden) --}}
|
|
<div class="mb-8 flex items-center gap-2.5 lg:hidden">
|
|
<span class="grid h-9 w-9 place-items-center rounded-md border border-accent/25 bg-accent/10 text-accent shadow-[0_0_18px_-2px_var(--color-accent)]">
|
|
<x-icon name="server" class="h-5 w-5" />
|
|
</span>
|
|
<span class="font-display text-xl font-semibold tracking-wide text-ink">Clus<span class="text-accent">e</span>v</span>
|
|
</div>
|
|
|
|
{{ $slot }}
|
|
</div>
|
|
</main>
|
|
</div>
|
|
@livewireScripts
|
|
</body>
|
|
</html>
|