SYSTEM

Dialog

The all-work modal: a sheet over a flat scrim.

Layers shadcn: Dialog

Anatomy

Panel the shared layer: paper, a 1px ink frame, half a module of padding at the sides
Head two modules: the title in the clean cut and a close cell, on an ink rule
Column head one module: client, industry, year in the label voice, on a hairline; desktop only
Rows three modules (four on a phone): the client in the clean cut, its description, then the metadata
Hover the row’s hairline develops in --state from the pointer and the title turns --state; no tint
Scrim --scrim, burned across the viewport at a 4px dot
Burn 360ms both ways, fired where “View all” was pressed
Stack z-index 70, the contact popover’s, above the rail and the mobile header

As AllWorkModal.tsx sets them.

Decisions

  • A modal, not a page

    Reinstated in July 2026 in place of a /work index: a navigation aid, not a second card index. No cards, no video, no posters, no sort control.

  • On the module

    A two-module head, a one-module column head, three-module rows and one module of gutter round the panel. Replaced 16 and 20px paddings that sat off it.

  • Rows that light

    Each row clipped its own overflow, which cut the developing hairline and its flare away, so the rows never lit. Now the list hides the sideways bleed and only the last row clips.

  • Burned, not faded

    Replaced a 150ms scrim fade and a hard cut on its panel, the last layer still fading in.

  • The scrim

    Its hardcoded black at 70% moved onto --scrim with the contact popover’s.