fix: add dedicated square favicon for HQ Command Center

Programmatic icon.tsx using Next.js convention — generates a 32×32 PNG with dark bg + cyan "F" glyph. Replaces the inherited 16:9 fallback that appeared stretched in browser tabs. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-05-06 17:30:32 -05:00
parent c3d196df03
commit 6b9a94490b
1 changed files with 59 additions and 0 deletions
@@ -0,0 +1,59 @@
+// src/app/hq-command/icon.tsx
+// ─────────────────────────────────────────────────────────────────────────────
+// Programmatic favicon for the HQ Command Center.
+// Uses Next.js App Router icon convention — generates a square PNG on demand,
+// so no external image file is needed and it never looks stretched.
+//
+// Design: dark rounded square with a cyan "F" glyph, matching the command
+// center's dark-mode aesthetic (#050505 bg + #00F0FF accent).
+// ─────────────────────────────────────────────────────────────────────────────
+
+import { ImageResponse } from "next/og";
+
+export const size = { width: 32, height: 32 };
+export const contentType = "image/png";
+export default function Icon() {
+  return new ImageResponse(
+    (
+      <div
+        style={{
+          width: "100%",
+          height: "100%",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          background: "#0A0A0F",
+          borderRadius: "6px",
+        }}
+      >
+        {/* Subtle accent ring */}
+        <div
+          style={{
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            width: "28px",
+            height: "28px",
+            borderRadius: "5px",
+            border: "1.5px solid rgba(0, 240, 255, 0.3)",
+            background: "linear-gradient(135deg, #0A0A1A 0%, #0D1117 100%)",
+          }}
+        >
+          <span
+            style={{
+              color: "#00F0FF",
+              fontSize: "18px",
+              fontWeight: 900,
+              fontFamily: "Inter, system-ui, -apple-system, sans-serif",
+              lineHeight: 1,
+              marginTop: "-1px",
+            }}
+          >
+            F
+          </span>
+        </div>
+      </div>
+    ),
+    { ...size },
+  );
+}