Goldie Blocks

The Goldie Card

Owner rulings 2026-10-03 — one flip card for every list (Projects, Documents, Libraries, a Library's Documents). Each corner has one job; the first tap selects and the second opens; only the title is renamed on the card; Goldie's edits are accepted or rejected for the whole card; lists are sortable by drag and drop, kept per person, new cards on top, a Library's own Documents in the publisher's order. Supersedes "a listed Project or Library carries no menu" and the side-panel About for a listed card.

In plain terms: every list in Goldie Blocks shows its files on the same index card. The front is the file's name. Turn it over (the G) and you see Goldie's side: the tags she filed it under, a short guide, and who works on it. Tap once to pick a card up, tap again to open it. You can shuffle the cards into your own order and they stay where you put them, the way you would arrange files on your own desk. A Library's own documents keep the order their publisher chose.

Flip retired 2026-10-04. The flip card is gone in favour of the expandable card (goldie-card-expandable.tsx): a tap unfolds the tags and guide above the title, and the title opens the item. A pending Goldie edit holds the card open, marked up in the panel with reject and accept at its foot. Lock, visibility and membership sit on the count line after a dot. The page header card is the wide variant and starts open. Sections below that describe the G, the back face or the flip are historical.

In plain terms: the index card no longer turns over; it unfolds.

Promoted from the reference copy plans/references/flip_card/goldie-card-spec.md (the HTML prototype's rule sheet). The tokens are src/shared/ui/molecules/goldie-card/goldie-card.css; the component is goldie-card.tsx (now deleted), whose "Spec N" comments cite the numbered sections below; the list and its drag are goldie-card-list.tsx.

1. Where the card is used

SpaceLevelLabelCountOpens
Workspace (gold)ProjectsPROJECTDocumentsThe Project's page
Workspace (gold)DocumentsDOCUMENTits ModulesThe Document
Library (violet)LibrariesLIBRARYDocumentsThe Library's page
Library (violet)DocumentsDOCUMENTits ModulesThe Document
  • Colour says which space you are in: gold is the workspace, violet the Library. Colour never encodes category.
  • The lock follows ownership, not space. A Library you own is violet, has no lock, and can be renamed.
  • The same component, size and layout at all four levels. Only the icon, label, badges and menu items change.
  • The home page's three recent Documents and Libraries are not a list you arrange, and keep their own cards.

2. Anatomy

Each corner has one job. Do not move things between corners.

CornerFrontBack
Top leftIcon box. Opens the menu.Same
Beside itTwo-line label: type and badges, then countSame
Top rightG. Flips the card.Same
Bottom leftTitle, largeTitle, small
Bottom rightArrow. Opens the item.Author circles, tooltip with names
MiddleEmptyTags row, then guide

The back is Goldie's side: the tags she classified and the guide she reads. It is called the About face. The G's tooltip says "Flip to About" on the front and "Flip Back" on the back.

3. Grid and dimensions

Every value is a multiple of 4, on the 24 macro grid. The values live in goldie-card.css and the component; this table states them once.

ItemValue
Corner cell and touch target48, flush to the card's corner
Visible box (icon box, tick, cross)32
Inset of text and of the icon box12, carried by each element; the card has no padding
Card heightshut 144, open 432 in a list, 240 as a page header (owner, 2026-10-05, see below; 240 fixed on 2026-10-03, 216 before)
Card widthfluid, minimum 288; radius 12
Back face budget48 top + 8 + 20 tags + 16 + 80 guide + 12 + 40 title + 12 = 240
Tag20 high (owner, 2026-10-03; was 24), 8 side padding, 8 gap, 11px
Guide80 high, four lines (owner, 2026-10-03), 13px on a 20 line, 16 fade
Author circle24, 10px initials, inside a 48 touch target (owner, 2026-10-03; was 32)
G and arrow glyphs16, 2px stroke; hover fills a 24 ink circle (owner, 2026-10-03; were 20, the arrow 24 before that)
Front title24px on a 28 line, clamped at 4 lines as a safety net
Back title16px on a 20 line, two lines always reserved
Rename box72 high, 16px text, three lines
Menuopens 4 below the icon box, min width 192, rows 40

4. Content rules

  • The title is never truncated in data; the front clamps at four lines.
  • Tags sit on one line, never wrap, and scroll sideways; the right-edge fade says there are more.
  • The guide is a summary (aim under 300 characters) and scrolls in its 80. With no guide, the guide area reads "Ask Goldie to write a guide for this {project, document, library…}" in the muted colour (owner, 2026-10-03).
  • The top label line never wraps: type, lock, visibility badge, membership badge.
  • Library badges: visibility Private, Shared or Public (soft tint); membership Yours or Joined (filled dark). A Document copied into a Library keeps its Published badge (owner, 2026-10-02).

5. States

StateTop rightBottom rightBody tap
Resthiddenhiddenselects
Selected, frontGarrowopens
Selected, backGauthor circlesopens
Menu opencloses the menu
Renaminghiddenticknothing
Goldie edit pendingG, with a dot if the back changedcross above ticknothing
  • The first tap selects; a tap on a selected card, or its arrow, opens it. Opening on touch takes two taps, accepted for a quieter list. Editing is never triggered by tapping text.
  • One card is selected at a time; a tap on empty page clears it, as does Escape. Selection is a neutral ink outline, never the space colour. Opening the menu selects the card.
  • Rename: only your own cards, only the title. Tick or Enter accepts; Escape, or a tap outside the card, cancels. No cross for rename. Rename goes through the same write as everywhere else.
  • A Goldie edit: tick and cross, the gold outline and the dot. Accepted or rejected for the whole card, not per field. Removed text is struck in red and added text highlighted green; on hover or keyboard focus the cross fills red (--gc-reject) and the tick green (--gc-accept). The rename tick stays ink (owner, 2026-10-03).
  • The card cannot be opened while renaming or while a Goldie edit waits.
CardItems
Project (yours)Rename, Open project, Share, Delete
Document (yours)Rename, Open document, Save to library, Duplicate, Delete
Library (yours)Rename, Open library, Share, Delete
Library (not yours)Open library, Join library or Leave library
Library documentOpen document, Copy to workspace

Share on a card is the page header's Share for that card's folio (owner, 2026-10-03, reversing "no card menu carries Share" of 2026-10-01). Delete and Duplicate stay on the card after the spec's rows (owner, 2026-10-03), Delete behind a confirm that names its scope. Copy to workspace asks which Project the copy goes into, then opens it.

No side-panel About for a listed card

A listed card draws no About in the side panel (owner, 2026-10-03). Its guide and tags are edited on its own page; the side panel's About is always the page's own. Goldie in the side panel still follows the selected card.

6. Flip

A 0.5s turn on the Y axis; both faces the same height. The hidden face is inert and hidden from screen readers. With reduced motion the faces switch without a turn. After a flip, focus moves to the G on the face now showing.

7. Colour and type

Gold #EBB000 is the seed; every other colour is derived in OKLCH. Each space sets ground, tint (card fill), chip, mid and ink. DM Sans throughout: the card is application chrome, not document text.

8. Desktop

The card does not change on desktop. Cards sit in a grid, repeat(auto-fill, minmax(288px, 1fr)), 12 apart, 24 from 768 wide. Hover shows the icon box's faint border and the author tooltip. Tab reaches the icon box, the G and the arrow; Enter on the arrow opens.

The page's own header card

In plain terms: the cover of the file you are standing in. It is the same card as the ones listed below it, only wider and, on a computer, shorter.

Every container page (Workspace, Project, a Library's own page) and the Libraries page heads with the same Goldie Card at its header size (owner, 2026-10-03), standing above its list rather than wrapping it.

  • Width: the page column's full width.
  • Height: on a phone it is the list card's size (240, guide four lines), since a list card already fills the screen. From 768 wide it is 192, its guide two lines: 48 top + 8 + 20 tags + 16 + 40 guide + 12 + 48 bottom row. The value lives in goldie-card.css (data-size="header").
  • It opens nothing — you are already in it — so its front has no arrow. A tap selects it, which puts Goldie in the side panel on the page's own folio; the side panel's About is the page's own.
  • Its count line says what it holds, then "Working copy" and, on a Workspace, how many Libraries Goldie searches.
  • Its menu: Rename (yours), Share (the page header's Share dialog), Join library or Leave library on a Library you do not own, and Delete for a Project or a Library you own. The Libraries page's card has no menu.
  • Replaced: the banner card (WorkspaceFolio / ProjectFolio with pageHeader), its Join library foot row, and the Library status badge on it, whose facts are now the visibility and membership badges.

The header card opens to 240; every card height is a whole number of 48s — 2026-10-05

A page's header Goldie Card spans the 960 column and opens to 240; its title is 28px on a 32px line, open and shut, up to two lines; the owner still shows in its foot. The three heights are three, five and nine rows of 48: shut 144, header open 240, listed card open 432. Owner rulings 2026-10-05 (GB-353). The first ruling that day set the header at 240 against the Wide Canvas study, reversing the 2026-10-04 ruling of 360 that lived in the expandable card's docblock. Later the same day the owner put all three heights on the 48 rhythm, which took the listed card from 456 to 432; the header was tried at 288 (six rows) and sent back to 240 (five rows) the same day, the owner choosing to give the guide fewer rows rather than the cover sheet more. The heights sit in one table, goldie-card-geometry.ts, pinned by its node test, which also pins the rhythm.

In plain terms: three card sizes, each a whole number of the same 48px row, so cards stack on the grid in every state.

What the listed card's move does inside it: its panel loses one 24px line and scrolls a line sooner.

In plain terms: the file's cover is wider and shorter, and its name is set large enough to lead the page.

Two points the study left open, settled here by the least surprising behaviour:

  • The grey header band's edge, and the card opening across it (owner rulings 2026-10-05, later the same day, replacing the midline rule recorded that morning). One rule for every page: 48 above the head, on the page and in the side panel alike; the band's seam 48 below the head's shut height; and the Add row 48 below whichever is lower, the seam or the open card's foot. So a shut header card (144) has the seam 48 below it and Add 48 below that; opening to 240 it crosses the seam by 48 and the row below moves down 48, on the card's own timing, one row rather than the two the full height would cost. In the 1088 window: on a Project or Document the card sits at 96, the band is 240 (seam at 288), Add at 336 shut and 384 open; on Home, whose head is a 48 row at 96, the band is 144 (seam at 192) and Add at 240. The band never follows the card as it folds. The morning's midline rule (band 144 for the 240 card, half on and half off) is retired; so is the study's fixed 192 and the 24 lid of 2026-10-03.
  • A two-line title with a long guide. The card stays its one open size whatever it holds (the 2026-10-04 two-sizes rule). A title on two lines takes 64 and the guide panel takes what is left and scrolls, its fade saying there is more. Measured on 2026-10-05: at 240 a one-line title leaves the panel 52 (the GUIDE label and one line) and a two-line title a 20 sliver that scrolls; at 288, tried and set aside the same day, they would have been 100 and 68. The owner chose the five-row card and the smaller guide. The whole guide is always readable in the side panel's About, so the title is not clamped to one line to spare the guide: the page's name leads.

The Document's module column keeps its 768 measure (--document-column), 640 of text inside it, centred under the wide header.

People stay in the bottom right corner, and open a list — 2026-10-05

A card's people are a stack of round initials discs at the title's right, in the same corner open and shut: the owner, up to two others, then "+N". Pressing the stack opens a list of everyone on the card, each with their role; where the viewer may share, the list ends in a Share button that opens the Share modal. Owner ruling 2026-10-05. It reverses the 2026-10-04 ruling that an open card widened its discs into name pills in a foot row on the left: the pills moved the people across the card, and had no room for more than one or two names.

In plain terms: the initials badge no longer jumps to the other side and stretches into a name when the card unfolds. It stays put, and clicking it shows who is on the card and offers Share.

  • The press belongs to the stack alone: it neither folds nor unfolds the card, and the list's own presses stay off the card too.

  • A viewer who may not share sees the list without the button. The card takes onShare only from a consumer that already offers Share in the card's menu, so the two cannot disagree.

  • The foot row an open card kept for the pills is gone; its 48 goes to the guide panel, and the card's three heights do not move.

  • While a Goldie proposal waits, its cross and tick take the people's corner, cross above tick, and the stack returns once it is decided. No foot row is added, so the card's height holds through a proposal.

  • Not yet fed: the cards pass the owner and the last editor, as before. Listing everyone a card is shared with needs the membership list brought to each card, which is backend work not done here.

  • One Share modal, one confirm modal (owner, 2026-10-05). A card's Share, from its menu or its people list, opens the page's own two-pane Share modal on its Share tab; the small card-only Share dialog of 2026-10-03 is retired. A weighty Delete confirmation is the same two-pane modal, not a look-alike of it.

The component is goldie-card-people.tsx; its People and PeopleReadOnly stories pin the corner, the "+N" and the Share button.

One Goldie chip for tags and guide — 2026-10-05

An open card carries one Goldie chip, after its tags and clear of their scroll: "Goldie, pen tags and guide" while the card has neither, "Goldie, update tags and guide" once it has either. The guide never carries a prompt of its own. Owner ruling 2026-10-05, replacing the "Ask Goldie to tag" chip that showed only on a card with no tags.

In plain terms: one small button asks Goldie to write, or refresh, both the labels and the note on a card.

  • The chip selects the card and drops the request in Goldie's chat; her answer returns as a proposal with the cross and tick.
  • While tags or the guide are missing the chip always shows. With both in place it shows under the pointer or the keyboard's focus only, and always where there is no hover (a phone).
  • No chip for a viewer who cannot ask (no handler passed), nor while a proposal waits.

Lists are sortable

In plain terms: you can drag your matters into your own order, and they stay put next time — on any device you are signed in on. Something new always lands on top until you place it.

  • Sortable: a Workspace's Projects, a Project's Documents, and your own list of Libraries. Not sortable: a Library's own Documents (the publisher sets that order) and the Marketplace view.
  • The gesture is the document canvas's: a mouse drag starts after 4px, a touch drag after a 450ms hold, so a tap still selects and a swipe still scrolls. The whole card is the handle; there is no grip. The lift (scale, shadow, the faded slot left behind) is the canvas's own, imported through the Stack's public exports.
  • The click a mouse drop leaves behind is swallowed, so the dropped card neither selects nor opens.
  • The order is saved per person in listOrders (schema overview): the signed-in account's, else the browser's. A card the saved order does not name is new and draws on top, newest first. Dragging inside a filtered view reorders the shown cards in their own slots and leaves the hidden ones where they were.

Open questions

  • Long lists: at 240 a card, a Library of 60 Documents is a lot of scrolling. A compact row view may be needed.
  • Presence on the front; touch density on the back; a "flip all" control.
  • Whether the dot should mean "any pending edit".
  • The list toolbar's Insert plus and words sit 4px right of the card's icon box and title; lining them up is a visual call for the owner.

On this page