fix: use percentages for chat position so it scales with image

2026-04-22 03:08:12 +03:00
parent e8084a4cde
commit 17681aef07
1 changed files with 8 additions and 5 deletions
--- a/scripts/mirror.js
+++ b/scripts/mirror.js
@@ -152,11 +152,14 @@ async function main() {

    const pageTitle = (await page.title()).replace(/[<>]/g, '');

-    const chatBlocks = slots.map(s => `
-  <div class="q-chat" style="top:${s.top}px" data-cid="${s.id}">
+    const chatBlocks = slots.map(s => {
+        const topPct = (s.top / pageHeight * 100).toFixed(4);
+        return `
+  <div class="q-chat" style="top:${topPct}%" data-cid="${s.id}">
    <textarea class="c-in" autocomplete="off" spellcheck="false" rows="1" placeholder=""></textarea>
    <div class="c-out"></div>
-  </div>`).join('');
+  </div>`;
+    }).join('');

    const wrapperHtml = `<!DOCTYPE html>
 <html lang="ru">
@@ -170,8 +173,8 @@ async function main() {
  .q-wrap img.bg { display:block; width:100%; height:auto; }
  .q-chat {
    position: absolute;
-    left: 250px;
-    width: 520px;
+    left: 15.6%;
+    width: 32.5%;
    z-index: 10;
    background: #fff;
  }