aboutsummaryrefslogtreecommitdiff
path: root/docs/prototypes/2026-07-07-maint-console-E-instrument-dashboard.html
diff options
context:
space:
mode:
Diffstat (limited to 'docs/prototypes/2026-07-07-maint-console-E-instrument-dashboard.html')
-rw-r--r--docs/prototypes/2026-07-07-maint-console-E-instrument-dashboard.html475
1 files changed, 475 insertions, 0 deletions
diff --git a/docs/prototypes/2026-07-07-maint-console-E-instrument-dashboard.html b/docs/prototypes/2026-07-07-maint-console-E-instrument-dashboard.html
new file mode 100644
index 0000000..52ecfad
--- /dev/null
+++ b/docs/prototypes/2026-07-07-maint-console-E-instrument-dashboard.html
@@ -0,0 +1,475 @@
+<meta charset="utf-8">
+<title>MAINT · ratio — Approach E · Instrument Dashboard</title>
+<style>
+ :root{
+ --page:#0a0c0d; --surface:#100f0f; --inset:#0a0c0d;
+ --gold:#dab53d; --silver:#bfc4d0; --dim:#7c838a; --cream:#f3e7c5;
+ --slate:#424f5e; --slate-hi:#54677d; --line:#2c2f32;
+ --olive:#74932f; --amber:#dab53d; --terra:#cb6b4d;
+ --font:"BerkeleyMono Nerd Font", ui-monospace, monospace;
+ }
+ *{box-sizing:border-box}
+ html,body{margin:0;background:var(--page);}
+ body{
+ font-family:var(--font); color:var(--silver);
+ display:flex; justify-content:center; padding:26px 14px 60px;
+ -webkit-font-smoothing:antialiased;
+ }
+ .console{
+ width:1050px; max-width:100%;
+ background:var(--surface);
+ border:1px solid var(--gold); border-radius:16px;
+ padding:18px;
+ }
+
+ /* ---- header ---- */
+ .head{display:flex; align-items:baseline; justify-content:space-between; gap:16px;}
+ .head .title{font-size:19px; color:var(--cream); letter-spacing:.5px;}
+ .head .title b{color:var(--gold); font-weight:700;}
+ .verdict{font-size:15px; color:var(--olive); font-weight:700; white-space:nowrap;}
+ .sub{color:var(--dim); font-size:12px; margin-top:2px; letter-spacing:.4px;}
+
+ /* ---- top action bar ---- */
+ .actionbar{
+ display:flex; align-items:center; gap:10px;
+ margin:14px 0 16px; padding:10px 12px;
+ background:var(--inset); border:1px solid var(--line); border-radius:10px;
+ }
+ .actionbar .lbl{color:var(--dim); font-size:11.5px; letter-spacing:.5px; text-transform:uppercase; margin-right:2px;}
+ .btn{
+ font-family:var(--font); cursor:pointer;
+ background:var(--slate); color:var(--cream);
+ border:none; border-radius:10px; padding:7px 14px; font-size:13px;
+ }
+ .btn:hover{background:var(--slate-hi);}
+ .btn.lever{padding:3px 9px; font-size:11px; border-radius:8px;}
+ .actionbar .spacer{flex:1;}
+ .legend{color:var(--dim); font-size:11px; line-height:1.5;}
+ .legend b{color:var(--silver); font-weight:400;}
+
+ /* ---- grid ---- */
+ .cluster{display:grid; grid-template-columns:repeat(12,1fr); gap:10px;}
+ .card{
+ background:var(--inset); border:1px solid var(--line); border-radius:10px;
+ padding:11px 12px 12px; position:relative; min-height:96px;
+ display:flex; flex-direction:column;
+ }
+ .card .lever{position:absolute; top:9px; right:9px;}
+ .card .cap{
+ color:var(--dim); font-size:10.5px; letter-spacing:.6px;
+ text-transform:uppercase; margin-bottom:8px; padding-right:56px;
+ }
+ .card .big{color:var(--cream); font-size:23px; line-height:1; font-weight:700;}
+ .card .unit{color:var(--dim); font-size:12px; font-weight:400;}
+ .card .note{color:var(--dim); font-size:11px; margin-top:6px;}
+
+ /* domain band label */
+ .band{
+ grid-column:1/-1; color:var(--gold); font-weight:700; font-size:12px;
+ letter-spacing:1.2px; text-transform:uppercase; margin:6px 2px 0;
+ display:flex; align-items:center; gap:10px;
+ }
+ .band::after{content:""; flex:1; height:1px; background:var(--line);}
+
+ /* span helpers */
+ .s3{grid-column:span 3;} .s4{grid-column:span 4;}
+ .s5{grid-column:span 5;} .s6{grid-column:span 6;}
+ .s7{grid-column:span 7;} .s8{grid-column:span 8;}
+ .s9{grid-column:span 9;} .s12{grid-column:span 12;}
+
+ /* ---- horizontal capacity meter ---- */
+ .meter{margin-top:auto;}
+ .meter .track{
+ position:relative; height:14px; background:#07090a;
+ border:1px solid var(--line); border-radius:7px; overflow:hidden;
+ }
+ .meter .fill{height:100%; border-radius:6px 0 0 6px;}
+ .fill.ok{background:linear-gradient(90deg,#5c7626,#74932f);}
+ .fill.warn{background:linear-gradient(90deg,#a98a2c,#dab53d);}
+ .fill.fail{background:linear-gradient(90deg,#a8543b,#cb6b4d);}
+ .meter .tick{position:absolute; top:-2px; bottom:-2px; width:2px; background:var(--gold);}
+ .meter .zone{position:absolute; top:0; bottom:0; opacity:.16;}
+ .zone.amber{background:var(--amber);} .zone.terra{background:var(--terra);}
+ .meter .scale{display:flex; justify-content:space-between; color:var(--dim); font-size:9.5px; margin-top:4px;}
+
+ /* ---- lamps ---- */
+ .lamp{display:inline-block; width:1em; text-align:center;}
+ .l-ok{color:var(--olive);} .l-warn{color:var(--amber);}
+ .l-fail{color:var(--terra);} .l-off{color:var(--dim);} .l-prog{color:var(--amber);}
+
+ /* ---- lamp board ---- */
+ .lampboard{
+ grid-column:1/-1; background:var(--inset); border:1px solid var(--line);
+ border-radius:10px; padding:12px 14px;
+ display:grid; grid-template-columns:repeat(4,1fr); gap:7px 18px;
+ }
+ .lampboard .row{display:flex; align-items:center; gap:8px; font-size:12px;}
+ .lampboard .row .nm{color:var(--silver);}
+ .lampboard .row .vv{color:var(--dim); margin-left:auto; font-size:11px;}
+
+ /* ---- counter tile ---- */
+ .tile .row{display:flex; align-items:center; gap:8px;}
+ .tile .big{font-size:26px;}
+
+ /* ---- updates quarantine ---- */
+ .updates{
+ grid-column:1/-1; border:1px solid var(--amber);
+ background:linear-gradient(180deg,#141210,#0a0c0d);
+ border-radius:10px; padding:13px 16px;
+ display:flex; align-items:center; gap:26px; flex-wrap:wrap;
+ }
+ .updates .q{
+ color:var(--amber); font-size:10.5px; letter-spacing:1.5px;
+ text-transform:uppercase; border:1px solid var(--amber);
+ padding:3px 8px; border-radius:6px; align-self:flex-start;
+ }
+ .updates .metric{display:flex; flex-direction:column; gap:2px;}
+ .updates .metric .n{font-size:30px; color:var(--cream); font-weight:700; line-height:1;}
+ .updates .metric .n.cve{color:var(--terra);}
+ .updates .metric .k{color:var(--dim); font-size:10.5px; text-transform:uppercase; letter-spacing:.6px;}
+ .updates .spacer{flex:1;}
+
+ /* ---- svg arc/dial labels ---- */
+ .gaugewrap{display:flex; gap:14px; margin-top:2px;}
+ .gauge{display:flex; flex-direction:column; align-items:center; gap:3px;}
+ .gauge .rd{color:var(--cream); font-size:13px; font-weight:700;}
+ .gauge .lb{color:var(--dim); font-size:10px;}
+ .dialwrap{display:flex; justify-content:center; margin-top:2px;}
+
+ /* ---- output wall ---- */
+ .wall{
+ margin-top:16px; background:var(--inset);
+ border:1px solid var(--line); border-radius:10px; padding:13px 15px;
+ }
+ .wall .wh{
+ display:flex; align-items:center; justify-content:space-between;
+ color:var(--cream); font-size:13px; letter-spacing:.5px; margin-bottom:10px;
+ }
+ .wall .wh .l{color:var(--gold);}
+ .wall .stream{font-size:12.5px; line-height:1.85;}
+ .wall .stream .ln{display:flex; gap:9px; align-items:baseline;}
+ .wall .stream .msg{color:var(--silver);}
+ .wall .stream .meta{color:var(--dim);}
+ .wall .stream .queued .msg{color:var(--dim);}
+ .wall .wfoot{margin-top:11px; display:flex; justify-content:flex-end;}
+
+ @keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
+ .spin{animation:pulse 1.1s ease-in-out infinite;}
+</style>
+
+<div class="console">
+
+ <!-- HEADER -->
+ <div class="head">
+ <div>
+ <div class="title">MAINT · <b>ratio</b></div>
+ <div class="sub">Approach E — Instrument dashboard</div>
+ </div>
+ <div class="verdict"><span class="lamp l-ok">●</span> healthy</div>
+ </div>
+
+ <!-- ACTION BAR -->
+ <div class="actionbar">
+ <span class="lbl">Doctor</span>
+ <button class="btn">Clean up</button>
+ <button class="btn">Review &amp; fix</button>
+ <span class="spacer"></span>
+ <span class="legend">
+ <b>Auto</b> unattended · <b>Confirm</b> preview+click · <b>Human</b> you act · <b>Workflow</b> escalate · <b>None</b> diagnostic
+ </span>
+ </div>
+
+ <!-- CLUSTER -->
+ <div class="cluster">
+
+ <!-- STORAGE & FILESYSTEM -->
+ <div class="band">Storage &amp; Filesystem</div>
+
+ <div class="card s4">
+ <div class="cap">Disk usage</div>
+ <div class="big">69<span class="unit">%</span></div>
+ <div class="note">root · btrfs</div>
+ <div class="meter">
+ <div class="track">
+ <div class="zone amber" style="left:80%;right:10%"></div>
+ <div class="zone terra" style="left:90%;right:0"></div>
+ <div class="fill ok" style="width:69%"></div>
+ </div>
+ <div class="scale"><span>0</span><span>80</span><span>90</span><span>100%</span></div>
+ </div>
+ </div>
+
+ <div class="card s4">
+ <button class="btn lever">Clean</button>
+ <div class="cap">Package cache <span class="lamp l-warn">●</span></div>
+ <div class="big">8.8<span class="unit"> GB</span></div>
+ <div class="note">Auto · threshold ~10 GB</div>
+ <div class="meter">
+ <div class="track">
+ <div class="tick" style="left:88%"></div>
+ <div class="fill warn" style="width:88%"></div>
+ </div>
+ <div class="scale"><span>0</span><span>threshold 10 GB</span></div>
+ </div>
+ </div>
+
+ <div class="card s4">
+ <button class="btn lever">Deep trim</button>
+ <div class="cap">Deep-trim keep-3 <span class="lamp l-ok">●</span></div>
+ <div class="big">keep 3</div>
+ <div class="note">Confirm · retain 3 versions</div>
+ <div class="meter">
+ <div class="track"><div class="fill ok" style="width:100%"></div></div>
+ <div class="scale"><span>staged &amp; ready</span></div>
+ </div>
+ </div>
+
+ <div class="card s3">
+ <button class="btn lever">Scrub</button>
+ <div class="cap">btrfs scrub</div>
+ <div class="dialwrap">
+ <svg width="98" height="98" viewBox="0 0 98 98">
+ <circle cx="49" cy="49" r="40" fill="none" stroke="#1a1d1f" stroke-width="8"/>
+ <!-- 34d of ~30d cadence => over => amber, ~0.62 of ring -->
+ <circle cx="49" cy="49" r="40" fill="none" stroke="#dab53d" stroke-width="8"
+ stroke-linecap="round" stroke-dasharray="251.3" stroke-dashoffset="95"
+ transform="rotate(-90 49 49)"/>
+ <text x="49" y="46" text-anchor="middle" fill="#f3e7c5" font-family="monospace" font-size="20" font-weight="700">34</text>
+ <text x="49" y="63" text-anchor="middle" fill="#7c838a" font-family="monospace" font-size="10">days</text>
+ </svg>
+ </div>
+ <div class="note" style="text-align:center"><span class="lamp l-warn">●</span> past 30d cadence</div>
+ </div>
+
+ <div class="card s3">
+ <div class="cap">btrfs unalloc <span class="lamp l-ok">●</span></div>
+ <div class="big">118<span class="unit"> GiB</span></div>
+ <div class="note">unallocated headroom</div>
+ <div class="meter">
+ <div class="track"><div class="fill ok" style="width:46%"></div></div>
+ <div class="scale"><span>ample slack</span></div>
+ </div>
+ </div>
+
+ <div class="card s3">
+ <div class="cap">btrfs device-err <span class="lamp l-ok">●</span></div>
+ <div class="big">0 / 0</div>
+ <div class="note">read / write errors</div>
+ </div>
+
+ <div class="card s3">
+ <button class="btn lever">Enable</button>
+ <div class="cap">fstrim.timer <span class="lamp l-fail">●</span></div>
+ <div class="big" style="color:var(--terra)">OFF</div>
+ <div class="note">Confirm · SSD discard disabled</div>
+ </div>
+
+ <!-- THERMAL & POWER -->
+ <div class="band">Thermal &amp; Power</div>
+
+ <div class="card s5">
+ <div class="cap">Temperatures <span class="lamp l-ok">●</span></div>
+ <div class="gaugewrap">
+ <div class="gauge">
+ <svg width="112" height="64" viewBox="0 0 112 64">
+ <path d="M8 60 A48 48 0 0 1 104 60" fill="none" stroke="#1a1d1f" stroke-width="9"/>
+ <path d="M8 60 A48 48 0 0 1 79 21" fill="none" stroke="#74932f" stroke-width="9" stroke-linecap="round"/>
+ <path d="M79 21 A48 48 0 0 1 96 34" fill="none" stroke="#dab53d" stroke-width="9"/>
+ <path d="M96 34 A48 48 0 0 1 104 60" fill="none" stroke="#cb6b4d" stroke-width="9"/>
+ <!-- needle @ 61C (~61% of arc) -->
+ <line x1="56" y1="60" x2="86" y2="30" stroke="#f3e7c5" stroke-width="2.5"/>
+ <circle cx="56" cy="60" r="4" fill="#dab53d"/>
+ </svg>
+ <div class="rd">61°C</div><div class="lb">CPU package</div>
+ </div>
+ <div class="gauge">
+ <svg width="112" height="64" viewBox="0 0 112 64">
+ <path d="M8 60 A48 48 0 0 1 104 60" fill="none" stroke="#1a1d1f" stroke-width="9"/>
+ <path d="M8 60 A48 48 0 0 1 79 21" fill="none" stroke="#74932f" stroke-width="9" stroke-linecap="round"/>
+ <path d="M79 21 A48 48 0 0 1 96 34" fill="none" stroke="#dab53d" stroke-width="9"/>
+ <path d="M96 34 A48 48 0 0 1 104 60" fill="none" stroke="#cb6b4d" stroke-width="9"/>
+ <!-- needle @ 54C (~54%) -->
+ <line x1="56" y1="60" x2="79" y2="34" stroke="#f3e7c5" stroke-width="2.5"/>
+ <circle cx="56" cy="60" r="4" fill="#dab53d"/>
+ </svg>
+ <div class="rd">54°C</div><div class="lb">NVMe</div>
+ </div>
+ </div>
+ </div>
+
+ <div class="card s3">
+ <div class="cap">Thermal throttle <span class="lamp l-ok">●</span></div>
+ <div class="big">NO</div>
+ <div class="note">no throttle events</div>
+ </div>
+
+ <div class="card s2 s3" style="grid-column:span 2;">
+ <div class="cap">Battery <span class="lamp l-off">○</span></div>
+ <div class="big" style="color:var(--dim)">n/a</div>
+ <div class="note">desktop</div>
+ </div>
+
+ <div class="card s2 s3" style="grid-column:span 2;">
+ <div class="cap">Swap / zram <span class="lamp l-ok">●</span></div>
+ <div class="big">16<span class="unit"> GiB</span></div>
+ <div class="note">zram active</div>
+ </div>
+
+ <!-- MEMORY -->
+ <div class="card s6">
+ <div class="cap">Memory free <span class="lamp l-ok">●</span></div>
+ <div class="big">104<span class="unit"> GB free</span></div>
+ <div class="note">of 125 GB total · Workflow</div>
+ <div class="meter">
+ <div class="track"><div class="fill ok" style="width:83%"></div></div>
+ <div class="scale"><span>0</span><span>free 104 / 125 GB</span></div>
+ </div>
+ </div>
+
+ <div class="card s6">
+ <div class="cap">Unclean-shutdown ratio <span class="lamp l-warn">●</span></div>
+ <div class="big" style="color:var(--amber)">75<span class="unit">%</span></div>
+ <div class="note">clean boots · Workflow — investigate</div>
+ <div class="meter">
+ <div class="track">
+ <div class="zone amber" style="left:0;right:0"></div>
+ <div class="fill warn" style="width:75%"></div>
+ </div>
+ <div class="scale"><span>0</span><span>clean-boot fraction</span><span>100%</span></div>
+ </div>
+ </div>
+
+ <!-- UPDATES QUARANTINE -->
+ <div class="band">Updates — quarantined</div>
+ <div class="updates">
+ <div class="q">Updates</div>
+ <div class="metric"><span class="n">47</span><span class="k">pending</span></div>
+ <div class="metric"><span class="n cve">3</span><span class="k">CVE · arch-audit</span></div>
+ <div class="metric"><span class="n">5</span><span class="k">AUR stale</span></div>
+ <div class="spacer"></div>
+ <div class="note" style="max-width:230px; margin:0;">
+ <span class="lamp l-fail">●</span> Security advisories present.
+ Applying updates escalates to the update workflow — not an unattended clean.
+ </div>
+ <button class="btn">Open updates</button>
+ </div>
+
+ <!-- PACKAGES & JOURNAL COUNTERS -->
+ <div class="band">Packages · Logs · Counters</div>
+
+ <div class="card s3 tile">
+ <button class="btn lever">Review</button>
+ <div class="cap">Orphans</div>
+ <div class="row"><span class="lamp l-warn">●</span><span class="big">13</span></div>
+ <div class="note">Confirm · unowned pkgs</div>
+ </div>
+
+ <div class="card s3 tile">
+ <button class="btn lever">Review</button>
+ <div class="cap">.pacnew files</div>
+ <div class="row"><span class="lamp l-warn">●</span><span class="big">2</span></div>
+ <div class="note">Confirm · config merges</div>
+ </div>
+
+ <div class="card s3 tile">
+ <button class="btn lever">Clear</button>
+ <div class="cap">Coredumps 7d</div>
+ <div class="row"><span class="lamp l-warn">●</span><span class="big">18</span></div>
+ <div class="note">Auto · clearable</div>
+ </div>
+
+ <div class="card s3 tile">
+ <button class="btn lever">Run workflow</button>
+ <div class="cap">Failed units</div>
+ <div class="row"><span class="lamp l-warn">●</span><span class="big">1</span></div>
+ <div class="note">Workflow · systemd</div>
+ </div>
+
+ <div class="card s3">
+ <button class="btn lever">Prune</button>
+ <div class="cap">Snapper snapshots <span class="lamp l-ok">●</span></div>
+ <div class="big">42</div>
+ <div class="note">Confirm · retention ok</div>
+ <div class="meter">
+ <div class="track"><div class="fill ok" style="width:52%"></div></div>
+ <div class="scale"><span>within budget</span></div>
+ </div>
+ </div>
+
+ <div class="card s3">
+ <button class="btn lever">Refresh</button>
+ <div class="cap">Keyring age</div>
+ <div class="dialwrap">
+ <svg width="90" height="90" viewBox="0 0 90 90">
+ <circle cx="45" cy="45" r="36" fill="none" stroke="#1a1d1f" stroke-width="7"/>
+ <circle cx="45" cy="45" r="36" fill="none" stroke="#74932f" stroke-width="7"
+ stroke-linecap="round" stroke-dasharray="226.2" stroke-dashoffset="176"
+ transform="rotate(-90 45 45)"/>
+ <text x="45" y="43" text-anchor="middle" fill="#f3e7c5" font-family="monospace" font-size="18" font-weight="700">12</text>
+ <text x="45" y="59" text-anchor="middle" fill="#7c838a" font-family="monospace" font-size="9">days</text>
+ </svg>
+ </div>
+ <div class="note" style="text-align:center"><span class="lamp l-ok">●</span> Confirm · fresh</div>
+ </div>
+
+ <div class="card s3 tile">
+ <div class="cap">Journal errors</div>
+ <div class="row"><span class="lamp l-ok">●</span><span class="big">12</span></div>
+ <div class="note">Workflow · real errors</div>
+ </div>
+
+ <div class="card s3 tile">
+ <div class="cap">Listeners</div>
+ <div class="row"><span class="lamp l-ok">●</span><span class="big">3</span></div>
+ <div class="note">None · open sockets</div>
+ </div>
+
+ <!-- LAMP BOARD -->
+ <div class="band">Status board — binary &amp; diagnostic</div>
+ <div class="lampboard">
+ <div class="row"><span class="lamp l-ok">●</span><span class="nm">SMART</span><span class="vv">PASSED</span></div>
+ <div class="row"><span class="lamp l-ok">●</span><span class="nm">SMART wear</span><span class="vv">0%</span></div>
+ <div class="row"><span class="lamp l-ok">●</span><span class="nm">pacman integrity</span><span class="vv">clean</span></div>
+ <div class="row"><span class="lamp l-ok">●</span><span class="nm">snapshot timer</span><span class="vv">active</span></div>
+
+ <div class="row"><span class="lamp l-ok">●</span><span class="nm">is-system-running</span><span class="vv">running</span></div>
+ <div class="row"><span class="lamp l-ok">●</span><span class="nm">reboot-required</span><span class="vv">no</span></div>
+ <div class="row"><span class="lamp l-ok">●</span><span class="nm">kernel taint</span><span class="vv">0</span></div>
+ <div class="row"><span class="lamp l-ok">●</span><span class="nm">kernel/hw events</span><span class="vv">clean</span></div>
+
+ <div class="row"><span class="lamp l-ok">●</span><span class="nm">firewall</span><span class="vv">active</span></div>
+ <div class="row"><span class="lamp l-ok">●</span><span class="nm">fail2ban</span><span class="vv">active</span></div>
+ <div class="row"><span class="lamp l-ok">●</span><span class="nm">tailscale</span><span class="vv">4/4</span></div>
+ <div class="row"><span class="lamp l-ok">●</span><span class="nm">NTP</span><span class="vv">synced</span></div>
+
+ <div class="row"><span class="lamp l-ok">●</span><span class="nm">DNS / NM</span><span class="vv">ok</span></div>
+ <div class="row"><span class="lamp l-ok">●</span><span class="nm">rsyncshot</span><span class="vv">3h ago</span></div>
+ <div class="row"><span class="lamp l-ok">●</span><span class="nm">cron</span><span class="vv">ok</span></div>
+ <div class="row"><span class="lamp l-ok">●</span><span class="nm">app-log cleanup</span><span class="vv">ok</span></div>
+
+ <div class="row"><span class="lamp l-ok">●</span><span class="nm">journald size</span><span class="vv">1.2 GB</span></div>
+ <div class="row"><span class="lamp l-ok">●</span><span class="nm">docker stopped</span><span class="vv">2</span></div>
+ <div class="row"><span class="lamp l-warn">●</span><span class="nm">maintenance timers</span><span class="vv">4/5</span></div>
+ <div class="row"><span class="lamp l-warn">●</span><span class="nm">docker reclaim</span><span class="vv">3 GB · Prune</span></div>
+
+ <div class="row"><span class="lamp l-off">○</span><span class="nm">libvirt</span><span class="vv">off</span></div>
+ </div>
+
+ </div><!-- /cluster -->
+
+ <!-- RUNNING / OUTPUT WALL -->
+ <div class="wall">
+ <div class="wh">
+ <span>MAINT · <span class="l">ratio</span> · CLEANING <span class="lamp l-prog spin">◐</span></span>
+ <span class="meta" style="font-size:11px">4 Auto actions</span>
+ </div>
+ <div class="stream">
+ <div class="ln"><span class="lamp l-prog spin">◐</span><span class="msg">cache trim</span><span class="meta">running…</span></div>
+ <div class="ln"><span class="lamp l-ok">●</span><span class="msg">journal vacuum</span><span class="meta">done · reclaimed 0.9 GB</span></div>
+ <div class="ln"><span class="lamp l-ok">●</span><span class="msg">coredump clear</span><span class="meta">done · 12 cleared</span></div>
+ <div class="ln queued"><span class="lamp l-off">○</span><span class="msg">app-log cleanup</span><span class="meta">queued</span></div>
+ </div>
+ <div class="wfoot"><button class="btn">Done</button></div>
+ </div>
+
+</div>