# Карта приложений (forbion.f7cloud.ru) Рабочая карта UI каждого приложения на боевом forbion — **источник, по которому фич-роли сверяют и строят нативный мобильный клиент**. Составляется наблюдением живого сервера (аккаунт `cloude`), **строго read-only** — ничего не создавать/не менять/не удалять, почту не отправлять (см. mail/073). > ‼️ **ТОЛЬКО МОБИЛЬНАЯ ВЕРСИЯ САЙТА.** Карта строится по мобильной вёрстке forbion (узкий > вьюпорт ~390–420px: браузер в device-режиме, реальный телефон или эмулятор), НЕ по > десктопной — они принципиально разные, наш клиент повторяет мобильную. Признак мобильной > версии: снизу плавающая панель + шторка приложений по «трём полоскам» (как в `_mobile-*.css`), > а не десктопный сайдбар. Десктопный layout в карте недопустим. ## Источники кода (стили + кнопки окон) На боевом forbion приложения стоят **скомпилированными** — читаемого `src/` там нет (кроме `f7mail`). Поэтому «в коде найти стили и кнопки» = три локальных источника (прод-SSH для этого не нужен): 1. **Стили + карта элементов окна** — тема forbion, локально: `/root/claude/design-reference/forbion-theme/` (мобильные `css/pages/pages-mobile/_mobile-*.css` и `css/pages/app-/`). Селекторы в этих CSS **перечисляют каждую кнопку/элемент окна** (тема их адресует для стилизации) — это и есть стили + список элементов по окнам. 2. **Читаемые компоненты (реальные кнопки/меню/обработчики)** — апстрим-исходник под ТОЧНУЮ версию, установленную на forbion: | Приложение | Репозиторий / источник | Версия на forbion | |---|---|---| | files | nextcloud/server → `apps/files/src` | 2.4.0 (или тема+web) | | mail | **локально `design-reference/forbion-apps/f7mail/src`** (форк F7) + nextcloud/mail | f7mail 0.2.3 / mail 5.7.15 | | calendar | nextcloud/calendar | v6.4.0 | | contacts | nextcloud/contacts | v8.3.10 | | deck | nextcloud/deck | v1.16.4 | | notes | nextcloud/notes | v5.0.0 | | notifications | nextcloud/notifications | 5.0.0-dev.0 (ближайший тег/master) | | tasks | nextcloud/tasks | v0.17.1 | | talk (conf) | форк F7 `vendor/talk-android` + nextcloud/spreed | v22.0.12 | Рецепт (свой app+версия): `git clone --depth 1 --branch <тег> --filter=blob:none \ https://github.com/nextcloud/.git`, читать `src/` (`*.vue`). 3. **Иконки/шаблоны/скомпилированный css** всех приложений — локально `/root/claude/design-reference/forbion-apps//` (снято с forbion read-only). Связка: тема (мобильные стили + селекторы окна) ↔ апстрим `src` (какая кнопка что делает) ↔ живой мобильный web (как это выглядит) → полная карта. ## Где что лежит Одна карта на приложение: `docs/app-map/.md`. Владелец карты = фич-роль модуля. Коммитит в свой файл автором `b-mob-`, обычным ритуалом (`git pull --rebase` → правка). | Файл | Роль | Приложение | |---|---|---| | `shell.md` | b-dev-mobile | Оболочка: нижняя панель, шторка приложений, бургер | | `files.md` | b-mob-files | Файлы | | `mail.md` | b-mob-mail | Почта (вход `cloude@forbion.ru`) | | `talk.md` | b-mob-conf | Конференции | | `tasks.md` | b-mob-tasks | Задачи | | `notes.md` | b-mob-notes | Заметки | | `notifications.md` | b-mob-notify | Уведомления (лента) | | `deck.md` | b-mob-deck | Карточки | | `calendar.md` | b-mob-calendar | Календарь | | `contacts.md` | b-mob-contacts | Контакты | ## Формат (единый для всех) Карта — это **дерево переходов**: экран → его кнопки/пункты → куда каждая ведёт → экран с кнопками, и так вглубь. Для каждого экрана: ```markdown # Карта: <Приложение> ## Вход Как попадаем: нижняя панель / шторка / пункт меню — что именно нажать. ## Экран: <Название экрана> **Шапка:** <кнопка → действие/экран>, <кнопка → …> **Тело:** что показывается (список/сетка/форма/пусто-состояние). **Действия:** - «<Кнопка/пункт>» → <что делает: открывает экран X / диалог Y / выполняет действие Z> - (если ведёт в подэкран — раскрыть его тем же блоком: Шапка/Тело/Действия) - «<⋯ / long-press / контекстное меню>» → пункты: «A» → …, «B» → … - «<+ / FAB / создать>» → форма «<Название>»: поля <перечислить>, кнопки <Сохранить/Отмена> ## Экран: <Следующий> … ``` Правила: - Пиши ЧТО видит пользователь и КУДА ведёт — без реализации/CSS-классов. - Каждую кнопку/иконку — отдельной строкой с назначением. Если назначение неочевидно — пометь `(?)` и опиши гипотезу. - Модалки/шиты/выпадающие меню — тоже экраны, раскрывай их. - Отмечай, где мобильная веб-версия отличается от того, что уже есть в нативном клиенте (`расхождение:` …) — это сразу твой бэклог на добивку. - Пустые состояния и состояния ошибки — фиксируй (это отдельные экраны в дизайне). Готовую карту используем как чек-лист: сверка вёрстки и функционала нативного экрана идёт по этому дереву.