fix(blog): center footer, fix dark mode, fix avatar (#1559)

apps/sim/app/(landing)/building/layout.tsx

@@ -8,7 +8,7 @@ export default function BuildingLayout({ children }: { children: React.ReactNode
     <>
       <Nav hideAuthButtons={false} variant='landing' />
       <main className='relative'>{children}</main>
-      <Footer />
+      <Footer fullWidth={true} />
     </>
   )
 }

apps/sim/app/(landing)/building/openai-vs-n8n-vs-sim/openai-n8n-sim.tsx

@@ -1,4 +1,5 @@
 import Image from 'next/image'
+import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'
 import { soehne } from '@/app/fonts/soehne/soehne'
 
 /**
@@ -139,27 +140,32 @@ export default function OpenAiN8nSim() {
                 OpenAI AgentKit vs n8n vs Sim: AI Agent Workflow Builder Comparison
               </h1>
               <div className='mt-4 hidden items-center justify-end gap-2 sm:flex'>
-                <Image
+                <a
-                  src='/building/openai-vs-n8n-vs-sim/emir-karabeg.png'
+                  href='https://x.com/karabegemir'
-                  alt='Emir Karabeg'
+                  target='_blank'
-                  width={24}
+                  rel='noopener noreferrer author'
-                  height={24}
+                  aria-label='@karabegemir on X'
-                  className='rounded-full'
+                  className='block'
-                />
+                >
-                <p className='text-[14px] text-gray-600 leading-[1.5] sm:text-[16px]'>
+                  <Avatar className='size-6'>
-                  Written by{' '}
+                    <AvatarImage
-                  <a
+                      src='/building/openai-vs-n8n-vs-sim/emir-karabeg.png'
-                    href='https://x.com/karabegemir'
+                      alt='Emir Karabeg'
-                    target='_blank'
+                    />
-                    rel='noopener noreferrer author'
+                    <AvatarFallback>EK</AvatarFallback>
-                    className='text-gray-600 hover:text-gray-900'
+                  </Avatar>
-                    itemProp='author'
+                </a>
-                    itemScope
+                <a
-                    itemType='https://schema.org/Person'
+                  href='https://x.com/karabegemir'
-                  >
+                  target='_blank'
-                    <span itemProp='name'>Emir Karabeg</span>
+                  rel='noopener noreferrer author'
-                  </a>
+                  className='text-[14px] text-gray-600 leading-[1.5] hover:text-gray-900 sm:text-[16px]'
-                </p>
+                  itemProp='author'
+                  itemScope
+                  itemType='https://schema.org/Person'
+                >
+                  <span itemProp='name'>Emir Karabeg</span>
+                </a>
               </div>
             </div>
           </div>
@@ -180,24 +186,29 @@ export default function OpenAiN8nSim() {
               </time>
               <meta itemProp='dateModified' content='2025-10-06T00:00:00.000Z' />
               <div className='flex items-center gap-2 sm:hidden'>
-                <Image
+                <a
-                  src='/building/openai-vs-n8n-vs-sim/emir-karabeg.png'
+                  href='https://x.com/karabegemir'
-                  alt='Emir Karabeg'
+                  target='_blank'
-                  width={24}
+                  rel='noopener noreferrer author'
-                  height={24}
+                  aria-label='@karabegemir on X'
-                  className='rounded-full'
+                  className='block'
-                />
+                >
-                <p className='text-[14px] text-gray-600 leading-[1.5]'>
+                  <Avatar className='size-6'>
-                  Written by{' '}
+                    <AvatarImage
-                  <a
+                      src='/building/openai-vs-n8n-vs-sim/emir-karabeg.png'
-                    href='https://x.com/karabegemir'
+                      alt='Emir Karabeg'
-                    target='_blank'
+                    />
-                    rel='noopener noreferrer author'
+                    <AvatarFallback>EK</AvatarFallback>
-                    className='text-gray-600 hover:text-gray-900'
+                  </Avatar>
-                  >
+                </a>
-                    Emir Karabeg
+                <a
-                  </a>
+                  href='https://x.com/karabegemir'
-                </p>
+                  target='_blank'
+                  rel='noopener noreferrer author'
+                  className='text-[14px] text-gray-600 leading-[1.5] hover:text-gray-900'
+                >
+                  Emir Karabeg
+                </a>
               </div>
             </div>
 

apps/sim/app/(landing)/components/footer/footer.tsx

@@ -215,6 +215,12 @@ export default function Footer({ fullWidth = false }: FooterProps) {
               >
                 Enterprise
               </Link>
+              <Link
+                href='/building'
+                className='text-[14px] text-muted-foreground transition-colors hover:text-foreground'
+              >
+                Building
+              </Link>
               <Link
                 href='/changelog'
                 className='text-[14px] text-muted-foreground transition-colors hover:text-foreground'

apps/sim/app/theme-provider.tsx

@@ -19,7 +19,8 @@ export function ThemeProvider({ children, ...props }: ThemeProviderProps) {
     pathname.startsWith('/invite') ||
     pathname.startsWith('/verify') ||
     pathname.startsWith('/changelog') ||
-    pathname.startsWith('/chat')
+    pathname.startsWith('/chat') ||
+    pathname.startsWith('/building')
       ? 'light'
       : undefined