diff --git a/components/portfolio/WorkIndex.tsx b/components/portfolio/WorkIndex.tsx index cb5b0c7..fbe945e 100644 --- a/components/portfolio/WorkIndex.tsx +++ b/components/portfolio/WorkIndex.tsx @@ -3,28 +3,11 @@ import { useState } from "react"; import { m, useReducedMotion } from "motion/react"; -import { dossiers, type Accent, type Dossier } from "@/lib/portfolio"; +import { dossiers, type Dossier } from "@/lib/portfolio"; -const accentText: Record = { - cyan: "text-signal-cyan", - orange: "text-signal-orange", - green: "text-blacksite-text", - violet: "text-signal-violet", -}; - -const accentBorder: Record = { - cyan: "border-l-signal-cyan", - orange: "border-l-signal-orange", - green: "border-l-transparent", - violet: "border-l-signal-violet", -}; - -const accentGlow: Record = { - cyan: "shadow-[0_0_32px_rgba(0,240,255,0.12)]", - orange: "shadow-[0_0_32px_rgba(255,90,31,0.12)]", - green: "", - violet: "shadow-[0_0_32px_rgba(128,93,255,0.12)]", -}; +const activeText = "text-signal-green"; +const activeBorder = "border-l-signal-green"; +const activeGlow = "shadow-[0_0_32px_rgba(182,255,0,0.12)]"; function isLiveStatus(status: string) { return /\b(live|deployed)\b/i.test(status); @@ -42,23 +25,11 @@ export function WorkIndex() {
-
-
-

WORK INDEX /.04

-

- Eight field dossiers. No thumbnails. -

-
-

- Proof-first project records: mission, system constraints, and measurable - outcomes are exposed on hover, keyboard focus, touch, and reduced motion. -

-
+

+ WORK /.02 +

PROJECT + PROOF TYPE - STATUS YEAR
@@ -98,10 +69,8 @@ export function WorkIndex() { setActiveId(null); } }} - className={`group border-l-2 border-l-transparent bg-blacksite-bg2/20 px-4 py-5 outline-none transition duration-200 focus-visible:outline-2 focus-visible:outline-offset-[-2px] focus-visible:outline-signal-cyan ${ - isActive - ? `${accentBorder[dossier.accent]} bg-blacksite-surface/70 ${accentGlow[dossier.accent]}` - : "" + className={`group border-l-2 border-l-transparent bg-blacksite-bg2/20 px-4 py-6 outline-none transition duration-200 focus-visible:outline-2 focus-visible:outline-offset-[-2px] focus-visible:outline-signal-green ${ + isActive ? `${activeBorder} bg-blacksite-surface/70 ${activeGlow}` : "" } ${shouldDim ? "opacity-45" : "opacity-100"}`} >
@@ -115,9 +84,7 @@ export function WorkIndex() {

{dossier.title} @@ -129,6 +96,15 @@ export function WorkIndex() {

+

+ PROOF +

+

+ {dossier.proofHeadline} +

+
+ +

TYPE

@@ -137,18 +113,6 @@ export function WorkIndex() {

-
-

- STATUS -

-

- {liveStatus ? ( -

-
-

YEAR @@ -186,6 +150,16 @@ export function WorkIndex() { ) : null}

+
+

STATUS

+

+ {liveStatus ? ( +

+
+

STACK

@@ -203,7 +177,7 @@ export function WorkIndex() {

PROOF

{proof?.metric ?? proof?.label ?? dossier.result}

@@ -222,7 +196,7 @@ export function WorkIndex() { href={link.href} target="_blank" rel="noopener noreferrer" - className="border border-blacksite-line bg-blacksite-surface2 px-3 py-2 font-mono text-xs uppercase tracking-[0.14em] text-blacksite-text transition-colors hover:border-signal-cyan hover:text-signal-cyan focus-visible:outline-signal-cyan" + className="border border-blacksite-line bg-blacksite-surface2 px-3 py-2 font-mono text-xs uppercase tracking-[0.14em] text-blacksite-text transition-colors hover:border-signal-green hover:text-signal-green focus-visible:outline-signal-green" > {link.label} ↗ @@ -230,7 +204,7 @@ export function WorkIndex() {
) : (

- Closed / internal artifact + Closed source

)}