From a39303f42675a997e374e2736cc2ee5d7d33924b Mon Sep 17 00:00:00 2001
From: hao <hao@users.noreply.git.hk.hao.work>
Date: Tue, 17 Mar 2026 02:37:39 -0700
Subject: [PATCH] =?UTF-8?q?=E6=94=B6=E7=B4=A7=E9=9D=9E=E6=80=BB=E8=A7=88?=
 =?UTF-8?q?=E9=A1=B5=20dashboard=20=E5=A4=B4=E9=83=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../generated/dashboard/assets/app.js         |  7 +++
 .../generated/dashboard/assets/styles.css     | 53 +++++++++++++++++++
 .../dashboard_templates/lovart/assets/app.js  |  7 +++
 .../lovart/assets/styles.css                  | 53 +++++++++++++++++++
 4 files changed, 120 insertions(+)

diff --git a/08-threat-intel/generated/dashboard/assets/app.js b/08-threat-intel/generated/dashboard/assets/app.js
index c676bb1f..2a6f92e3 100644
--- a/08-threat-intel/generated/dashboard/assets/app.js
+++ b/08-threat-intel/generated/dashboard/assets/app.js
@@ -1244,7 +1244,14 @@ function renderWorkspace() {
   workspace.innerHTML = html;
 }
 
+function syncRouteChrome() {
+  const compactHero = state.routeSection !== "overview";
+  document.body.dataset.routeSection = state.routeSection;
+  document.body.classList.toggle("hero-compact", compactHero);
+}
+
 function renderAll() {
+  syncRouteChrome();
   renderMetrics();
   renderSectionNav();
   renderTopMenus();
diff --git a/08-threat-intel/generated/dashboard/assets/styles.css b/08-threat-intel/generated/dashboard/assets/styles.css
index 02d70725..a90616ba 100644
--- a/08-threat-intel/generated/dashboard/assets/styles.css
+++ b/08-threat-intel/generated/dashboard/assets/styles.css
@@ -281,6 +281,54 @@ select {
   padding: 12px;
 }
 
+body.hero-compact .hero {
+  padding: 14px 18px 18px;
+}
+
+body.hero-compact .hero-top {
+  grid-template-columns: 1fr;
+  gap: 10px;
+}
+
+body.hero-compact .hero-copy {
+  display: none;
+}
+
+body.hero-compact .hero-actions {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: stretch;
+  gap: 10px;
+}
+
+body.hero-compact .hero-actions > .button,
+body.hero-compact .hero-actions > .toggle-card {
+  flex: 0 0 auto;
+}
+
+body.hero-compact .hero-actions > .sync-state {
+  flex: 1 1 280px;
+  min-width: 220px;
+}
+
+body.hero-compact .hero-links {
+  flex: 1 1 100%;
+  padding: 10px;
+}
+
+body.hero-compact .metrics-row {
+  margin-top: 14px;
+}
+
+body.hero-compact .section-nav,
+body.hero-compact .top-menus {
+  margin-top: 14px;
+}
+
+body.hero-compact .hero-glow {
+  opacity: 0.55;
+}
+
 .metrics-row {
   position: relative;
   display: grid;
@@ -1416,6 +1464,11 @@ select {
     flex-direction: column;
     align-items: stretch;
   }
+
+  body.hero-compact .hero-actions {
+    display: grid;
+    grid-template-columns: 1fr;
+  }
 }
 
 @media (max-width: 640px) {
diff --git a/scripts/lab/dashboard_templates/lovart/assets/app.js b/scripts/lab/dashboard_templates/lovart/assets/app.js
index c676bb1f..2a6f92e3 100644
--- a/scripts/lab/dashboard_templates/lovart/assets/app.js
+++ b/scripts/lab/dashboard_templates/lovart/assets/app.js
@@ -1244,7 +1244,14 @@ function renderWorkspace() {
   workspace.innerHTML = html;
 }
 
+function syncRouteChrome() {
+  const compactHero = state.routeSection !== "overview";
+  document.body.dataset.routeSection = state.routeSection;
+  document.body.classList.toggle("hero-compact", compactHero);
+}
+
 function renderAll() {
+  syncRouteChrome();
   renderMetrics();
   renderSectionNav();
   renderTopMenus();
diff --git a/scripts/lab/dashboard_templates/lovart/assets/styles.css b/scripts/lab/dashboard_templates/lovart/assets/styles.css
index 02d70725..a90616ba 100644
--- a/scripts/lab/dashboard_templates/lovart/assets/styles.css
+++ b/scripts/lab/dashboard_templates/lovart/assets/styles.css
@@ -281,6 +281,54 @@ select {
   padding: 12px;
 }
 
+body.hero-compact .hero {
+  padding: 14px 18px 18px;
+}
+
+body.hero-compact .hero-top {
+  grid-template-columns: 1fr;
+  gap: 10px;
+}
+
+body.hero-compact .hero-copy {
+  display: none;
+}
+
+body.hero-compact .hero-actions {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: stretch;
+  gap: 10px;
+}
+
+body.hero-compact .hero-actions > .button,
+body.hero-compact .hero-actions > .toggle-card {
+  flex: 0 0 auto;
+}
+
+body.hero-compact .hero-actions > .sync-state {
+  flex: 1 1 280px;
+  min-width: 220px;
+}
+
+body.hero-compact .hero-links {
+  flex: 1 1 100%;
+  padding: 10px;
+}
+
+body.hero-compact .metrics-row {
+  margin-top: 14px;
+}
+
+body.hero-compact .section-nav,
+body.hero-compact .top-menus {
+  margin-top: 14px;
+}
+
+body.hero-compact .hero-glow {
+  opacity: 0.55;
+}
+
 .metrics-row {
   position: relative;
   display: grid;
@@ -1416,6 +1464,11 @@ select {
     flex-direction: column;
     align-items: stretch;
   }
+
+  body.hero-compact .hero-actions {
+    display: grid;
+    grid-template-columns: 1fr;
+  }
 }
 
 @media (max-width: 640px) {