feat: add AgendaMax PWA metadata and icons

2026-07-27 16:20:36 -06:00
parent 9d2ab39d84
commit de947f9d35
6 changed files with 44 additions and 2 deletions
@@ -3,9 +3,14 @@
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0, viewport-fit=cover" />
    <meta name="theme-color" content="#3b66ff" />
    <meta name="description" content="AgendaMax — Gestión visual de citas, empleados e ingresos para tu negocio." />
+    <link rel="manifest" href="/manifest.webmanifest" />
+    <link rel="apple-touch-icon" href="/icon-192.png" />
+    <meta name="apple-mobile-web-app-capable" content="yes" />
+    <meta name="apple-mobile-web-app-status-bar-style" content="default" />
+    <meta name="apple-mobile-web-app-title" content="AgendaMax" />
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet" />
@@ -22,7 +22,9 @@
    "test:admin": "node admin-test.mjs",
    "test:unit": "node --import tsx --test server/lib/scheduling.test.ts server/lib/time.test.ts server/lib/metrics.test.ts",
    "test:booking": "node server/scripts/booking-e2e.mjs",
-    "audit:visual": "node visual-audit.mjs"
+    "audit:visual": "node visual-audit.mjs",
+    "generate:pwa-icons": "node scripts/generate-pwa-icons.mjs",
+    "test:pwa": "node pwa-e2e.mjs"
  },
  "dependencies": {
    "@dnd-kit/core": "^6.1.0",
@@ -0,0 +1,15 @@
+{
+  "name": "AgendaMax",
+  "short_name": "AgendaMax",
+  "description": "Gestión visual de citas, empleados e ingresos para tu negocio.",
+  "start_url": "/",
+  "scope": "/",
+  "display": "standalone",
+  "orientation": "portrait-primary",
+  "background_color": "#f6f7fb",
+  "theme_color": "#3b66ff",
+  "icons": [
+    { "src": "/icon-192.png", "sizes": "192x192", "type": "image/png" },
+    { "src": "/icon-512.png", "sizes": "512x512", "type": "image/png", "purpose": "any maskable" }
+  ]
+}
@@ -0,0 +1,20 @@
+import { chromium } from "playwright";
+import fs from "node:fs/promises";
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+
+const root = path.resolve(path.dirname(fileURLToPath(import.meta.url)), "..");
+const svg = await fs.readFile(path.join(root, "public", "favicon.svg"), "utf8");
+const svgDataUrl = `data:image/svg+xml;base64,${Buffer.from(svg).toString("base64")}`;
+const browser = await chromium.launch({ headless: true });
+
+try {
+  for (const size of [192, 512]) {
+    const page = await browser.newPage({ viewport: { width: size, height: size }, deviceScaleFactor: 1 });
+    await page.setContent(`<!doctype html><style>html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#fff}img{display:block;width:100%;height:100%}</style><img src="${svgDataUrl}" alt="">`);
+    await page.screenshot({ path: path.join(root, "public", `icon-${size}.png`), type: "png" });
+    await page.close();
+  }
+} finally {
+  await browser.close();
+}