From 6afedc9df93668042584f1359d6b34b7af8826e1 Mon Sep 17 00:00:00 2001
From: waterWang <waterWang@users.noreply.github.com>
Date: Sun, 9 Aug 2026 03:05:48 +0800
Subject: [PATCH] feat: add print stylesheet section for Dashboard (Closes
 #805)

---
 src/pages/Dashboard.print.test.ts | 21 +++++++++++++++++++++
 src/pages/Dashboard.tsx           | 12 ++++++++++--
 src/styles/print.css              | 31 +++++++++++++++++++++++++++++++
 3 files changed, 62 insertions(+), 2 deletions(-)
 create mode 100644 src/pages/Dashboard.print.test.ts

diff --git a/src/pages/Dashboard.print.test.ts b/src/pages/Dashboard.print.test.ts
new file mode 100644
index 00000000..4c6db8ae
--- /dev/null
+++ b/src/pages/Dashboard.print.test.ts
@@ -0,0 +1,21 @@
+import fs from "node:fs";
+import path from "node:path";
+
+describe("Dashboard print presentation", () => {
+  const dashboardPath = path.join(process.cwd(), "src/pages/Dashboard.tsx");
+  const printCssPath = path.join(process.cwd(), "src/styles/print.css");
+
+  it("provides a print stylesheet for Dashboard", () => {
+    const css = fs.readFileSync(printCssPath, "utf8");
+    expect(css).toContain("@media print");
+    expect(css).toContain(".dashboard-chrome");
+    expect(css).toContain("display: none !important");
+  });
+
+  it("connects Dashboard to the print stylesheet", () => {
+    const component = fs.readFileSync(dashboardPath, "utf8");
+    expect(component).toContain('import "../styles/print.css";');
+    expect(component).toContain("dashboard-container");
+    expect(component).toContain("dashboard-chrome");
+  });
+});
\ No newline at end of file
diff --git a/src/pages/Dashboard.tsx b/src/pages/Dashboard.tsx
index 617c56d3..e1e37295 100644
--- a/src/pages/Dashboard.tsx
+++ b/src/pages/Dashboard.tsx
@@ -1,5 +1,6 @@
 import React from "react"
 import { StellarWaveEmptyState } from "../components/EmptyState"
+import "../styles/print.css";
 
 /**
  * Dashboard page component (Legacy Pages Router).
@@ -18,6 +19,11 @@ import { StellarWaveEmptyState } from "../components/EmptyState"
  *   layer (src/styles/focus.css) for WCAG 2.1 AA 3:1 contrast ratio.
  * - Tap targets: All interactive elements maintain ≥44×44px minimum
  *   (WCAG 2.5.5) via Button size="lg" in the StellarWaveEmptyState.
+ *
+ * Issue #805: Add print stylesheet section for Dashboard.
+ * - Chrome (navigation + interactive controls) is hidden via .dashboard-chrome.
+ * - Collapsible sections are expanded when printing so the printed Dashboard
+ *   shows all content without requiring user interaction.
  */
 export default function Dashboard() {
   return (
@@ -30,7 +36,9 @@ export default function Dashboard() {
       <h1 className="text-2xl sm:text-3xl font-bold mb-4 sm:mb-6">
         Dashboard
       </h1>
-      <StellarWaveEmptyState />
+      <div className="dashboard-chrome">
+        <StellarWaveEmptyState />
+      </div>
     </div>
   )
-}
+}
\ No newline at end of file
diff --git a/src/styles/print.css b/src/styles/print.css
index 8ecc56c8..2e61a5da 100644
--- a/src/styles/print.css
+++ b/src/styles/print.css
@@ -76,3 +76,34 @@
     height: auto !important;
   }
 }
+
+/* Dashboard print presentation. Interactive controls and navigation
+ * chrome are omitted from the printed page. The empty state content
+ * is preserved so the printed Dashboard provides a clean summary. */
+@media print {
+  .dashboard-container {
+    max-width: none !important;
+    padding: 0 !important;
+    background: #fff !important;
+    color: #000 !important;
+  }
+
+  .dashboard-chrome {
+    display: none !important;
+  }
+
+  .dashboard-container [class*="text-muted-foreground"] {
+    color: #374151 !important;
+  }
+
+  .dashboard-container [class*="bg-card"],
+  .dashboard-container [class*="bg-background"],
+  .dashboard-container [class*="bg-muted"] {
+    background: #fff !important;
+  }
+
+  .dashboard-container a {
+    color: #000 !important;
+    text-decoration: none !important;
+  }
+}
\ No newline at end of file