- Added NavUser component to the SidebarFooter for user information display. - Refactored SiteHeader by removing unused imports and components related to user account management. - Updated breadcrumbs logic to include a new path for admin apps. - Adjusted SidebarMenuItem formatting for improved readability.
2.5 KiB
2.5 KiB
UI Design Contract — Auth Portal
Surface lock: frame (ReUI Frame). Не смешивать shadcn Card и Frame на ops-экранах.
Эталоны: app-shell-12 · solution-users-1 · solution-users-2 · data-grid-filtering-2 · empty-state-12
Shared App Shell chrome
Эталон: CFDM / EvoBGP + ReUI app-shell-12.
При переключении между portal / CFDM / EvoBGP / vps-tracker меняются только sidebar nav labels/hrefs и main content. Разметка, ширина, фон и hover chrome идентичны.
| Токен / зона | Значение |
|---|---|
--sidebar-width |
240px |
| Sidebar / hover colors | theme --sidebar / --sidebar-accent — без AppShell color-mix override |
| Header | h-12, sticky, border-b, px-4 md:px-6 |
| Header left | SidebarTrigger + Separator + Breadcrumb |
| Header right | AppsMenu (аккаунт — в sidebar footer NavUser) |
| Sidebar footer | NavUser — аватар, имя, email, тема, выход · app-shell-12 |
| Sidebar | AppSwitcher → groups → icons size-4 → пустой SidebarFooter |
main |
gap-4 md:gap-6, px-4 py-4 md:px-6 md:py-5 |
Запрещено в chrome: SidebarRail, NavUser footer, Search pill в header.
Nav groups Auth Portal:
- Портал: Приложения (
/apps) - Админ (только
is_admin): Пользователи (/admin), Ссылки приложений (/admin/apps)
App Switcher (source of truth): portal_settings.app_switcher_json → public GET /api/v1/app-switcher, admin GET/PUT /api/v1/admin/app-switcher. UI: /admin/apps (settings-16). Ids: cfdm · vps · bgp. Consumers (CFDM, vps-tracker) только читают public API.
Spacing
- AppShell main / PageShell:
gap-4 md:gap-6 - No
space-y-*/space-x-*— useflex+gap-* - Max 1 primary CTA per screen
- Semantic tokens only (
Badge/Alertvariants) — no rawbg-emerald-*
Forbidden
- Card as ops list/dashboard shell
- Hand-rolled data tables when ReUI DataGrid exists
- Mixing Card and Frame on the same ops screen