Mobile UI sprint 1: actions-bar, version cards, meta line, safe area

- Add docs/СПРИНТЫ_МОБИЛЬНЫЙ_ДИЗАЙН.md and DOC/ШАГИ/ШАГ_2026-04-27_002.md
- cabinet-theme: .actions-bar, .version-card-list, .list-row__meta-tail,
  .inline-actions--block-mobile, btn--sm/ghost tweaks, safe-area main padding
- TestDetail: replace version table with cards; command panel uses actions-bar;
  assign list only when there are people; publication full-width on narrow
- TestsList: version suffix in non-breaking tail span

Made-with: Cursor
This commit is contained in:
Константин Лебединский
2026-04-27 19:35:08 +05:00
parent 2a05f41b65
commit 5db12c2348
5 changed files with 244 additions and 89 deletions
@@ -0,0 +1,40 @@
# Спринты: мобильный UI кабинета тестов
Рядом с: [`ПРЕДЛОЖЕНИЕ_ДИЗАЙН_СОЗДАНИЕ_ТЕСТА.md`](./ПРЕДЛОЖЕНИЕ_ДИЗАЙН_СОЗДАНИЕ_ТЕСТА.md).
---
## Спринт 1 — быстрые исправления (текущий)
**Цель:** выровнять кнопки, мета-строку списка, историю версий, назначение и safe-area; без смены контентной модели страниц.
| # | Задача | Статус |
|---|--------|--------|
| 1.1 | Панель «Сохранить черновик / К списку»: убрать конфликт `inline-actions .btn { width: auto }` с `btn-primary` — колонка на всю ширину (`.actions-bar`) | done |
| 1.2 | Touch: `min-height` у `.btn--sm` (убрать, удалить вопрос, сделать активной…) | done |
| 1.3 | Список тестов: не разбивать «· v1» — хвост в `list-row__meta-tail` + `white-space: nowrap` | done |
| 1.4 | «История версий»: вместо `<table>` — карточки (`surface-card` + flex) | done |
| 1.5 | «Назначение»: не рендерить пустой `.assign-list` (убрать «коробку» без людей) | done |
| 1.6 | Сильнее рамка `.btn-ghost` (согласование с полями) | done |
| 1.7 | `padding-bottom` у `.cabinet-main` + `env(safe-area-inset-bottom)` | done |
| 1.8 | «Публикация»: на узком экране — кнопка на всю ширину (`.inline-actions--block-mobile`) | done |
**Файлы:** `frontend/src/styles/cabinet-theme.css`, `frontend/src/pages/TestDetail.jsx`, `frontend/src/pages/TestsList.jsx`.
---
## Спринт 2 — бэклог (следующий)
| # | Задача |
|---|--------|
| 2.1 | «Прогоны и разбор»: на мобилке заменить таблицу на карточки или гориз. скролл с фиксированными колонками |
| 2.2 | «Импорт из файла»: кастомная кнопка (скрытый `input` + стилизованный `label` под `.btn`) |
| 2.3 | «Вопрос 1» + «Сгенерировать вопрос (ИИ)» — не в одной строке на узком экране; явная иерархия primary/secondary |
| 2.4 | Радио vs чекбокс у вариантов ответа при «несколько верных» — визуальная метафора (квадраты vs круги) |
| 2.5 | Закреплённый футер с действиями «Сохранить» (опционально) |
---
## Спринт 3 — дизайн-токены (по желанию)
Единая шкала: `--control-height`, `--control-padding-x`, `--button-gap` — рефакторинг всех `inline-actions` и форм.