feat(ui): добавить новый элемент управления для EvoBGP в AppSwitcher и обновить документацию
Build, Test, and Push CFDM Docker Image / test (push) Successful in 4m10s
Build, Test, and Push CFDM Docker Image / build-and-push (push) Successful in 2m6s
Build, Test, and Push CFDM Docker Image / create-release (push) Skipped
Build, Test, and Push CFDM Docker Image / update-wiki (push) Successful in 6s
Build, Test, and Push CFDM Docker Image / test (push) Successful in 4m10s
Build, Test, and Push CFDM Docker Image / build-and-push (push) Successful in 2m6s
Build, Test, and Push CFDM Docker Image / create-release (push) Skipped
Build, Test, and Push CFDM Docker Image / update-wiki (push) Successful in 6s
Добавлен новый элемент управления для EvoBGP в конфигурацию AppSwitcher с соответствующими иконкой и ярлыком. Обновлены стили и документация для Shared App Shell chrome, включая ссылки на новые превью и улучшения в компоновке. Изменены классы CSS для AppShell и PageShell для лучшей адаптивности.
This commit is contained in:
@@ -158,6 +158,7 @@ Toggle «Доска» / «К каталогу» — всегда `outline` в `p
|
|||||||
|
|
||||||
```
|
```
|
||||||
AppShell main: gap-4 md:gap-6, px-4 md:px-6, py-4 md:py-5
|
AppShell main: gap-4 md:gap-6, px-4 md:px-6, py-4 md:py-5
|
||||||
|
(--sidebar-width: 240px; header h-12; AppSwitcher + AppsMenu — Shared App Shell chrome)
|
||||||
PageShell: gap-4 md:gap-6
|
PageShell: gap-4 md:gap-6
|
||||||
Title/desc: gap-px
|
Title/desc: gap-px
|
||||||
Card/Frame grid: gap-4 (dashboard denser: gap-2 md:gap-3)
|
Card/Frame grid: gap-4 (dashboard denser: gap-2 md:gap-3)
|
||||||
@@ -167,6 +168,8 @@ Toolbar / header actions: gap-2
|
|||||||
Tabs list (line): gap-5
|
Tabs list (line): gap-5
|
||||||
```
|
```
|
||||||
|
|
||||||
|
Shared chrome (vps-tracker / CFDM / EvoBGP): см. [`docs/ui-design-contract.md`](../../docs/ui-design-contract.md) — секция **Shared App Shell chrome**. Preview: [app-shell-12](https://reui.io/preview/base/app-shell-12).
|
||||||
|
|
||||||
**Запрещено:** `space-y-*`, raw colors (`bg-emerald-*`), custom empty divs, page-level Spinner / plain «Загрузка…» без Skeleton.
|
**Запрещено:** `space-y-*`, raw colors (`bg-emerald-*`), custom empty divs, page-level Spinner / plain «Загрузка…» без Skeleton.
|
||||||
|
|
||||||
## UX/UI (состояния данных)
|
## UX/UI (состояния данных)
|
||||||
|
|||||||
@@ -58,6 +58,14 @@ export const DEFAULT_APP_SWITCHER_CONFIG: AppSwitcherConfig = {
|
|||||||
icon: 'cloud',
|
icon: 'cloud',
|
||||||
shortcut: '⌘2',
|
shortcut: '⌘2',
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
id: 'evobgp',
|
||||||
|
name: 'EvoBGP',
|
||||||
|
subtitle: 'BGP маршрутизация',
|
||||||
|
url: 'http://192.168.100.67:3000',
|
||||||
|
icon: 'globe',
|
||||||
|
shortcut: '⌘3',
|
||||||
|
},
|
||||||
],
|
],
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -17,7 +17,7 @@ Ops / list / dashboard / detail / settings — только **Frame**, не shad
|
|||||||
|
|
||||||
| Зона | Block | Preview |
|
| Зона | Block | Preview |
|
||||||
|------|-------|---------|
|
|------|-------|---------|
|
||||||
| Shell | `app-shell-12` (+ cmdk/monitor где нужно) | https://reui.io/preview/base/app-shell-12 |
|
| Shell | `app-shell-12` (+ cmdk/monitor где нужно) | https://reui.io/preview/base/app-shell-12 · https://reui.io/preview/base/app-shell-7 |
|
||||||
| KPI | horizontal compact hybrid (icon left + label/Badge + value ± variant; EvoBGP visual) | https://reui.io/preview/base/stats-12 |
|
| KPI | horizontal compact hybrid (icon left + label/Badge + value ± variant; EvoBGP visual) | https://reui.io/preview/base/stats-12 |
|
||||||
| Dashboard | `dashboard-1` | https://reui.io/preview/base/dashboard-1 |
|
| Dashboard | `dashboard-1` | https://reui.io/preview/base/dashboard-1 |
|
||||||
| Lists | `data-grid-filtering-2` | https://reui.io/preview/base/data-grid-filtering-2 |
|
| Lists | `data-grid-filtering-2` | https://reui.io/preview/base/data-grid-filtering-2 |
|
||||||
@@ -47,9 +47,28 @@ Ops / list / dashboard / detail / settings — только **Frame**, не shad
|
|||||||
|
|
||||||
Gating: DB `show_quick_actions` / `showQuickActions` / `ui_show_quick_actions` (default `true`).
|
Gating: DB `show_quick_actions` / `showQuickActions` / `ui_show_quick_actions` (default `true`).
|
||||||
|
|
||||||
|
## Shared App Shell chrome
|
||||||
|
|
||||||
|
Эталон: CFDM + ReUI [app-shell-12](https://reui.io/preview/base/app-shell-12) · monitor/switchers [app-shell-7](https://reui.io/preview/base/app-shell-7).
|
||||||
|
|
||||||
|
При переключении между vps-tracker / CFDM / EvoBGP меняются **только** sidebar nav и `main` content. ClassNames chrome идентичны.
|
||||||
|
|
||||||
|
| Токен / зона | Значение |
|
||||||
|
|--------------|----------|
|
||||||
|
| `--sidebar-width` | `240px` |
|
||||||
|
| Sidebar accent | primary **14%** mix + transparent border |
|
||||||
|
| Header | `h-12`, `sticky`, `border-b`, `px-4 md:px-6` (без blur / без `h-16`) |
|
||||||
|
| Header right | **AppsMenu** → **SystemMonitorPopover** → **ModeToggle** |
|
||||||
|
| `main` | `gap-4 md:gap-6`, `px-4 py-4 md:px-6 md:py-5` |
|
||||||
|
| Sidebar header | `AppSwitcher` (не static brand) |
|
||||||
|
|
||||||
|
App Switcher ids: `vps-tracker` · `cfdm` · `evobgp`. Override: `VITE_APP_SWITCHER` JSON.
|
||||||
|
|
||||||
|
QuickActionGrid icons: только semantic **text** (`text-info` / `text-primary` / …) на kit `bg-muted` — без solid `bg-primary` fills. Preview: [stats-12](https://reui.io/preview/base/stats-12).
|
||||||
|
|
||||||
## System monitor
|
## System monitor
|
||||||
|
|
||||||
`SystemMonitorPopover` in header next to `ModeToggle`. Preview: https://reui.io/preview/base/app-shell-12
|
`SystemMonitorPopover` in header next to `ModeToggle` (после AppsMenu). Preview: https://reui.io/preview/base/app-shell-12 · https://reui.io/preview/base/app-shell-7
|
||||||
|
|
||||||
## MCP workflow
|
## MCP workflow
|
||||||
|
|
||||||
@@ -63,7 +82,8 @@ Primitives: MCP `plugin-shadcn-shadcn` + `@cfdm/ui`.
|
|||||||
|
|
||||||
## Spacing
|
## Spacing
|
||||||
|
|
||||||
- Main: `gap-4 md:gap-6`, `px-4 md:px-6`
|
- AppShell main: `gap-4 md:gap-6`, `px-4 py-4 md:px-6 md:py-5` (shared chrome)
|
||||||
|
- PageShell / content: `gap-4 md:gap-6`
|
||||||
- No `space-y-*` / `space-x-*` — use `flex` + `gap-*`
|
- No `space-y-*` / `space-x-*` — use `flex` + `gap-*`
|
||||||
- Max 1 primary CTA per screen
|
- Max 1 primary CTA per screen
|
||||||
- Semantic tokens only (`variant="success"|"info"|"warning"`) — no raw `bg-emerald-*`
|
- Semantic tokens only (`variant="success"|"info"|"warning"`) — no raw `bg-emerald-*`
|
||||||
|
|||||||
@@ -24,6 +24,14 @@ const DEFAULT_APP_SWITCHER: AppSwitcherConfig = {
|
|||||||
icon: "cloud",
|
icon: "cloud",
|
||||||
shortcut: "⌘2",
|
shortcut: "⌘2",
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
id: "evobgp",
|
||||||
|
name: "EvoBGP",
|
||||||
|
subtitle: "BGP маршрутизация",
|
||||||
|
url: "http://192.168.100.67:3000",
|
||||||
|
icon: "globe",
|
||||||
|
shortcut: "⌘3",
|
||||||
|
},
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user