src/app/(pages)/about/page.tsx

@@ -1,36 +1,78 @@
+import { siteConfig } from '@/site.config';
+import { ExternalLinkIcon } from 'lucide-react';
+import Link from 'next/link';
+
 const AboutPage = async () => {
     return (
-        <div className='max-w-3xl mx-auto px-4 py-10'>
-            <p className='mb-4'>Hi, I’m Vitor Hideyoshi.</p>
+        <div className='container mx-auto w-full flex-1 px-4 py-12 md:py-16'>
+            <div className='mb-10 border-b border-border pb-8'>
+                <p className='mb-1 font-mono text-xs font-medium uppercase tracking-widest text-muted-foreground'>
+                    Dev Blog
+                </p>
+                <h1 className='text-3xl font-bold tracking-tight md:text-4xl'>
+                    About
+                </h1>
+            </div>
 
-            <p className='mb-4'>
-                I’m a software developer and I’ve always enjoyed programming.
-                Over the years, I’ve worked on all kinds of projects, from
-                infrastructure tools and data modeling systems to computational
-                physics simulations and agent-based AI tools.
-            </p>
+            <div className='max-w-2xl'>
+                <p className='mb-8 text-xl leading-snug'>
+                    Hi, I&apos;m{' '}
+                    <span className='font-semibold'>
+                        {siteConfig.author.name}
+                    </span>
+                    .
+                </p>
 
-            <p className='mb-4'>
-                For me, programming is more than work. It’s something I like to
-                explore, improve, and keep experimenting with.
-            </p>
+                <div className='space-y-4 leading-relaxed text-muted-foreground'>
+                    <p>
+                        I&apos;m a software developer and I&apos;ve always
+                        enjoyed programming. Over the years, I&apos;ve worked on
+                        all kinds of projects — from infrastructure tools and
+                        data modeling systems to computational physics
+                        simulations and agent-based AI tools.
+                    </p>
+                    <p>
+                        For me, programming is more than work. It&apos;s
+                        something I like to explore, improve, and keep
+                        experimenting with.
+                    </p>
+                    <p>
+                        I&apos;m especially drawn to building things that are
+                        simple, practical, and useful. I care about continuous
+                        improvement, both in the systems I build and in the way
+                        I approach problems.
+                    </p>
+                    <p>
+                        This blog is where I share what I learn along the way —
+                        ideas, experiments, and lessons from real projects. Hope
+                        we can learn and grow together.
+                    </p>
+                </div>
 
-            <p className='mb-4'>
-                I’m especially drawn to building things that are simple,
-                practical, and useful. I care about continuous improvement, both
-                in the systems I build and in the way I approach problems.
-            </p>
-
-            <p className='mb-4'>
-                This blog is where I share what I learn along the way, including
-                ideas, experiments, and lessons from real projects.
-            </p>
-
-            <p>
-                Feel free to explore my posts and check out my work on GitHub.
-                <br />
-                Hope we can learn and grow together.
-            </p>
+                <div className='mt-10 flex items-center gap-5 border-t border-border pt-8'>
+                    <span className='text-sm text-muted-foreground'>
+                        Find me on
+                    </span>
+                    <Link
+                        href={siteConfig.author.links.github}
+                        target='_blank'
+                        rel='noreferrer'
+                        className='flex items-center gap-1.5 text-sm font-medium transition-colors hover:text-primary'
+                    >
+                        <ExternalLinkIcon className='size-3.5' />
+                        GitHub
+                    </Link>
+                    <Link
+                        href={siteConfig.author.links.twitter}
+                        target='_blank'
+                        rel='noreferrer'
+                        className='flex items-center gap-1.5 text-sm font-medium transition-colors hover:text-primary'
+                    >
+                        <ExternalLinkIcon className='size-3.5' />
+                        Twitter
+                    </Link>
+                </div>
+            </div>
         </div>
     );
 };