marsultor/public-blog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

contact: three rows, zero pitch

Browse Source
This commit is contained in:
kbot
2026-07-06 21:52:49 -05:00
parent e58f2c7c7c
commit 6c1c751313
1 changed files with 6 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
components/portfolio/ContactTerminal.tsx
View File

@@ -48,27 +48,24 @@ export function ContactTerminal() {
}
return (
<section id="contact" aria-labelledby="contact-title" className="mx-auto max-w-7xl px-4 py-20 text-blacksite-text sm:px-6 lg:px-8">
<section id="contact" aria-labelledby="contact-title" className="mx-auto max-w-7xl px-6 py-28 text-blacksite-text sm:px-8 sm:py-36 lg:px-12">
<p className="section-label mb-12">CONTACT /.07</p>
<div className="border border-blacksite-line bg-blacksite-surface shadow-[0_32px_120px_rgba(0,0,0,0.42)]">
<div className="flex items-center justify-between gap-4 border-b border-blacksite-line px-5 py-4 sm:px-7">
<p className="font-mono text-xs text-blacksite-muted">&gt; open contact.channel</p>
<span className="section-label">SECURE HANDOFF</span>
<div className="flex items-center gap-3 border-b border-blacksite-line px-5 py-4 sm:px-7">
<span aria-hidden="true" className="size-2 rounded-full bg-signal-green shadow-[0_0_18px_rgba(182,255,0,0.5)]" />
<p className="font-mono text-xs text-blacksite-muted">&gt; contact.channel</p>
</div>
<div className="grid gap-0 lg:grid-cols-[0.8fr_1.2fr]">
<div className="border-b border-blacksite-line px-5 py-8 sm:px-7 lg:border-b-0 lg:border-r lg:px-10">
<p className="section-label mb-4">CONTACT TERMINAL</p>
<h2 id="contact-title" className="font-display text-3xl font-semibold uppercase tracking-[-0.04em] text-blacksite-text sm:text-5xl">
Send signal.
</h2>
<p className="mt-5 max-w-md text-sm leading-7 text-blacksite-muted sm:text-base">
Reach the operator directly for systems work, hardened infrastructure, or unusually interesting problems.
</p>
</div>
<div className="divide-y divide-blacksite-line">
{rows.map((row) => (
<div key={row.label} className="grid gap-3 px-5 py-5 sm:px-7 md:grid-cols-[7rem_minmax(0,1fr)] lg:px-8">
<div key={row.label} className="grid gap-3 px-5 py-6 sm:px-7 md:grid-cols-[7rem_minmax(0,1fr)] lg:px-8">
<p className="section-label pt-1">{row.label}</p>
{row.kind === "copy" ? (
<button
@@ -97,13 +94,6 @@ export function ContactTerminal() {
</div>
))}
<div className="grid gap-3 bg-blacksite-surface2/45 px-5 py-5 sm:px-7 md:grid-cols-[7rem_minmax(0,1fr)] lg:px-8">
<p className="section-label">AVAILABILITY</p>
<p className="flex items-center gap-3 font-mono text-sm uppercase tracking-[0.14em] text-blacksite-text">
<span aria-hidden="true" className="size-2 rounded-full bg-signal-green shadow-[0_0_18px_rgba(182,255,0,0.5)]" />
Open to interesting problems
</p>
</div>
</div>
</div>
</div>