update: groups

This commit is contained in:
nate 2026-04-10 02:47:16 +04:00
parent 43c3443e3f
commit e376fd64fc
2 changed files with 7 additions and 11 deletions

View File

@ -49,12 +49,7 @@ h1 { font-size: 1.75rem; font-weight: 700; margin: 0 0 0.5rem; }
.group-toggle { display: none; }
.group-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.25rem; cursor: pointer; }
.group-header:hover { background: rgba(255,255,255,0.02); }
.group-header-left { display: flex; align-items: center; gap: 0.75rem; }
.group-chev { color: var(--muted); transition: transform 0.15s; flex-shrink: 0; }
.group-toggle:checked ~ .group-header .group-chev { transform: rotate(90deg); }
.group-name { font-weight: 600; }
.group-header-right { display: flex; align-items: center; gap: 1rem; font-size: 0.85rem; color: var(--muted); }
.group-status { font-weight: 600; }
.group-toggle:checked ~ .group-header .chev { transform: rotate(90deg); }
.group-aggregate { padding: 0 1.25rem 1rem; }
.group-toggle:checked ~ .group-aggregate { display: none; }
.group-body { display: none; padding: 0 0.75rem 0.75rem; }

View File

@ -230,13 +230,14 @@
<div class="group-section">
<input type="checkbox" class="group-toggle" id="g-<%= gi %>">
<label class="group-header" for="g-<%= gi %>">
<div class="group-header-left">
<svg class="group-chev" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
<span class="group-name"><%= groupName %></span>
<div class="monitor-name">
<span class="dot" style="background: <%= groupStatusColor %>;"></span>
<span class="name"><%= groupName %></span>
</div>
<div class="group-header-right">
<div class="monitor-meta">
<span><%= list.length %> monitor<%= list.length === 1 ? '' : 's' %></span>
<span class="uptime-pct <%= uptimeBand(aggPct) %>"><%= fmtUptime(aggPct) %></span>
<span class="group-status" style="color: <%= groupStatusColor %>;"><%= groupStatusLabel %></span>
<svg class="chev" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 18 15 12 9 6"/></svg>
</div>
</label>
<div class="group-aggregate">