Home/Patterns/Detail tabs

Detail tabs

Five compositions for multi-aspect detail surfaces — student, vehicle, employee, supplier, settlement.

Stable5 compositions
COMPOSITION 01

Student record

5 tabs — Overview · Academics · Fees · Attendance · Medical. Pulse dot on Fees when in arrears.

Use whenA record has multiple separable aspects, each deserving its own surface.
FAR-2026-001

Tariro Moyo

Form 4 Faraday · Full board
[ Overview content ]
COMPOSITION 02

Vehicle record

4 tabs — Profile · Service · Trips · Documents. The Service tab tally shows recent work.

Use whenAsset records with operational, financial, and regulatory aspects.
VHC-ABX-2841

Toyota Hilux · 2022

Diesel · 84,250 km · driver Tendai Nyathi
[ Profile content · VIN, capacity, insurance ]
COMPOSITION 03

Employee record

6 tabs — Profile · Compensation · Time · Leave · Documents · Disciplinary. Hide tabs the operator's role can't see.

Use whenA record that touches many sub-systems with different access policies.
EMP-184

Faith Moyo

Cashier · Park Centre · joined 14 Mar 2024
[ Profile content ]
COMPOSITION 04

Supplier record

4 tabs — Profile · History · Pricing · KYC. KYC pulses red when documents are about to expire.

Use whenA counterparty record with transactional and regulatory aspects.
SUP-2841

Greenline Logistics

Active supplier since Jan 2024 · 184 deliveries
[ Profile content · contacts, terms, payment method ]
COMPOSITION 05

Settlement batch

4 tabs — Summary · Lines · Variance · Documents. The Variance tab badges when unresolved.

Use whenA workflow record with sub-records and reconciliation views.
SH-2841

Shipment to Rand Refinery · 4.20 kg fine

Shipped 02 Jun · expected settlement 8 Jun
[ Summary content · weights, assays, price-on-day ]

Shared rules

Do

Use tabs when each aspect deserves a full surface. Otherwise stack them.

Don't

Hide critical change behind a non-default tab. Pulse the badge.

Do

Reflect the tab in the URL.

Don't

Nest tabs inside tabs.