From a503df74a95c740d761ab2b52015fa1192176513 Mon Sep 17 00:00:00 2001
From: Elliot Braem <elliot@ejlbraem.com>
Date: Tue, 7 Jan 2025 23:20:04 -0500
Subject: [PATCH] add og image

---
 public/og-image.svg | 34 ++++++++++++++++++++++++++++++++++
 src/pages/_app.js   |  6 ++++--
 2 files changed, 38 insertions(+), 2 deletions(-)
 create mode 100644 public/og-image.svg

diff --git a/public/og-image.svg b/public/og-image.svg
new file mode 100644
index 0000000..5c334dd
--- /dev/null
+++ b/public/og-image.svg
@@ -0,0 +1,34 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="1200" height="630" viewBox="0 0 1200 630" xmlns="http://www.w3.org/2000/svg">
+  <rect width="1200" height="630" fill="#0F172A"/>
+  
+  <!-- Background Grid Pattern -->
+  <pattern id="grid" x="0" y="0" width="40" height="40" patternUnits="userSpaceOnUse">
+    <rect width="40" height="40" fill="none" stroke="#1E293B" stroke-width="1"/>
+  </pattern>
+  <rect width="1200" height="630" fill="url(#grid)" opacity="0.3"/>
+  
+  <!-- Main Title -->
+  <text x="600" y="200" font-family="Arial, sans-serif" font-size="72" font-weight="bold" fill="white" text-anchor="middle">
+    crosspost
+  </text>
+  
+  <!-- Subtitle -->
+  <text x="600" y="280" font-family="Arial, sans-serif" font-size="32" fill="#94A3B8" text-anchor="middle">
+    your content, everywhere
+  </text>
+  
+  <!-- Platform Icons and Connection Lines -->
+  <g transform="translate(400, 380)">
+    <!-- Twitter/X Icon -->
+    <circle cx="0" cy="0" r="50" fill="#1DA1F2"/>
+    <path d="M-25,-25 L25,25 M-25,25 L25,-25" stroke="white" stroke-width="8"/>
+    
+    <!-- Connection Line -->
+    <line x1="60" y1="0" x2="340" y2="0" stroke="#4F46E5" stroke-width="4" stroke-dasharray="10,10"/>
+    
+    <!-- NEAR Icon -->
+    <circle cx="400" cy="0" r="50" fill="#4F46E5"/>
+    <text x="400" y="15" font-family="Arial, sans-serif" font-size="32" fill="white" text-anchor="middle">N</text>
+  </g>
+</svg>
diff --git a/src/pages/_app.js b/src/pages/_app.js
index 5323e15..1b2ac8f 100644
--- a/src/pages/_app.js
+++ b/src/pages/_app.js
@@ -30,14 +30,16 @@ export default function App({ Component, pageProps }) {
         <meta property="og:url" content="https://crosspost.everything.dev" />
         <meta property="og:title" content="crosspost | your content, everywhere" />
         <meta property="og:description" content="Open source user interface to crosspost across Twitter (X) and Near Social platforms." />
-        <meta property="og:image" content="/near-logo.svg" />
+        <meta property="og:image" content="/og-image.svg" />
+        <meta property="og:image:width" content="1200" />
+        <meta property="og:image:height" content="630" />
 
         {/* Twitter */}
         <meta property="twitter:card" content="summary_large_image" />
         <meta property="twitter:url" content="https://crosspost.everything.dev" />
         <meta property="twitter:title" content="crosspost | your content, everywhere" />
         <meta property="twitter:description" content="Open source user interface to crosspost across Twitter (X) and Near Social platforms." />
-        <meta property="twitter:image" content="/near-logo.svg" />
+        <meta property="twitter:image" content="/og-image.svg" />
 
         {/* Favicon */}
         <link rel="icon" href="/favicon.ico" />