From 388879e14e69d3ae888ea545e7729ce78aff41a4 Mon Sep 17 00:00:00 2001
From: Nicolas Varrot <contact@nicolasvarrot.fr>
Date: Fri, 13 Feb 2026 14:12:41 +0000
Subject: [PATCH] style: add print stylesheet for conversation export

- Hide sidebar, header, chat input, and scroll button when printing
- Reset backgrounds to white, text to black for readability
- Code blocks get light background with borders
- Tool calls styled for print (compact, bordered)
- External links show their URL in parentheses
- Chat scroll area becomes fully visible (no overflow)
- Messages avoid page-break-inside for clean pagination
- Remove shadows and backdrop filters in print
---
 src/components/ChatInput.tsx |  2 +-
 src/index.css                | 86 ++++++++++++++++++++++++++++++++++++
 2 files changed, 87 insertions(+), 1 deletion(-)

diff --git a/src/components/ChatInput.tsx b/src/components/ChatInput.tsx
index 1a10d79..bd592c0 100644
--- a/src/components/ChatInput.tsx
+++ b/src/components/ChatInput.tsx
@@ -222,7 +222,7 @@ export function ChatInput({ onSend, onAbort, isGenerating, disabled, sessionKey
 
   return (
     <div
-      className="border-t border-pc-border bg-[var(--pc-bg-input)]/60 backdrop-blur-xl p-4"
+      className="border-t border-pc-border bg-[var(--pc-bg-input)]/60 backdrop-blur-xl p-4 print-hide"
       role="form"
       aria-label={t('chat.inputLabel')}
       onDragOver={handleDragOver}
diff --git a/src/index.css b/src/index.css
index f43ffd0..a7869a0 100644
--- a/src/index.css
+++ b/src/index.css
@@ -279,3 +279,89 @@ html, body {
     animation-iteration-count: 1 !important;
   }
 }
+
+/* ── Print styles ── */
+@media print {
+  /* Hide non-content UI elements */
+  aside[role="navigation"],
+  header[role="banner"],
+  [aria-label="Scroll to bottom"],
+  .print-hide {
+    display: none !important;
+  }
+
+  /* Reset background/colors for printing */
+  body,
+  html,
+  #root,
+  main {
+    background: white !important;
+    color: black !important;
+    width: 100% !important;
+    max-width: 100% !important;
+    margin: 0 !important;
+    padding: 0 !important;
+  }
+
+  /* Main content fills the page */
+  main {
+    flex: 1 !important;
+    overflow: visible !important;
+  }
+
+  /* Messages readable in print */
+  [class*="ChatMessage"],
+  [class*="chat-message"] {
+    break-inside: avoid;
+    page-break-inside: avoid;
+    color: black !important;
+    border-color: #ccc !important;
+  }
+
+  /* Make message text dark */
+  .text-pc-text,
+  .text-pc-text-secondary,
+  .text-pc-text-muted {
+    color: #222 !important;
+  }
+
+  /* Code blocks print-friendly */
+  pre, code {
+    background: #f5f5f5 !important;
+    color: #333 !important;
+    border: 1px solid #ddd !important;
+    white-space: pre-wrap !important;
+    word-wrap: break-word !important;
+  }
+
+  /* Tool calls: keep them visible but compact */
+  [class*="ToolCall"] {
+    border: 1px solid #ccc !important;
+    background: #fafafa !important;
+    color: #333 !important;
+    break-inside: avoid;
+  }
+
+  /* Remove box shadows and backdrop filters */
+  * {
+    box-shadow: none !important;
+    backdrop-filter: none !important;
+    -webkit-backdrop-filter: none !important;
+  }
+
+  /* Links show their URL */
+  a[href^="http"]::after {
+    content: " (" attr(href) ")";
+    font-size: 0.8em;
+    color: #666;
+    word-break: break-all;
+  }
+
+  /* Ensure chat scroll area is fully visible */
+  [class*="overflow-y-auto"],
+  [class*="overflow-y-scroll"] {
+    overflow: visible !important;
+    max-height: none !important;
+    height: auto !important;
+  }
+}