diff --git a/plugins/docker/templates/docker/widget_resources.html b/plugins/docker/templates/docker/widget_resources.html index fa086c7..970f92e 100644 --- a/plugins/docker/templates/docker/widget_resources.html +++ b/plugins/docker/templates/docker/widget_resources.html @@ -23,7 +23,8 @@ - + + {% for r in rows %} {% set u = r.usage %} @@ -35,16 +36,16 @@ {% endfor %}
ContainerHostCPUMemory
CPU · last {{ hours }}hMemory · last {{ hours }}h
{{- bars(r.cpu_bars, (cores(r.cpu_bars.peak) ~ " cores") if r.cpu_bars.peak is not none else "", cores(r.cpu_bars.roof) ~ " cores") -}} - {%- if u.cores is none %}—{% else %}{{ cores(u.cores) }} cores{% endif -%} + {% if u.cores is none %}—{% else %}{{ cores(u.cores) }} cores{% endif %} {{- bars(r.mem_bars, r.mem_bars.peak|bytes if r.mem_bars.peak is not none else "", r.mem_bars.roof|bytes) -}} - {%- if u.mem_bytes is none %}—{% else %}{{ u.mem_bytes|bytes }}{% endif -%} + {% if u.mem_bytes is none %}—{% else %}{{ u.mem_bytes|bytes }}{% endif %}
-
Bars: last {{ hours }}h, each row up to its own peak, at least {{ cores(cpu_floor) }} core{{ 's' if cpu_floor != 1 }} and {{ mem_floor|bytes }}.
+
Bars: {{ (hours * 60 // 24) }}-minute slices, oldest left; each row up to its own peak, at least {{ cores(cpu_floor) }} core{{ 's' if cpu_floor != 1 }} and {{ mem_floor|bytes }}.
{% endif %} diff --git a/steward/static/steward.css b/steward/static/steward.css index 08f1fe8..ab4077d 100644 --- a/steward/static/steward.css +++ b/steward/static/steward.css @@ -406,7 +406,7 @@ body.dash-editing .widget-drawer { transform:translateY(0); } .w-item .w-label a { color:inherit; text-decoration:none; } .w-item .w-meta { flex-shrink:0; font-size:0.72rem; color:var(--text-muted); font-variant-numeric:tabular-nums; } .w-note { font-size:0.7rem; color:var(--text-dim); margin-top:0.3rem; } -.w-table col.w-barcol { width:9.5rem; } +.w-table col.w-barcol { width:10.2rem; } /* Bars of a figure's recent past, inline before it (Busiest Containers, #5214): the row's tone, faint, with the newest bar solid. A gap is a slice with no samples. Heights are set per bar as a % of the row's roof. */ @@ -414,6 +414,8 @@ body.dash-editing .widget-drawer { transform:translateY(0); } .w-bars i { flex:1; min-height:1px; background:currentColor; opacity:0.4; border-radius:1px 1px 0 0; } .w-bars i:last-child { opacity:1; } .w-bars i.gap { background:none; } +/* The figure after a row of bars takes a fixed width, so the bars line up down the column whatever the figure's length. */ +.w-fig { display:inline-block; min-width:4.9rem; text-align:right; } @container (max-width: 26rem) { .w-wide-only { display:none; } .w-table col.w-barcol { width:5.5rem; } }