Parts / Detail page parts

Detail page parts

Every record page is built from these parts. The default uses the white header; the navy header only when the brief asks.

Order

Header · pick onearrow_forwardSections · pick anyarrow_forwardTrail · pick onearrow_forwardBottom · one or none
arrow_backRecord numbermore_vert
categoryCategory!
ABRequester
White header (default)Number, category and priority when they exist, the person, call and chat
arrow_backRecord titlemore_vert
AB
Name
Detail
Navy headerOnly when the brief asks

Sections · pick any

date_range
Label
Value
Detail rowIcon, caption, value
Longer text that runs over two lines or more
DescriptionFree text
M
Animal IDCommon nameScientific nameEnclosure
AnimalFull animal card
AB
Name
Detail
CD
Name
Detail
PeopleApprovers, assignees
LabelValue
LabelValue
LabelValue
LabelValue
Two-column factsShort facts side by side
imageimagepicture_as_pdf
AttachmentsFiles and photos

Trail · pick one

chatActivityAdd a comment
ActivityComments and changes together; people discuss the record
check_circle
EventDate
HistoryChanges only

Bottom · one or none

Current status • timeStatus
Status barCurrent status and how long ago
Decision barWhen the viewer must decide
One main actionOne next step

Assembled

arrow_backRecord numbermore_vert
categoryCategory!
ABRequester
date_range
Label
Value
M
Animal IDCommon nameScientific nameEnclosure
chatActivityAdd a comment
Current status • timeStatus

Request: white header, detail, animal, Activity, status bar.

arrow_backRecord numbermore_vert
categoryCategory!
ABRequester
monitor_weight
Label
Value
person
Label
Value
M
Animal IDCommon nameScientific nameEnclosure
check_circle
EventDate

Weight record: white header, details, animal, History, no bottom.

arrow_backRecord numbermore_vert
categoryCategory!
ABRequester
badge
Label
Value
event
Label
Value
AB
Name
Detail

Approval: white header, details, person, decision bar.

Rules

  • Header first, bottom last, trail just above the bottom.
  • Leave out what the record does not have: no flag without a priority, no status bar without a status.
  • The white header's middle row names the kind of record (icon and name, such as Weight); its person row is whoever created it. Do not repeat that person in a section.
  • One bottom part only.
  • The status appears once on the page.
← Card partsModule patterns →