Scheduled · in 25 minRecitation · 45 min
Yusuf Ahmed with Ust. Kareem
Family 23:35 CairoTeacher 23:35 IstanbulAcademy 23:35 Cairo
Design system
Foundation v0.1 — approve these before the stage pages are built out.
Color
Brand green
brand-950
#051F20
brand-900
#0B2B26
brand-800
#163832
brand-700
#235347
brand-300
#8EB69B
brand-100
#DAF1DE
brand-50
#EEF7F0
Neutrals
page
#F5F7F6
subtle
#EBEFED
line
#D7DEDA
muted
#6B7A74
secondary
#3C4845
ink
#15201D
Accent and semantic
accent-600
#B85C34
accent-400
#D97A4E
accent-50
#FBEDE6
danger
#B91C1C
info
#1D4ED8
success
#166534
ScheduledCompletedNeeds reviewCancelledPendingApprovedAction requiredNot connectedConnectedRenewal duePausedArchived
Type and time zones
Display 32لوحة الأكاديمية
Page title 24الطلاب
Section 18يحتاج إلى متابعة
Body 14 — tables, formsالنص الأساسي للجداول
09:30 · 1,250.00٠٩:٣٠ · ١٬٢٥٠٫٠٠
Family · Cairo
23:35
Teacher · New York
16:35
Never summed across currencies: EGP 1,200.00USD 40.00
Buttons, focus and locked
Focus ring 2px info blue on every control. Targets ≥44px on mobile; 40px on desktop.
Hidden for your role
Page header · data table
Students
124 active · 9 paused · 3 archived
Search, filters, selection with bulk actions and pagination are live on Students →
Detail header · tabs · notes
Yusuf Ahmed
ActiveAhmed familyTeacher: Ust. KareemBalance: 7 lessonsCairo (UTC+3)
Internal staff note
Father prefers WhatsApp after 20:00 Cairo.
Visible to family
Yusuf completed Surah Al-Layl with excellent tajweed.
Form group · stepper
Age 9 · shown to teacher, not other families
Enter a 10-digit mobile number
Inherited from Ahmed family
Calendar · class card
Cairo
Tue 20 · today
Wed 21
15:00
16:00
17:00
Teacher unavailableConflict
Side panel · ledger
| Date | Entry | Change | Balance |
|---|---|---|---|
| 14 Oct | Lesson completed · #4821 | −1 | 7 |
| 12 Oct | Manual adjustment · “Teacher no-show” | +1 | 8 |
| 1 Oct | Package activated · Recitation 12 | +12 | 12 |
Dialogs (8 variants)
One frame: title + context → inputs → “What will happen” → actions. Destructive confirms are red; closing payroll needs a typed word.
States
Loading
No students yet
Add your first student or import a list from Excel.
Couldn't load students
The connection dropped. Your filters are kept.
Rates are restricted
Your role (Coordinator) can't view teacher rates. Ask an Owner or Finance admin.
Add ?demo=loading, ?demo=empty or ?demo=error to any list page URL to preview its states.