From 894dcd309b66ec1bdf907da883a2c159c9af9e06 Mon Sep 17 00:00:00 2001 From: nexxo Date: Sun, 2 Aug 2026 23:21:24 +0200 Subject: [PATCH] Wortmarke breiter, und die Hostzeile steht wieder auf einer Linie MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Zwei Dinge, die dem Betreiber am fertigen Bild aufgefallen sind. DIE WORTMARKE. Sechs Zellen pro Buchstabe liessen sie hoch und schmal wirken; acht treffen die Proportion. Damit ist die Zeichnung 65 statt 51 Zellen breit, und bei 13px rund 500px — auf dem Schirm eine Wortmarke, kein Etikett. Am Telefon 7px und damit rund 270px, was neben den Raendern hineinpasst. DIE HOSTZEILE. „Online" und „Verbunden" standen 3px versetzt, obwohl beide Zellen gleich hoch sind (18,6px, gemessen). Der Grund: ein `inline-flex` holt sich seine Grundlinie vom ERSTEN Kind. Links ist das ein 8px-Punkt, rechts ein 16px-Icon; beide sitzen in ihrer Zeile mittig, ihre Unterkanten liegen deshalb 4px auseinander, und genau darauf setzt der Browser die Grundlinie der ganzen Zelle. Mit `align-middle` richtet sich der Kasten nach seiner Mitte statt nach dem ersten Kind. Nachgemessen: vorher 361,3 gegen 358,5, jetzt beide 361,6 — Versatz 0px. Beides im Browser gemessen, nicht geschaetzt. 2508 Tests gruen. Co-Authored-By: Claude Opus 5 --- .../livewire/admin/host-terminal.blade.php | 26 ++++++++++--------- .../views/livewire/admin/hosts.blade.php | 12 +++++++-- 2 files changed, 24 insertions(+), 14 deletions(-) diff --git a/resources/views/livewire/admin/host-terminal.blade.php b/resources/views/livewire/admin/host-terminal.blade.php index b78bcb5..c9cc257 100644 --- a/resources/views/livewire/admin/host-terminal.blade.php +++ b/resources/views/livewire/admin/host-terminal.blade.php @@ -78,7 +78,7 @@ Zelle in der zweiten Zeile, unter der in der ersten nichts stand — und der stand als loser Klotz mitten im Wort. Figlet-Schriften sind für echte Terminalschriften gezeichnet und tragen hier nicht. Jeder - Buchstabe ist sechs Zellen breit (das `I` zwei), mit einer Zelle + Buchstabe ist acht Zellen breit (das `I` zwei), mit einer Zelle Abstand, und keine Zelle steht ohne Nachbarn darüber. Nicht von Hand abgezählt, sondern aus einer Buchstabentabelle gesetzt — von Hand hatte ich mich prompt verzählt, und die Buchstaben liefen ineinander. @@ -92,18 +92,20 @@ hatte kaum Kontrast, und eine Wortmarke, die ihre Farbe wechselt, ist ohnehin keine Statuslampe — was los ist, sagt die Zeile darunter. - Zwei Größen: die Zeichnung ist 51 Zellen breit, und eine Zelle ist - gut 0,6 der Schriftgröße. 15px ergeben rund 460px — auf dem Schirm - eine Wortmarke, kein Etikett. Am Telefon sind es 10px und damit gut - 300px, was neben den Rändern noch hineinpasst; bei 15px schöbe sie - die Seite zur Seite. --}} + Acht Zellen pro Buchstabe, nicht sechs: bei sechs standen sie hoch + und schmal da. Acht trifft die Proportion der Wortmarke. + + Zwei Größen: die Zeichnung ist 65 Zellen breit, und eine Zelle ist + gut 0,6 der Schriftgröße. 13px ergeben rund 500px — auf dem Schirm + eine Wortmarke, kein Etikett. Am Telefon sind es 7px und damit rund + 270px, was neben den Rändern noch hineinpasst. --}} + class="select-none font-mono text-[7px] leading-none text-accent sm:text-[13px]" + role="img" aria-label="CluPilot"> ██████ ██ ██ ██ ████████ ██ ██ ██████ ████████ +██ ██ ██ ██ ██ ██ ██ ██ ██ ██ ██ +██ ██ ██ ██ ████████ ██ ██ ██ ██ ██ +██ ██ ██ ██ ██ ██ ██ ██ ██ ██ + ██████ ████████ ██████ ██ ██ ████████ ██████ ██ {{-- aria-live: die Bühne tauscht ihren Text aus, ohne dass die Seite neu lädt. Ohne diesen Hinweis erführe ein Screenreader vom Abbruch diff --git a/resources/views/livewire/admin/hosts.blade.php b/resources/views/livewire/admin/hosts.blade.php index 2044bf0..729d0a8 100644 --- a/resources/views/livewire/admin/hosts.blade.php +++ b/resources/views/livewire/admin/hosts.blade.php @@ -119,13 +119,21 @@ {{ $host->datacenter }} + {{-- `align-middle` an beiden: ein `inline-flex` holt sich seine + Grundlinie vom ERSTEN Kind, und das ist hier links ein + 8px-Punkt und rechts ein 16px-Icon. Beide sitzen in einer + 18,6px hohen Zeile mittig, ihre Unterkanten liegen deshalb + 4px auseinander — und genau so weit standen „Online" und + „Verbunden" versetzt, obwohl beide Zellen gleich hoch sind. + Nachgemessen: 361,3 gegen 358,5; mit `align-middle` beide + 361,6. --}} - + {{ __('hosts.health.'.$health) }} - + @if ($vpnState === 'silent' && $vpnPeer?->last_handshake_at) {{ __('hosts.vpn.silent_since', ['time' => $vpnPeer->last_handshake_at->diffForHumans()]) }}