D4 Part 2: hub style.css v2 + template sweep
- style.css: slate tokens -> the canonical navy block + @font-face (self-hosted, latin-ext for Hungarian customer names); single 2px radius; hairline table rows (--line-soft dividers, density kept); status classes re-expressed per the design-system addendum: .status-badge = outline tag + CSS ::before dot keyed by the raw status the templates emit (ok=blue, warn/blocked/stale=amber, down/fail=red, pending/disabled=quiet neutral); .status-dot = class-based 8px dot; severity badges stay filled amber/red (exceptions stay loud); config badges = filled informational chips in v2 colors; row tint only for warn/down (warn-dim/crit-dim). - Two-tone brand heading on all 8 'Felhom Hub' pages (<h1>Felhom <span>Hub</span></h1>, span = blue-bright). - app_detail chart retinted: avg #2EA8F5 (primary data), peak #8E7CE8 (secondary DATA series — not status red), catalog-limit line #E0A93E (threshold marker); legend/tick/grid -> v2 literals. - customer_unified: JS status-message colors (success -> blue-bright, error -> crit), all inline slate hexes -> tokens. - Login page inline HTML retinted (#0088cc -> #0083D8). - Grep gate: every slate hex (#0f172a #1e293b #334155 #60a5fa #4ade80 #facc15 #f87171 #94a3b8 #64748b #475569 #e2e8f0) at ZERO across hub/internal/web (non-test); statusIcon 0; inline statusColor style 0. go build/vet/test green; api/ + store/ untouched.
This commit is contained in:
@@ -11,7 +11,7 @@
|
||||
{{template "icon_sprite"}}
|
||||
<div class="container">
|
||||
<header>
|
||||
<h1>Felhom Hub</h1>
|
||||
<h1>Felhom <span>Hub</span></h1>
|
||||
<nav class="nav-links">
|
||||
<a href="/" class="nav-link">Dashboard</a>
|
||||
<a href="/configs" class="nav-link">Customers</a>
|
||||
@@ -108,8 +108,8 @@
|
||||
{
|
||||
label: 'Avg Memory (MB)',
|
||||
data: chartData.avg_memory,
|
||||
borderColor: '#60a5fa',
|
||||
backgroundColor: 'rgba(96,165,250,0.1)',
|
||||
borderColor: '#2EA8F5',
|
||||
backgroundColor: 'rgba(46,168,245,0.1)',
|
||||
fill: true,
|
||||
tension: 0.3,
|
||||
pointRadius: 2
|
||||
@@ -117,7 +117,7 @@
|
||||
{
|
||||
label: 'Peak Memory (MB)',
|
||||
data: chartData.peak_memory,
|
||||
borderColor: '#f87171',
|
||||
borderColor: '#8E7CE8',
|
||||
backgroundColor: 'transparent',
|
||||
fill: false,
|
||||
tension: 0.3,
|
||||
@@ -129,7 +129,7 @@
|
||||
datasets.push({
|
||||
label: 'Catalog Limit',
|
||||
data: chartData.labels.map(function() { return chartData.catalog_limit; }),
|
||||
borderColor: '#4ade80',
|
||||
borderColor: '#E0A93E',
|
||||
backgroundColor: 'transparent',
|
||||
fill: false,
|
||||
pointRadius: 0,
|
||||
@@ -144,11 +144,11 @@
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
plugins: {
|
||||
legend: { labels: { color: '#94a3b8', font: { size: 11 } } }
|
||||
legend: { labels: { color: '#94A6BF', font: { size: 11 } } }
|
||||
},
|
||||
scales: {
|
||||
x: { ticks: { color: '#64748b', font: { size: 10 }, maxTicksLimit: 10 }, grid: { color: 'rgba(100,116,139,0.15)' } },
|
||||
y: { ticks: { color: '#64748b', font: { size: 10 } }, grid: { color: 'rgba(100,116,139,0.15)' }, title: { display: true, text: 'MB', color: '#64748b' } }
|
||||
x: { ticks: { color: '#5E7392', font: { size: 10 }, maxTicksLimit: 10 }, grid: { color: 'rgba(34,52,79,.5)' } },
|
||||
y: { ticks: { color: '#5E7392', font: { size: 10 } }, grid: { color: 'rgba(34,52,79,.5)' }, title: { display: true, text: 'MB', color: '#5E7392' } }
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user