From 7efa22454d3f0ee452a15f71dc5a50fdbfe19576 Mon Sep 17 00:00:00 2001
From: chihlasm <michael@chihlas.com>
Date: Tue, 14 Apr 2026 01:20:28 +0000
Subject: [PATCH] feat(network): improve PDF export with print stylesheet

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 frontend/src/index.css | 39 +++++++++++++++++++++++++++++++++++++++
 1 file changed, 39 insertions(+)

diff --git a/frontend/src/index.css b/frontend/src/index.css
index 8405b22f..607ee349 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -445,3 +445,42 @@
     scroll-behavior: auto !important;
   }
 }
+
+/* ── Print / PDF export ───────────────────────────────────────────────── */
+@media print {
+  /* Hide everything that isn't the canvas */
+  body > * { display: none !important; }
+
+  /* Show only the React Flow viewport inside the diagram editor page */
+  #root { display: block !important; }
+  #root > * { display: none !important; }
+
+  /* The diagram editor mounts as a child of the app shell — target the canvas wrapper */
+  .react-flow__renderer,
+  .react-flow__viewport,
+  .react-flow {
+    display: block !important;
+  }
+
+  /* Make the canvas fill the printed page */
+  .react-flow {
+    position: fixed !important;
+    inset: 0 !important;
+    width: 100vw !important;
+    height: 100vh !important;
+    background: #ffffff !important;
+  }
+
+  /* Force light backgrounds on nodes so they're readable on white paper */
+  .react-flow__node {
+    print-color-adjust: exact;
+    -webkit-print-color-adjust: exact;
+  }
+
+  /* Hide UI chrome */
+  .react-flow__controls,
+  .react-flow__minimap,
+  .react-flow__panel {
+    display: none !important;
+  }
+}