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

fix(portfolio): enforce accent discipline, display heading, and AA contrast

Browse Source
This commit is contained in:
kbot
2026-07-06 20:56:51 -05:00
parent ff4b556381
commit c0376df402
5 changed files with 16 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
components/portfolio/WorkIndex.tsx
View File

@@ -8,21 +8,21 @@ import { dossiers, type Accent, type Dossier } from "@/lib/portfolio";
const accentText: Record<Accent, string> = {
cyan: "text-signal-cyan",
orange: "text-signal-orange",
green: "text-signal-green",
green: "text-blacksite-text",
violet: "text-signal-violet",
};
const accentBorder: Record<Accent, string> = {
cyan: "border-l-signal-cyan",
orange: "border-l-signal-orange",
green: "border-l-signal-green",
green: "border-l-transparent",
violet: "border-l-signal-violet",
};
const accentGlow: Record<Accent, string> = {
cyan: "shadow-[0_0_32px_rgba(0,240,255,0.12)]",
orange: "shadow-[0_0_32px_rgba(255,90,31,0.12)]",
green: "shadow-[0_0_32px_rgba(182,255,0,0.1)]",
green: "",
violet: "shadow-[0_0_32px_rgba(128,93,255,0.12)]",
};
@@ -67,7 +67,7 @@ export function WorkIndex() {
transition={{ duration: 0.5, ease: "easeOut" }}
className="overflow-hidden border-y border-blacksite-line bg-blacksite-bg2/70"
>
<div className="section-label grid grid-cols-[minmax(0,1.35fr)_minmax(0,1fr)_minmax(0,0.8fr)_5rem] gap-4 border-b border-blacksite-line px-4 py-3 text-blacksite-faint max-md:hidden">
<div className="section-label grid grid-cols-[minmax(0,1.35fr)_minmax(0,1fr)_minmax(0,0.8fr)_5rem] gap-4 border-b border-blacksite-line px-4 py-3 text-blacksite-muted max-md:hidden">
<span>PROJECT</span>
<span>TYPE</span>
<span>STATUS</span>
@@ -106,7 +106,7 @@ export function WorkIndex() {
>
<div className="grid gap-3 md:grid-cols-[minmax(0,1.35fr)_minmax(0,1fr)_minmax(0,0.8fr)_5rem] md:items-start md:gap-4">
<div className="min-w-0">
<p className="section-label mb-1 text-blacksite-faint md:hidden">
<p className="section-label mb-1 text-blacksite-muted md:hidden">
PROJECT
</p>
<div className="flex items-baseline gap-3">
@@ -122,6 +122,9 @@ export function WorkIndex() {
>
{dossier.title}
</h3>
{dossier.accent === "green" ? (
<span aria-hidden="true" className="size-2 rounded-full bg-signal-green shadow-[0_0_14px_rgba(182,255,0,0.45)]" />
) : null}
</div>
</div>
@@ -138,11 +141,10 @@ export function WorkIndex() {
<p className="section-label mb-1 text-blacksite-faint md:hidden">
STATUS
</p>
<p
className={`font-mono text-xs uppercase tracking-[0.16em] ${
liveStatus ? "text-signal-green" : "text-blacksite-muted"
}`}
>
<p className="flex items-center gap-2 font-mono text-xs uppercase tracking-[0.16em] text-blacksite-muted">
{liveStatus ? (
<span aria-hidden="true" className="size-2 rounded-full bg-signal-green shadow-[0_0_14px_rgba(182,255,0,0.45)]" />
) : null}
{dossier.status}
</p>
</div>