30e4bc3a4f
Einheitliche Seitenkoepfe mit Modul-Kachel, Knopf- und Linkklassen statt gelber Schrift, Karten ohne harte Rahmen, Tabellenkoepfe ohne Grossbuchstaben, Marktplatz mit Fluent-Reitern, Filterpillen und Kachel-Karten, Einstellungs-/Verwaltungsnavigation mit Auswahlpille, leere Zustaende mit Symbol im Kreis, Proxmox ohne leuchtende Schatten. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
68 lines
2.1 KiB
TypeScript
68 lines
2.1 KiB
TypeScript
import type { MeterLevel, ServerHealth } from './proxmox-status';
|
|
|
|
/**
|
|
* Tailwind-Klassen je Zustand (quick-260924-h7x). Bewusst als vollstaendige,
|
|
* statische Zeichenketten — Tailwind findet Klassen nur, wenn sie woertlich im
|
|
* Quelltext stehen, zusammengesetzte Namen wie `bg-status-${x}` gingen verloren.
|
|
*
|
|
* `fill` = Flaeche (Leiste, Punkt, Balken), `pill` = Statuspille (12 %
|
|
* Flaeche + Textvariante), `text` = Schrift in Statusfarbe, `shadow` =
|
|
* ruhender Fluent-Schatten (Design „Mosaik“: keine im Statuston
|
|
* leuchtenden Schatten mehr — der Zustand steht in Leiste und Pille).
|
|
*
|
|
* Seit quick-260924-i8v gemeinsam fuer Modulseite und Dashboard-Kachel.
|
|
*/
|
|
export const HEALTH_STYLE: Record<
|
|
ServerHealth,
|
|
{ fill: string; pill: string; text: string; shadow: string }
|
|
> = {
|
|
ok: {
|
|
fill: 'bg-status-ok',
|
|
pill: 'bg-status-ok/12 text-status-ok-fg',
|
|
text: 'text-status-ok-fg',
|
|
shadow: 'shadow-sm',
|
|
},
|
|
warn: {
|
|
fill: 'bg-status-warn',
|
|
pill: 'bg-status-warn/12 text-status-warn-fg',
|
|
text: 'text-status-warn-fg',
|
|
shadow: 'shadow-sm',
|
|
},
|
|
down: {
|
|
fill: 'bg-status-down',
|
|
pill: 'bg-status-down/12 text-status-down-fg',
|
|
text: 'text-status-down-fg',
|
|
shadow: 'shadow-sm',
|
|
},
|
|
idle: {
|
|
fill: 'bg-status-idle',
|
|
pill: 'bg-status-idle/12 text-status-idle-fg',
|
|
text: 'text-status-idle-fg',
|
|
shadow: 'shadow-sm',
|
|
},
|
|
orphan: {
|
|
fill: 'bg-status-orphan',
|
|
pill: 'bg-status-orphan/12 text-status-orphan-fg',
|
|
text: 'text-status-orphan-fg',
|
|
shadow: 'shadow-sm',
|
|
},
|
|
};
|
|
|
|
/** Balkenfarbe je Stufe; `unknown` wird schraffiert gezeichnet (siehe Meter). */
|
|
export const METER_FILL: Record<Exclude<MeterLevel, 'unknown'>, string> = {
|
|
ok: 'bg-status-ok',
|
|
warn: 'bg-status-warn',
|
|
crit: 'bg-status-down',
|
|
};
|
|
|
|
/** Schriftfarbe der Prozentzahl je Stufe. */
|
|
export const METER_TEXT: Record<MeterLevel, string> = {
|
|
ok: 'text-foreground',
|
|
warn: 'text-status-warn-fg',
|
|
crit: 'text-status-down-fg',
|
|
unknown: 'text-muted-foreground',
|
|
};
|
|
|
|
/** Eingelassenes Messfeld („Well“). */
|
|
export const WELL = 'rounded-lg bg-well';
|