Build portfolio site with Next.js, Tailwind CSS, and dark mode
- Add CLAUDE.md with project conventions and architecture notes
- Create Navbar (sticky, backdrop blur, mobile menu) and Footer
- Build homepage sections: Hero, FeaturedProjects, Skills, CurrentWork, CallToAction
- Add /projects, /about, and /contact pages
- Create reusable ProjectCard and Badge components
- Centralise project data in content/projects.json with featured flag
- Add class-based dark mode toggle (default dark, persisted to localStorage)
- Refactor globals.css: remove conflicting prefers-color-scheme media query
- Fix two-instance ThemeToggle sync bug in Navbar
- Fix key={index} anti-pattern in timeline, stale closure in setOpen
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,34 @@
|
||||
const items = [
|
||||
{
|
||||
title: 'Portfolio site',
|
||||
description: 'Designing and building this site with Next.js and Tailwind CSS.',
|
||||
},
|
||||
{
|
||||
title: 'Open-source CLI tool',
|
||||
description: 'A developer utility written in Go for automating local environments.',
|
||||
},
|
||||
{
|
||||
title: 'Design system',
|
||||
description: 'A component library for internal use — exploring composability patterns.',
|
||||
},
|
||||
{
|
||||
title: 'Learning Rust',
|
||||
description: 'Working through systems programming concepts and small weekend projects.',
|
||||
},
|
||||
]
|
||||
|
||||
export default function CurrentWork() {
|
||||
return (
|
||||
<section className="mx-auto max-w-5xl px-6 py-16">
|
||||
<h2 className="mb-8 text-2xl font-semibold text-zinc-900 dark:text-white">What I'm Working On</h2>
|
||||
<ul className="divide-y divide-zinc-200 border-y border-zinc-200 dark:divide-zinc-800 dark:border-zinc-800">
|
||||
{items.map(({ title, description }) => (
|
||||
<li key={title} className="flex flex-col gap-1 py-5 transition-colors hover:text-zinc-900 dark:hover:text-white sm:flex-row sm:gap-8">
|
||||
<span className="w-48 shrink-0 text-sm font-medium text-zinc-900 dark:text-white">{title}</span>
|
||||
<span className="text-sm text-zinc-600 dark:text-zinc-400">{description}</span>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user