D0 Part 2: design system v2 — tokens, meter/tag/metarow, funcmap remap, dashboard + stacks

- style.css: navy token palette (--bg-0/1/2, --line, --text-1/2/3, --blue,
  --warn, --crit), single 2px radius, all box-shadows and the bg grid
  overlay removed, fonts via --font-ui/--font-data.
- Components: .meter (3px hairline track, blue nominal fill, neutral
  70/85 ticks, warn/crit flag), .tag (square 2px state chip + dot, pulse
  on progress, reduced-motion respected), .metarow (icon + text, no
  container), .panel/.list/.section-h primitives, boxless .stats with
  hairline dividers, buttons 2px (danger = crit outline).
- funcmap: stateColor -> run/progress/warn/neutral/off (stopped is
  neutral, NOT red — operator-approved exception-color change),
  usageColor/tempColor -> nominal/warn/crit (thresholds unchanged);
  stateLabel Hungarian copy untouched (guarded by test).
- layout.html: sprite nav icons (layout-grid/cloud/shield/cpu/wrench/
  settings), alert banner emoji -> triangle-alert/info icons.
- dashboard.html: meters with disk warn/crit flags (Fogyóban a hely /
  Kritikusan kevés hely), boxless stats (Leállítva 0 muted, >0 amber),
  single-panel stack list with 2px state edges, tags instead of badges,
  icon action buttons.
- stacks.html: state tag + metarow rows; catalog keeps its grid.
- setup minimalCSS retokened to v2 (drops GitHub-dark hexes).
- Tests: §8 truth tables for stateColor/usageColor/tempColor +
  stateLabel byte-identity guard (red-proven vs pre-change funcmap:
  stopped->red and 0->green failed as required).
This commit is contained in:
2026-07-02 14:22:27 +02:00
parent b073cc474d
commit 5dc277f2b1
7 changed files with 1036 additions and 871 deletions
+12 -12
View File
@@ -31,27 +31,27 @@
{{$subdomain}}.{{$.Domain}} ↗
</a>
{{if and .Deployed (routeUnpublished .State)}}
<span class="route-unpublished" title="A proxy (Traefik) csak egészséges konténerhez publikál nyilvános útvonalat. Amíg az alkalmazás nem egészséges, az URL nem érhető el (404), pedig a konténer fut."> URL nem elérhető útvonal nincs publikálva</span>
<span class="route-unpublished" title="A proxy (Traefik) csak egészséges konténerhez publikál nyilvános útvonalat. Amíg az alkalmazás nem egészséges, az URL nem érhető el (404), pedig a konténer fut."><svg class="ico ico-sm"><use href="#i-triangle-alert"/></svg> URL nem elérhető útvonal nincs publikálva</span>
{{end}}
{{end}}
</div>
</div>
<span class="stack-state-badge state-{{stateColor .State}}">{{stateLabel .State}}</span>
{{if .Orphaned}}<span class="badge badge-orphaned">Elavult</span>{{end}}
{{$ms := index $.MissingStorage .Name}}{{if $ms}}<span class="badge badge-missing-storage" title="Az alkalmazás adattárolója nem elérhető. Csatlakoztasd újra a meghajtót, vagy helyezd át az adatokat.">Hiányzó tárhely: {{$ms}}</span>{{end}}
{{$nw := index $.NetworkWarnings .Name}}{{if $nw}}<span class="badge badge-warn" title="A hálózati tárhely (NAS) jelenleg nem érhető el. Az alkalmazás fut; az adatok elérése a NAS visszatértével helyreáll.">Hálózati tárhely nem elérhető: {{$nw}}</span>{{end}}
<span class="tag tag-{{stateColor .State}}"><span class="dot"></span>{{stateLabel .State}}</span>
{{if .Orphaned}}<span class="tag tag-warn">Elavult</span>{{end}}
{{$ms := index $.MissingStorage .Name}}{{if $ms}}<span class="tag tag-warn" title="Az alkalmazás adattárolója nem elérhető. Csatlakoztasd újra a meghajtót, vagy helyezd át az adatokat."><svg class="ico ico-sm"><use href="#i-triangle-alert"/></svg>Hiányzó tárhely: {{$ms}}</span>{{end}}
{{$nw := index $.NetworkWarnings .Name}}{{if $nw}}<span class="tag tag-warn" title="A hálózati tárhely (NAS) jelenleg nem érhető el. Az alkalmazás fut; az adatok elérése a NAS visszatértével helyreáll."><svg class="ico ico-sm"><use href="#i-triangle-alert"/></svg>Hálózati tárhely nem elérhető: {{$nw}}</span>{{end}}
</div>
{{if .Meta.Description}}
<p class="stack-detail-desc">{{.Meta.Description}}</p>
{{end}}
<div class="stack-meta-badges">
{{if .Meta.Resources.MemRequest}}<span class="meta-badge">~{{.Meta.Resources.MemRequest}}</span>{{end}}
{{if .Meta.Resources.PiCompatible}}<span class="meta-badge meta-badge-ok">Pi kompatibilis</span>{{end}}
{{if .Meta.Resources.NeedsHDD}}<span class="meta-badge">HDD szükséges</span>{{end}}
{{if .Meta.Resources.HungarianUI}}<span class="meta-badge meta-badge-ok">Magyar felület</span>{{end}}
{{if and .Deployed (index $.StorageLabels .Name)}}<span class="meta-badge meta-badge-storage" title="Adattároló: {{index $.StorageLabels .Name}}">💾 {{index $.StorageLabels .Name}}</span>{{end}}
<div class="metarows">
{{if .Meta.Resources.MemRequest}}<span class="metarow"><svg class="ico"><use href="#i-memory-stick"/></svg><span class="mono">~{{.Meta.Resources.MemRequest}}</span></span>{{end}}
{{if .Meta.Resources.PiCompatible}}<span class="metarow"><svg class="ico"><use href="#i-check"/></svg>Pi kompatibilis</span>{{end}}
{{if .Meta.Resources.NeedsHDD}}<span class="metarow"><svg class="ico"><use href="#i-hard-drive"/></svg>HDD szükséges</span>{{end}}
{{if .Meta.Resources.HungarianUI}}<span class="metarow"><svg class="ico"><use href="#i-check"/></svg>Magyar felület</span>{{end}}
{{if and .Deployed (index $.StorageLabels .Name)}}<span class="metarow" title="Adattároló: {{index $.StorageLabels .Name}}"><svg class="ico"><use href="#i-hard-drive"/></svg>{{index $.StorageLabels .Name}}</span>{{end}}
</div>
{{if .Containers}}
@@ -67,7 +67,7 @@
<div class="stack-detail-actions">
{{if .Protected}}
<span class="badge badge-protected">Védett rendszerkomponens</span>
<span class="tag"><svg class="ico ico-sm"><use href="#i-lock"/></svg>Védett rendszerkomponens</span>
{{if isOperational .State}}
<button class="btn btn-warning" onclick="stackAction(event, '{{.Name}}', 'restart')">Újraindítás</button>
{{end}}