From 931751ed697a10317e990306b88dcfb9f3015692 Mon Sep 17 00:00:00 2001
From: Cursor Agent <cursoragent@cursor.com>
Date: Tue, 26 Aug 2025 10:48:31 +0000
Subject: [PATCH 1/2] Refactor og image generation with simplified design and
 dynamic title

Co-authored-by: hey <hey@ankeshbharti.com>
---
 pages/api/og.tsx | 169 +++++++++++++++++------------------------------
 1 file changed, 62 insertions(+), 107 deletions(-)

diff --git a/pages/api/og.tsx b/pages/api/og.tsx
index 5322349..0d381c1 100644
--- a/pages/api/og.tsx
+++ b/pages/api/og.tsx
@@ -8,144 +8,99 @@ export const config = {
 export default async function handler(req: NextRequest) {
   try {
     const { searchParams } = new URL(req.url)
-    
-    // Get dynamic parameters
-    const title = searchParams.get('title') || 'Tilekit'
-    const description = searchParams.get('description') || 'Monorepo hosting both in-house and vendored libraries and tools powering the Tiles Launcher.'
-    const type = searchParams.get('type') || 'default'
-    
-    // Note: Using system fonts for better compatibility
+
+    const title = searchParams.get('title') || 'Tiles Launcher'
 
     return new ImageResponse(
       (
         <div
           style={{
-            height: '100%',
+            backgroundColor: '#000000',
             width: '100%',
+            height: '100%',
             display: 'flex',
-            flexDirection: 'column',
             alignItems: 'center',
             justifyContent: 'center',
-            backgroundColor: '#0a0a0a',
-            backgroundImage: 'radial-gradient(circle at 25px 25px, #1a1a1a 2%, transparent 0%), radial-gradient(circle at 75px 75px, #1a1a1a 2%, transparent 0%)',
-            backgroundSize: '100px 100px',
+            color: 'white',
+            padding: '80px 120px',
+            boxSizing: 'border-box',
           }}
         >
-          {/* Header with logo */}
           <div
             style={{
               display: 'flex',
               alignItems: 'center',
-              gap: '12px',
-              marginBottom: '40px',
-            }}
-          >
-            <div
-              style={{
-                width: '48px',
-                height: '48px',
-                borderRadius: '12px',
-                background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)',
-                display: 'flex',
-                alignItems: 'center',
-                justifyContent: 'center',
-                fontSize: '24px',
-                fontWeight: 'bold',
-                color: 'white',
-              }}
-            >
-              T
-            </div>
-            <span
-              style={{
-                fontSize: '32px',
-                fontWeight: 'bold',
-                color: 'white',
-                letterSpacing: '-0.02em',
-              }}
-            >
-              Tilekit
-            </span>
-          </div>
-
-          {/* Main content */}
-          <div
-            style={{
-              display: 'flex',
+              justifyContent: 'center',
               flexDirection: 'column',
-              alignItems: 'center',
-              textAlign: 'center',
-              maxWidth: '800px',
-              padding: '0 40px',
-            }}
-          >
-            <h1
-              style={{
-                fontSize: '64px',
-                fontWeight: 'bold',
-                color: 'white',
-                margin: '0 0 24px 0',
-                lineHeight: '1.1',
-                letterSpacing: '-0.02em',
-              }}
-            >
-              {title}
-            </h1>
-            
-            <p
-              style={{
-                fontSize: '28px',
-                color: '#a1a1aa',
-                margin: '0',
-                lineHeight: '1.4',
-                maxWidth: '600px',
-              }}
-            >
-              {description}
-            </p>
-          </div>
-
-          {/* Footer */}
-          <div
-            style={{
-              position: 'absolute',
-              bottom: '40px',
-              left: '40px',
-              right: '40px',
-              display: 'flex',
-              justifyContent: 'space-between',
-              alignItems: 'center',
             }}
           >
             <div
               style={{
                 display: 'flex',
                 alignItems: 'center',
-                gap: '8px',
-                color: '#71717a',
-                fontSize: '18px',
-              }}
-            >
-              <span>tileslauncher</span>
-              <span>•</span>
-              <span>{type}</span>
-            </div>
-            
-            <div
-              style={{
-                color: '#71717a',
-                fontSize: '18px',
+                justifyContent: 'center',
+                marginBottom: title !== 'Tiles Launcher' ? 40 : 0,
               }}
             >
-              tiles.run
+              <div
+                style={{
+                  display: 'flex',
+                  flexDirection: 'column',
+                  gap: 10,
+                  marginRight: 30,
+                }}
+              >
+                <div style={{ display: 'flex', gap: 8 }}>
+                  <div
+                    style={{
+                      width: 35,
+                      height: 35,
+                      backgroundColor: 'white',
+                      borderRadius: 7,
+                    }}
+                  />
+                  <div
+                    style={{
+                      width: 35,
+                      height: 35,
+                      backgroundColor: 'white',
+                      borderRadius: 7,
+                    }}
+                  />
+                </div>
+                <div style={{ display: 'flex' }}>
+                  <div
+                    style={{
+                      width: 35,
+                      height: 35,
+                      backgroundColor: 'white',
+                      borderRadius: 7,
+                    }}
+                  />
+                </div>
+              </div>
+              <span style={{ fontSize: 110, fontWeight: 600 }}>
+                Tiles Launcher
+              </span>
             </div>
+            {title !== 'Tiles Launcher' && (
+              <div
+                style={{
+                  fontSize: 28,
+                  fontWeight: 400,
+                  maxWidth: 1000,
+                  textAlign: 'center',
+                }}
+              >
+                {title}
+              </div>
+            )}
           </div>
         </div>
       ),
       {
         width: 1200,
         height: 630,
-
       }
     )
   } catch (e: any) {

From e57a1da510ebfbe9b1398558c304802304a74495 Mon Sep 17 00:00:00 2001
From: Cursor Agent <cursoragent@cursor.com>
Date: Tue, 26 Aug 2025 11:01:31 +0000
Subject: [PATCH 2/2] Update OG image to use Tilekit branding instead of Tiles
 Launcher

Co-authored-by: hey <hey@ankeshbharti.com>
---
 pages/api/og.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/pages/api/og.tsx b/pages/api/og.tsx
index 0d381c1..15e4d38 100644
--- a/pages/api/og.tsx
+++ b/pages/api/og.tsx
@@ -9,7 +9,7 @@ export default async function handler(req: NextRequest) {
   try {
     const { searchParams } = new URL(req.url)
 
-    const title = searchParams.get('title') || 'Tiles Launcher'
+    const title = searchParams.get('title') || 'Tilekit'
 
     return new ImageResponse(
       (
@@ -39,7 +39,7 @@ export default async function handler(req: NextRequest) {
                 display: 'flex',
                 alignItems: 'center',
                 justifyContent: 'center',
-                marginBottom: title !== 'Tiles Launcher' ? 40 : 0,
+                marginBottom: title !== 'Tilekit' ? 40 : 0,
               }}
             >
               <div
@@ -80,10 +80,10 @@ export default async function handler(req: NextRequest) {
                 </div>
               </div>
               <span style={{ fontSize: 110, fontWeight: 600 }}>
-                Tiles Launcher
+                Tilekit
               </span>
             </div>
-            {title !== 'Tiles Launcher' && (
+            {title !== 'Tilekit' && (
               <div
                 style={{
                   fontSize: 28,