doc: UI tweaks

Author: franky47

packages/docs/src/app/(pages)/_landing/hero.tsx

@@ -18,7 +18,6 @@ export function HeroSection() {
           <br />
           state manager for React
         </p>
-        <WorksWith className="mb-10" />
         <nav className="flex flex-wrap gap-4">
           <Link
             href="/docs"
@@ -46,6 +45,7 @@ export function HeroSection() {
             GitHub
           </a>
         </nav>
+        <WorksWith className="mt-10" />
       </aside>
       <aside className="relative my-4 xl:my-auto xl:flex-1 xl:pt-4">
         <LandingDemo />

packages/docs/src/app/(pages)/_landing/sponsors.tsx

@@ -17,7 +17,7 @@ export async function SponsorsSection() {
               <img
                 src={sponsor.img}
                 alt={sponsor.name ?? sponsor.handle}
-                className="mx-auto size-28 rounded-full"
+                className="mx-auto size-32 rounded-full"
                 width={128}
                 height={128}
               />

packages/docs/src/app/(pages)/_landing/works-with.tsx

@@ -4,10 +4,7 @@ import { ComponentProps } from 'react'
 export function WorksWith({ className, ...props }: ComponentProps<'div'>) {
   return (
     <div
-      className={cn(
-        'flex items-center justify-center gap-6 text-4xl',
-        className
-      )}
+      className={cn('flex items-center gap-6 text-3xl', className)}
       {...props}
     >
       <p className="sr-only">Works with</p>

packages/docs/src/app/(pages)/blog/[slug]/page.tsx

@@ -25,14 +25,16 @@ export default async function Page(props: {
       </div>
       <div className="container flex max-w-[900px] flex-col gap-4 px-4 text-sm sm:flex-row sm:items-center sm:justify-between lg:px-8">
         <a
-          href="https://x.com/fortysevenfx"
+          href="https://bsky.app/profile/francoisbest.com"
           className="flex items-center gap-3 rounded-lg px-2 py-1 hover:bg-foreground/5"
           aria-description="Author"
         >
           <Logo47ng size={8} />
           <div>
             <p className="font-semibold">François Best</p>
-            <p className="text-xs text-fd-muted-foreground">@fortysevenfx</p>
+            <p className="text-xs text-fd-muted-foreground">
+              @francoisbest.com
+            </p>
           </div>
         </a>
         {page.data.date && (