- drop headshot photo (coherence break vs. full terminal aesthetic) - replace FA icons with plain-text brackets ([github], [linkedin], [email]) - remove Font Awesome CDN dependency - nav logo tk → ~/; theme toggle fa-sun/fa-moon → [light]/[dark] - reorder home sections: projects before skills/journey - add font-mono + opacity-70 to timeline descriptions (#2 bug + #8 polish) - uniform opacity-70 across hero bio, project desc, timeline desc - add hover:bg-surface-raised to ProjectCard article - drop journey badge count (noise) - change status ● online → ● available
57 lines
2.1 KiB
TypeScript
57 lines
2.1 KiB
TypeScript
export default function Hero() {
|
||
return (
|
||
<section className="mb-16">
|
||
<div className="flex flex-col gap-3">
|
||
<div>
|
||
<p className="font-mono text-base font-bold text-[var(--color-text)]">
|
||
<span className="text-[var(--color-accent-green)] select-none mr-2" aria-hidden="true">❯</span>
|
||
tyler koenig
|
||
</p>
|
||
<p className="font-mono text-sm text-[var(--color-text-label)] mt-0.5">
|
||
SOC Helpdesk I · Homelab Operator
|
||
</p>
|
||
</div>
|
||
|
||
<p className="font-mono text-sm text-[var(--color-text)] leading-relaxed max-w-lg opacity-70">
|
||
I write software and run infrastructure that goes well past what my
|
||
job title implies. Games, AI tooling, mobile apps, and a homelab
|
||
running 20+ self-hosted services on segmented VLANs. Continuously
|
||
learning by building things that actually work.{' '}
|
||
<span className="animate-cursor text-[var(--color-accent-green)]" aria-hidden="true">█</span>
|
||
</p>
|
||
|
||
<div className="flex flex-wrap items-center gap-x-5 gap-y-1">
|
||
<span className="font-mono text-sm text-[var(--color-accent-green)]">
|
||
● available
|
||
</span>
|
||
<a
|
||
href="https://github.com/lerko96"
|
||
target="_blank"
|
||
rel="noopener noreferrer"
|
||
aria-label="GitHub"
|
||
className="font-mono text-sm text-[var(--color-text-label)] hover:text-[var(--color-text)]"
|
||
>
|
||
[github]
|
||
</a>
|
||
<a
|
||
href="https://www.linkedin.com/in/tyler-koenig"
|
||
target="_blank"
|
||
rel="noopener noreferrer"
|
||
aria-label="LinkedIn"
|
||
className="font-mono text-sm text-[var(--color-text-label)] hover:text-[var(--color-text)]"
|
||
>
|
||
[linkedin]
|
||
</a>
|
||
<a
|
||
href="mailto:tylerkoenig96@gmail.com"
|
||
aria-label="Email"
|
||
className="font-mono text-sm text-[var(--color-text-label)] hover:text-[var(--color-text)]"
|
||
>
|
||
[email]
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
);
|
||
}
|