Lists
Stacked lists for people and objects, grid lists for card collections, and feeds for activity timelines. All composition — .list and .feed supply the rhythm, everything else is the existing vocabulary.
Stacked lists
Simple with avatars
-
AR
Alex Rivera
alex@mozcomp.com.au
-
SW
Sam Whitford
sam@mozcomp.com.au
-
JT
Jo Tanaka
jo@mozcomp.com.au
-
PN
Priya Nair
priya@mozcomp.com.au
With badges, button, and actions menu
-
cloud-db-primary
healthyLast run 2 hours ago
-
audit-archive
healthyLast run yesterday
-
portal-uploads
failingFailed 40 minutes ago
In card with links
-
Fault #2231 — toner sensor mismatchin progress
LEVEL2-MFP · assigned to Alex
-
Fault #2230 — offline > 30 minopen
RECEPTION-A4 · unassigned
-
Fault #2229 — tray 3 jamresolved
LEVEL2-MFP · Jo Tanaka
<ul class="list">
<li class="list-row">
<span class="avatar">AR</span>
<div class="min-w-0 flex-1">
<p class="list-row-title">Alex Rivera</p>
<p class="list-row-subtitle">alex@…</p>
</div>
</li>
</ul>
Grid lists
Contact cards
-
AR
Alex Rivera
Administrator
-
SW
Sam Whitford
Operator
-
JT
Jo Tanaka
Operator
-
PN
Priya Nair
Viewer
Horizontal link cards
Feeds
Simple with icons
Deploy #4822 finished
4 minutes ago
Priya Nair joined the site
1 hour ago
Certificate renewal failing
3 hours ago
bms-portal 3.2 released
yesterday
With comments
Alex Rivera assigned fault #2231 to Jo Tanaka
2 hours ago
Jo Tanaka commented
45 minutes ago
Jo Tanaka resolved the fault
just now