refactor: apply refined 15-60-25 Zen 4.0 layout, move patient banner to center column, update scribe UI states
Build Curio HMS / build-and-deploy (push) Successful in 49s Details

This commit is contained in:
Deep Koluguri 2026-05-23 11:33:35 -04:00
parent 6058f9a862
commit 78e95bfc17
3 changed files with 47 additions and 42 deletions

View File

@ -1313,7 +1313,7 @@
}
/* --- WORLD-CLASS ZEN 4.0 ADD-ONS --- */
.safety-header {
.patient-banner-inner {
background: white;
padding: 1.5rem 2.5rem;
border-radius: 20px;
@ -1322,10 +1322,7 @@
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 2rem;
position: sticky;
top: 1rem;
z-index: 10;
margin-bottom: 0.5rem;
}
.patient-identity-row {
@ -1350,14 +1347,14 @@
.zen-layout-3col {
display: grid;
grid-template-columns: 15% 55% 30%;
gap: 2rem;
grid-template-columns: 15% 60% 25%;
gap: 1.5rem;
align-items: start;
transition: grid-template-columns 0.3s ease;
}
.zen-layout-3col.collapsed-queue {
grid-template-columns: 5% 65% 30%;
grid-template-columns: 5% 70% 25%;
}
.zen-pipeline {
@ -1367,7 +1364,14 @@
box-shadow: 0 4px 20px rgba(0,0,0,0.03);
border: 1px solid var(--border);
transition: all 0.3s ease;
overflow: hidden;
overflow-x: hidden;
}
.zen-pipeline.full-height {
height: calc(100vh - 5rem);
overflow-y: auto;
position: sticky;
top: 1rem;
}
.zen-pipeline.collapsed {

View File

@ -111,30 +111,10 @@
</div>
</div>
<!-- DOCTOR ZEN VIEW (Clinical Focus) -->
<div id="doctor-zen-section" class="hidden">
<!-- Persistent Safety Header -->
<div class="safety-header">
<div class="patient-identity-row">
<span class="pill active">Now Seeing</span>
<h1>Rahul Verma <small>(28y, M)</small></h1>
<span class="pill triage">#012 • Viral Fever Triage</span>
<span class="allergy-tag urgent-alert">‼️ PEANUTS ALLERGY</span>
</div>
<div class="action-center">
<select id="scribeLang" class="lang-select">
<option value="en-US">English</option>
<option value="te-IN">తెలుగు</option>
</select>
<button id="zenScribeBtn" class="btn-zen scribe" onclick="toggleZenScribe()">🎙️ Scribe</button>
<button class="btn-zen history" onclick="openHistory()">📂 History</button>
<button class="btn-zen start" onclick="openConsultation()">✍️ Start</button>
</div>
</div>
<div class="zen-layout-3col">
<!-- Left: Collapsible Queue (15%) -->
<aside class="zen-pipeline" id="zenPipeline">
<!-- Left: Full-Height Queue (15%) -->
<aside class="zen-pipeline full-height" id="zenPipeline">
<div class="pipeline-header">
<h3>Queue <small>(Ctrl+Q)</small></h3>
<span class="badge">4 Waiting</span>
@ -157,8 +137,23 @@
</div>
</aside>
<!-- Center: Structured SOAP Workspace (55%) -->
<!-- Center: Core Workspace (60%) -->
<main class="zen-workspace-soap">
<div class="patient-banner-inner">
<div class="patient-identity-row">
<h1>Rahul Verma <small>(28y, M)</small></h1>
<span class="allergy-tag urgent-alert">⚠️ ALLERGY: PEANUTS</span>
</div>
<div class="action-center">
<select id="scribeLang" class="lang-select">
<option value="en-US">English</option>
<option value="te-IN">తెలుగు</option>
</select>
<button id="zenScribeBtn" class="btn-zen scribe pulse-active" onclick="toggleZenScribe()">🔴 Start Recording</button>
<button class="btn-zen history" onclick="openHistory()">📂 History</button>
</div>
</div>
<div id="scribeStatus" class="scribe-status-bar hidden">
<span class="pulse-dot"></span> <span id="scribeStatusText">AI Scribe Recording... (Ctrl+Shift+S to Pause)</span>
</div>
@ -195,22 +190,22 @@
</div>
</main>
<!-- Right: AI Assistant & Vitals (30%) -->
<!-- Right: Clinical Context & AI Insights (25%) -->
<aside class="zen-sidebar-right">
<div class="insight-card">
<div class="card-header">🩺 Vitals Widget</div>
<div class="vitals-grid">
<div class="vital-item">
<span class="label">Temp</span>
<span class="value" id="vital-temp">98.6°F</span>
<span class="value" id="vital-temp">98.6°F 🟢</span>
</div>
<div class="vital-item warning">
<span class="label">BP</span>
<span class="value" id="vital-bp">140/90</span>
<span class="value" id="vital-bp">140/90 🔴</span>
</div>
<div class="vital-item">
<span class="label">SpO2</span>
<span class="value" id="vital-spo2">98%</span>
<span class="value" id="vital-spo2">98% 🟢</span>
</div>
</div>
</div>
@ -219,8 +214,8 @@
<div class="card-header">✨ AI Suggestions</div>
<p id="aiNudgeText">Listening for diagnosis...</p>
<div class="suggested-tags">
<span>#ViralFever</span>
<span>#FluProtocols</span>
<span>ICD-10: B34.9 (Viral)</span>
<span>Rx: Paracetamol</span>
</div>
</div>
</aside>
@ -537,6 +532,6 @@
</div>
</main>
<script src="dashboard.js?v=21"></script>
<script src="dashboard.js?v=22"></script>
</body>
</html>

View File

@ -307,12 +307,12 @@ function updateScribeUI() {
if (!btn || !status) return;
if (isScribing) {
btn.innerHTML = "🛑 Stop Scribe";
btn.innerHTML = "⏸️ Pause Scribe";
btn.style.background = "#EF4444";
btn.style.color = "white";
status.classList.remove("hidden");
} else {
btn.innerHTML = "🎙️ Scribe";
btn.innerHTML = "🔴 Start Recording";
btn.style.background = ""; // Resets to CSS default
btn.style.color = "";
status.classList.add("hidden");
@ -345,7 +345,13 @@ async function processWithWhisper(blob) {
});
const data = await res.json();
if (data.text) {
document.getElementById("consultationNotes").value += "\n[DEEP SCRIBE]: " + data.text;
const activeField = document.activeElement;
if (activeField && activeField.tagName === 'TEXTAREA' && activeField.id.startsWith('soap-')) {
activeField.value += "\n[DEEP SCRIBE]: " + data.text;
} else {
const defaultField = document.getElementById("soap-s");
if (defaultField) defaultField.value += "\n[DEEP SCRIBE]: " + data.text;
}
generateSummary(true);
}
} catch (e) {