EmilandClaude Sonnet 5
b5ffc67a82
New design: studio backdrop with a perspective floor and X/Z axis lines, an orientation gizmo that orbits on scroll, Bricolage Grotesque and Instrument Sans (bundled, no build-time network). Projects are laid out as plates by a row planner that keeps every row full for any count; a demo image from the repo root is shown when present, otherwise a generated voxel sculpture. Text and projects still come live from Gitea. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01XtcZtnG4GQA1d6mW5PNrS9
25 lines
833 B
TypeScript
25 lines
833 B
TypeScript
'use client'
|
|
|
|
import { useScrolled } from '@/lib/useScroll'
|
|
import styles from './topbar.module.css'
|
|
|
|
type Props = { name: string; mailHref: string; showProjects: boolean }
|
|
|
|
export default function TopBar({ name, mailHref, showProjects }: Readonly<Props>) {
|
|
const scrolled = useScrolled()
|
|
return (
|
|
<header className={`${styles.bar} ${scrolled ? styles.solid : ''}`}>
|
|
<div className={styles.inner}>
|
|
<a className={styles.mark} href="#top">{name}</a>
|
|
<nav className={styles.nav} aria-label="Sections">
|
|
{showProjects && <a href="#projects">Projects</a>}
|
|
<a href="#skills">Skills</a>
|
|
<a href="#experience">Experience</a>
|
|
<a href="#education">Education</a>
|
|
</nav>
|
|
<a className={styles.mail} href={mailHref}>Email me</a>
|
|
</div>
|
|
</header>
|
|
)
|
|
}
|