schalli/tessera-ctl
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 14 Wiki Activity

fix(260924-h7x): verwaiste Karte daempft nur Symbol und Name

Browse Source 
Gedaempfte muted-Schrift fiele auf 2,75:1 (hell) bzw. 3,0:1 (dunkel),
gemessen; Produktname, Adresse und Fussangabe bleiben deshalb voll lesbar.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
This commit is contained in:
Schalli
2026-09-24 12:38:55 +02:00
parent 7416a925a6
commit 0b659d67e8
2 changed files with 12 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/app/(portal)/modules/proxmox/components/ServerCard.test.tsx
+3
View File
@@ -427,6 +427,9 @@ describe('ServerCard — offline & verwaist', () => {
expect(el).toHaveAttribute('data-health', 'orphan');
expect(el).toHaveClass('border-dashed');
// gedaempft wird nur der Name (Vordergrundfarbe haelt 7,5:1), die Adresse bleibt lesbar
expect(within(el).getByText('pve-1')).toHaveClass('opacity-70', 'saturate-50');
expect(within(el).getByText('https://pve.intern')).not.toHaveClass('opacity-70');
expect(within(el).getByTestId('status-pill')).toHaveTextContent('Offline & verwaist');
expect(
within(el).getByText('Dieser Server ist deaktiviert und wird nicht mehr abgefragt.'),
apps/web/src/app/(portal)/modules/proxmox/components/ServerCard.tsx
+9 -6
View File
@@ -438,8 +438,11 @@ export function ServerCard({ server, isAdmin = false, now = Date.now() }: Server
);
}
// Gedaempft wird bei „verwaist“ nur, was zum Server gehoert (Symbol, Name,
// Adresse, Fussangabe) — Pille und Hinweistext bleiben voll lesbar.
// Gedaempft (`opacity-70 saturate-50`) wird bei „verwaist“ nur Symbol und
// Name. Gedaempfte Schrift in `muted-foreground` fiele auf 2,75:1 (hell)
// bzw. 3,0:1 (dunkel) — gemessen — und damit unter 4,5:1; Produktname,
// Adresse, Fussangabe, Pille und Hinweistext bleiben deshalb voll lesbar.
// Der Name in Vordergrundfarbe haelt gedaempft noch 7,5:1 bzw. 7,1:1.
const dim = isOrphan ? 'opacity-70 saturate-50' : '';
return (
@@ -455,14 +458,14 @@ export function ServerCard({ server, isAdmin = false, now = Date.now() }: Server
<div className="flex flex-1 flex-col gap-4 py-4 pl-5 pr-4">
<div className="flex items-start justify-between gap-3">
<div className={`flex min-w-0 items-start gap-3 ${dim}`}>
<div className="flex min-w-0 items-start gap-3">
<div
className={`${WELL} flex h-8 w-8 shrink-0 items-center justify-center text-muted-foreground`}
className={`${WELL} flex h-8 w-8 shrink-0 items-center justify-center text-muted-foreground ${dim}`}
>
<ProductIcon productType={server.productType} />
</div>
<div className="min-w-0">
<div className="truncate font-semibold leading-tight" title={server.name}>
<div className={`truncate font-semibold leading-tight ${dim}`} title={server.name}>
{server.name}
</div>
<div className="mt-0.5 text-xs text-muted-foreground">
@@ -481,7 +484,7 @@ export function ServerCard({ server, isAdmin = false, now = Date.now() }: Server
{polledAge && (
<div
data-testid="last-polled"
className={`mt-auto border-t border-border/60 pt-3 text-xs text-muted-foreground ${dim}`}
className="mt-auto border-t border-border/60 pt-3 text-xs text-muted-foreground"
title={exactTime(status?.lastPolledAt, locale)}
>
{t('card.lastPolledAgo', { age: polledAge })}