From 6b0d9d8f4062bd14f48b0b6b0668db091b5cc14b Mon Sep 17 00:00:00 2001
From: DocFast Bot <docfast@cloonar.com>
Date: Fri, 20 Feb 2026 10:02:35 +0000
Subject: [PATCH] fix: use SVG background-repeat for reliable diagonal
 watermark tiling

HTML div tiles were too faint. SVG background pattern renders
reliably in Chromium print mode with consistent coverage.
---
 src/routes/demo.ts | 21 +++------------------
 1 file changed, 3 insertions(+), 18 deletions(-)

diff --git a/src/routes/demo.ts b/src/routes/demo.ts
index 78e968c..fb8a094 100644
--- a/src/routes/demo.ts
+++ b/src/routes/demo.ts
@@ -6,25 +6,10 @@ import logger from "../services/logger.js";
 
 const router = Router();
 
+const WATERMARK_SVG = `<svg xmlns='http://www.w3.org/2000/svg' width='400' height='200'><text transform='rotate(-35 200 100)' x='50%' y='50%' font-family='sans-serif' font-size='22' font-weight='bold' fill='rgba(52,211,153,0.22)' text-anchor='middle' dominant-baseline='middle'>DEMO — docfast.dev</text></svg>`;
+const WATERMARK_BG = `data:image/svg+xml,${encodeURIComponent(WATERMARK_SVG)}`;
 const WATERMARK_HTML = `
-<style>
-  @media print { .docfast-wm-overlay { display:block !important; } }
-  .docfast-wm-overlay {
-    position:fixed; top:0; left:0; width:200vw; height:200vh;
-    z-index:999999; pointer-events:none;
-    display:flex; flex-wrap:wrap; align-content:flex-start;
-    transform:rotate(-35deg); transform-origin:center center;
-    margin-top:-50vh; margin-left:-50vw;
-  }
-  .docfast-wm-tile {
-    width:300px; height:120px;
-    display:flex; align-items:center; justify-content:center;
-    font-family:sans-serif; font-size:18px; font-weight:bold;
-    color:rgba(52,211,153,0.18); letter-spacing:1px;
-    white-space:nowrap; user-select:none;
-  }
-</style>
-<div class="docfast-wm-overlay">${Array(80).fill('<div class="docfast-wm-tile">DEMO — docfast.dev</div>').join("")}</div>
+<div style="position:fixed;top:0;left:0;width:100%;height:100%;z-index:999999;pointer-events:none;background-image:url(&quot;${WATERMARK_BG}&quot;);background-repeat:repeat;background-size:400px 200px;"></div>
 <div style="position:fixed;bottom:0;left:0;right:0;background:rgba(52,211,153,0.92);color:#0b0d11;text-align:center;padding:8px;font-family:sans-serif;font-size:12px;font-weight:bold;z-index:999999;letter-spacing:0.3px;">Generated by DocFast — docfast.dev | Upgrade to Pro for clean PDFs</div>`;
 
 function injectWatermark(html: string): string {