Pattern · Listing Section Card

Component set: State (Collapsed / Expanded) × Supporting Text (True / False) × Action (True / False) × Progress (Upcoming / Current / Complete). Below: one representative of each axis pairing.

State=Collapsed · Supporting Text=True · Action=True · Progress=Upcoming
2
Title & Description Applies to all marketplaces
State=Collapsed · Supporting Text=False · Action=False · Progress=Complete
Photos
State=Collapsed · Supporting Text=True · Action=False · Progress=Upcoming
3
Category & condition Required for Poshmark and eBay
State=Collapsed · Supporting Text=False · Action=True · Progress=Upcoming
4
Shipping
State=Expanded · Supporting Text=True · Action=True · Progress=Current
2
Title & Description Applies to all marketplaces
Vintage 90s Knit Sweater — Pastel Purple
Soft pastel purple knit sweater with a vintage 90s look. Wool blend, great condition, size medium.
State=Expanded · Supporting Text=False · Action=False · Progress=Upcoming
5
Pricing
$—
State=Expanded · Supporting Text=True · Action=False · Progress=Complete
Photos 6 uploaded · primary set
6 photos uploaded. Drag to reorder. First photo is your cover.

Nested · Step Badge

State (Current / Complete / Upcoming) × Selected (True / False) · 30 × 30. Lives inside the Section Card header and the sidebar progress rail.

1Current
Selected=True
Complete
Selected=True
Complete
Selected=False
1Upcoming
Selected=False

Nested · Text Stack Section Header

Supporting Text (True / False) · Label as free text. 2-line rhythm: title-md (16/24) + body-sm (13/18).

Supporting Text = True Title & Description Applies to all marketplaces
Supporting Text = False Photos