From 7a4e773fffd1a50dd71c47bbc0f59a9c4cd1ba7b Mon Sep 17 00:00:00 2001
From: b1rdmania <102524336+b1rdmania@users.noreply.github.com>
Date: Mon, 29 Dec 2025 13:50:52 +0000
Subject: [PATCH] Use wario-synth.png for social share image
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Update og:image and twitter:image to use wario-synth.png
- Update image dimensions to 1472x704

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 index.html           | 8 ++++----
 play.html            | 8 ++++----
 server/src/server.ts | 6 +++---
 3 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/index.html b/index.html
index 6e71b94..2d665fc 100644
--- a/index.html
+++ b/index.html
@@ -8,9 +8,9 @@
     <!-- OpenGraph / Social Media Preview -->
     <meta property="og:title" content="WARIO SYNTH">
     <meta property="og:description" content="Turn any song into retro game console music">
-    <meta property="og:image" content="/wario-sprite.png">
-    <meta property="og:image:width" content="160">
-    <meta property="og:image:height" content="160">
+    <meta property="og:image" content="/wario-synth.png">
+    <meta property="og:image:width" content="1472">
+    <meta property="og:image:height" content="704">
     <meta property="og:type" content="website">
     <meta property="og:url" content="https://motif-self.vercel.app">
 
@@ -18,7 +18,7 @@
     <meta name="twitter:card" content="summary_large_image">
     <meta name="twitter:title" content="WARIO SYNTH">
     <meta name="twitter:description" content="Turn any song into retro game console music">
-    <meta name="twitter:image" content="/wario-sprite.png">
+    <meta name="twitter:image" content="/wario-synth.png">
 
     <!-- General Meta -->
     <meta name="description" content="WARIO SYNTH - Transform any song into retro Gameboy-style game console music. Search, preview MIDI, and generate chiptune versions.">
diff --git a/play.html b/play.html
index e0a563f..e8c135c 100644
--- a/play.html
+++ b/play.html
@@ -9,9 +9,9 @@
     <!-- OpenGraph / Social Media Preview -->
     <meta property="og:title" content="WARIO SYNTH" />
     <meta property="og:description" content="Tap to play this Gameboy tune" />
-    <meta property="og:image" content="https://motif-self.vercel.app/wario-sprite.png" />
-    <meta property="og:image:width" content="160" />
-    <meta property="og:image:height" content="160" />
+    <meta property="og:image" content="https://motif-self.vercel.app/wario-synth.png" />
+    <meta property="og:image:width" content="1472" />
+    <meta property="og:image:height" content="704" />
     <meta property="og:type" content="website" />
     <meta property="og:url" content="https://motif-self.vercel.app/play" />
 
@@ -19,7 +19,7 @@
     <meta name="twitter:card" content="summary" />
     <meta name="twitter:title" content="WARIO SYNTH" />
     <meta name="twitter:description" content="Tap to play this Gameboy tune" />
-    <meta name="twitter:image" content="https://motif-self.vercel.app/wario-sprite.png" />
+    <meta name="twitter:image" content="https://motif-self.vercel.app/wario-synth.png" />
 
     <style>
         /* Local Pixel Font */
diff --git a/server/src/server.ts b/server/src/server.ts
index f979043..cb99028 100644
--- a/server/src/server.ts
+++ b/server/src/server.ts
@@ -217,7 +217,7 @@ app.get('/s/:code', async (req, res) => {
     const origin = getOrigin(req);
     const shortUrl = origin ? `${origin}/s/${encodeURIComponent(code)}` : `/s/${encodeURIComponent(code)}`;
     const playUrl = origin ? `${origin}${dest}` : dest;
-    const imageUrl = origin ? `${origin}/wario-sprite.png` : '/wario-sprite.png';
+    const imageUrl = origin ? `${origin}/wario-synth.png` : '/wario-synth.png';
 
     const sharedTitle = (payload.title || '').trim();
     const ogTitle = sharedTitle || 'WARIO SYNTH';
@@ -234,8 +234,8 @@ app.get('/s/:code', async (req, res) => {
     <meta property="og:title" content="${escapeHtml(ogTitle)}" />
     <meta property="og:description" content="${escapeHtml(ogDescription)}" />
     <meta property="og:image" content="${escapeHtml(imageUrl)}" />
-    <meta property="og:image:width" content="160" />
-    <meta property="og:image:height" content="160" />
+    <meta property="og:image:width" content="1472" />
+    <meta property="og:image:height" content="704" />
     <meta property="og:type" content="website" />
     <meta property="og:url" content="${escapeHtml(shortUrl)}" />