From 03309e28a6ee85dcc179555b07ed438622af7086 Mon Sep 17 00:00:00 2001
From: Michael Pilosov <consistentbayes@gmail.com>
Date: Wed, 22 Apr 2026 11:09:44 -0600
Subject: [PATCH] move prefect badge from masthead to footer

---
 app/web/main.py                |  4 +++-
 app/web/static/style.css       | 13 ++++++++++++-
 app/web/templates/index.html   |  8 +++++---
 app/web/templates/metrics.html |  6 +++++-
 4 files changed, 25 insertions(+), 6 deletions(-)

diff --git a/app/web/main.py b/app/web/main.py
index 212585e..322d1a8 100644
--- a/app/web/main.py
+++ b/app/web/main.py
@@ -719,10 +719,12 @@ def _scan_metrics() -> List[Dict[str, Any]]:
 
 @app.get("/metrics", response_class=HTMLResponse)
 async def metrics_page(request: Request) -> HTMLResponse:
+    async with httpx.AsyncClient(timeout=5.0) as client:
+        dep_id = await PREFECT.deployment_id(client)
     return templates.TemplateResponse(
         request,
         "metrics.html",
-        {"prefect_api": PREFECT_API},
+        {"prefect_api": PREFECT_API, "deployment_id": dep_id},
     )
 
 
diff --git a/app/web/static/style.css b/app/web/static/style.css
index d13f3bf..7259347 100644
--- a/app/web/static/style.css
+++ b/app/web/static/style.css
@@ -572,6 +572,14 @@ button.submit:disabled { background: var(--faint); border-color: var(--faint); c
   border-top: 1px solid var(--rule);
 }
 .colophon span.k { color: var(--mute); }
+.colophon .prefect-badge { display: inline-flex; align-items: center; gap: 4px; }
+.colophon .prefect-badge .dot {
+  display: inline-block;
+  width: 6px; height: 6px;
+  border-radius: 50%;
+  background: var(--good);
+}
+.colophon .prefect-badge .dot.bad { background: var(--alarm); }
 
 /* subtle htmx indicator */
 .htmx-indicator {
@@ -655,6 +663,8 @@ button.submit:disabled { background: var(--faint); border-color: var(--faint); c
 .dataset-picker[open] .picker-toggle::before { content: "[ collapse ]"; color: var(--accent); }
 .dataset-picker.intro .picker-toggle::before { content: "[ read ]"; }
 .dataset-picker.intro[open] .picker-toggle::before { content: "[ collapse ]"; color: var(--accent); }
+.dataset-picker.metrics-inline .picker-toggle::before { content: "[ expand ]"; }
+.dataset-picker.metrics-inline[open] .picker-toggle::before { content: "[ collapse ]"; color: var(--accent); }
 
 .intro-body {
   display: grid;
@@ -1345,7 +1355,8 @@ button.submit:disabled { background: var(--faint); border-color: var(--faint); c
   max-width: 30ch;
 }
 
-.metrics-page .empty {
+.metrics-page .empty,
+.metrics-inline .empty {
   border: 1px dashed var(--rule-2);
   padding: 1.4rem;
   text-align: center;
diff --git a/app/web/templates/index.html b/app/web/templates/index.html
index f157548..1fdcb90 100644
--- a/app/web/templates/index.html
+++ b/app/web/templates/index.html
@@ -4,7 +4,7 @@
   <meta charset="utf-8" />
   <meta name="viewport" content="width=device-width,initial-scale=1" />
   <title>embedding notebook — web1</title>
-  <link rel="stylesheet" href="/static/style.css?v=12" />
+  <link rel="stylesheet" href="/static/style.css?v=13" />
   <script src="https://unpkg.com/htmx.org@2.0.4"></script>
   <script type="importmap">
   {
@@ -30,8 +30,6 @@
     <h1 class="title">embedding notebook <em>&mdash; drift &amp; projection</em></h1>
   </div>
   <div class="meta">
-    <span class="dot {% if not deployment_id %}bad{% endif %}"></span>
-    {% if deployment_id %}prefect · ver {{ deployment_id[:8] }}{% else %}prefect · unreachable{% endif %}
     <a href="#metrics" class="nav-link">metrics &darr;</a>
     <button type="button" class="theme-toggle" id="theme-toggle" aria-label="toggle theme">◐</button>
   </div>
@@ -393,6 +391,10 @@
 
 <footer class="colophon">
   <span>&copy; 2026 Mind the Math LLC</span>
+  <span class="prefect-badge">
+    <span class="dot {% if not deployment_id %}bad{% endif %}"></span>
+    {% if deployment_id %}prefect · {{ deployment_id[:8] }}{% else %}prefect · unreachable{% endif %}
+  </span>
 </footer>
 
 <script src="/static/theme.js?v=11"></script>
diff --git a/app/web/templates/metrics.html b/app/web/templates/metrics.html
index 9416695..007761c 100644
--- a/app/web/templates/metrics.html
+++ b/app/web/templates/metrics.html
@@ -4,7 +4,7 @@
   <meta charset="utf-8" />
   <meta name="viewport" content="width=device-width,initial-scale=1" />
   <title>metrics — embedding notebook</title>
-  <link rel="stylesheet" href="/static/style.css?v=5" />
+  <link rel="stylesheet" href="/static/style.css?v=13" />
   <link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='3' fill='%231f4e5f'/%3E%3C/svg%3E" />
   <script>
     (function(){try{
@@ -90,6 +90,10 @@
 
 <footer class="colophon">
   <span>&copy; 2026 Mind the Math LLC</span>
+  <span class="prefect-badge">
+    <span class="dot {% if not deployment_id %}bad{% endif %}"></span>
+    {% if deployment_id %}prefect · {{ deployment_id[:8] }}{% else %}prefect · unreachable{% endif %}
+  </span>
 </footer>
 
 <script src="/static/theme.js?v=5"></script>