guard-home

Summary

The guard's dashboard: who is inside, who is expected, and four big actions.

Raw wireframe

• .context/designs/mobile/home/guard-home.html

Why it is drawn this way

Built for a gate, not a desk. Large counts, large tap targets, no header: the guard tabs set headerShown: false.

Icons are mapped. The guard screens use MaterialIcons, not lucide: person-add → user-plus, people → users, announcement → megaphone, contact-phone → contact.

The count colours use classes the app does not define (text-primary-600, text-warning-600, text-error-600; the mobile Tailwind config extends nothing). Drawn as intended: info, warn, danger.

Related

• guard-visitors
• guard-add-visitor
• guard-notices
• guard-contacts
• role-gate

Sources

• .context/designs/mobile/home/guard-home.html
• apps/mobile/src/app/(roles)/guard/(tabs)/home.tsx
• apps/mobile/src/app/(roles)/guard/(tabs)/_layout.tsx