TestingWebApp/docs/СПРИНТЫ_МОБИЛЬНЫЙ_ДИЗАЙН.md

Спринты: мобильный UI кабинета тестов

---

Спринт 1 — быстрые исправления

Цель: выровнять кнопки, мета-строку списка, историю версий, назначение и safe-area; без смены контентной модели страниц.

• 1.1 Панель «Сохранить черновик / К списку»: убрать конфликт inline-actions .btn { width: auto } с btn-primary — колонка на всю ширину (.actions-bar)
• 1.2 Touch: min-height у .btn--sm (убрать, удалить вопрос, сделать активной…)
• 1.3 Список тестов: не разбивать «· v1» — хвост в list-row__meta-tail + white-space: nowrap
• 1.4 «История версий»: вместо <table> — карточки (surface-card + flex)
• 1.5 «Назначение»: не рендерить пустой .assign-list (убрать «коробку» без людей)
• 1.6 Сильнее рамка .btn-ghost (согласование с полями)
• 1.7 padding-bottom у .cabinet-main + env(safe-area-inset-bottom)
• 1.8 «Публикация»: на узком экране — кнопка на всю ширину (.inline-actions--block-mobile)

Файлы: frontend/src/styles/cabinet-theme.css, frontend/src/pages/TestDetail.jsx, frontend/src/pages/TestsList.jsx.

---

Спринт 2 — карточки, импорт, вопрос, радио/чек, фикс-футер

• 2.1 «Прогоны и разбор»: таблица заменена на список карточек (.attempts-card-list)
• 2.2 «Импорт из файла»: скрытый input + label с .btn (.import-file-input / .import-file-label)
• 2.3 «Вопрос N» + «Сгенерировать вопрос (ИИ)»: колонка на мобилке, ряд от min-width: 520px (.question-editor-block__header)
• 2.4 Варианты: type="radio" при одном верном, checkbox при нескольких
• 2.5 Моб. фикс-футер ≤640px с «Сохранить» / «К списку» + статус черновика; панель в потоке скрыта

Файлы: frontend/src/styles/cabinet-theme.css, frontend/src/pages/TestDetail.jsx.

---

Спринт 3 — структура «карточки теста», копи, доводка списка и кабинета

Цель: человекочитаемые названия и группировка разделов; согласованные подсказки и тап-зоны; доводка списка тестов, истории, назначения и редактора по замечаниям.

Страница теста (TestDetail)

• 3.1 AccSection: подзаголовок под заголовком (subtitle + стили cabinet-disclosure__summary-*)
• 3.2 У «тела» аккордеона — верхний внутренний отступ: .cabinet-disclosure__body (контент не «прилипает» к header)
• 3.3 Переименования: «О тесте», «Вопросы» (вместо мета/содержания); подзаголовки-описания по смыслу
• 3.4 Импорт встроен в «Вопросы»: подсекция «Документ в вопросы»; отдельного аккордеона «Импорт из файла» нет
• 3.5 История: одна секция, подпункты «Версии» + «Прохождения»; пустое/ошибочное состояние у прогонов
• 3.6 Ошибка загрузки прогонов: не в герое страницы, а внутри «Прохождения»
• 3.7 Показ в каталоге: подсекция «Видимость» + (при assignmentUi) «Кому выдать»; кнопка видимости не на всю ширину (.publication-visibility__actions)
• 3.8 Панель ИИ-генерации: .test-detail-ai-panel (фон/рамка в духе кабинета, без «лишней» карточки)
• 3.9 Вопрос: блоки .question-editor-block + первый вопрос без лишнего верхнего бордера (.question-editor-block--first)
• 3.10 Варианты: удаление — иконка «закрыть» + aria-label (вместо текста «убрать»)
• 3.11 Одна панель .question-editor__footer: «+ вариант» и «Удалить вопрос»; «+ вопрос» вынесен в .test-detail-add-question над блоком импорта
• 3.12 Назначение: кнопка «Выбрать всех (N)» по текущему отфильтрованному списку; подсказки в подсекциях
• 3.13 Стили подсекций: .test-detail-subsection, .test-detail-subsection__title, .test-detail-hint
• 3.14 Импорт: на мобилке полная ширина кнопки «Выбрать файл» (.import-file-row--block); ровнее отступы у превью
• 3.15 Классы списка версий: на узком экране у .version-card-list__main flex-grow: 0 в column — без пустой «вытянутой» карточки v1

Список тестов и шапка

• 3.16 Список: на ≤640px карточка в колонку (заголовок на ширину экрана, «Пройти» снизу на всю ширину; без пустой полосы)
• 3.17 hover у строк списка — только при @media (hover: hover) and (pointer: fine); лёгкий :active на ссылке (тач-фидбек)
• 3.18 Шапка cabinet-header__inner: учёт safe-area сверху и по бокам
• 3.19 Назначение (кабинет): у .assign-list — выше область прокрутки на мобилке; у строк — линия раздела чуть заметнее; центр чекбокса + line-clamp у мета; accent-color у чекбокса
• 3.20 Ритм аккордеонов на test-detail-page — чуть больше margin между cabinet-brick; нижний отступ у страницы под фикс-футер увеличен
• 3.21 Поле поиска в назначении: более «строчный» вид (min/max height + padding у .assign-toolbar__search)

Файлы: frontend/src/styles/cabinet-theme.css, frontend/src/pages/TestDetail.jsx, frontend/src/pages/TestsList.jsx (только косвенно через стили, разметка списка ранее).

Памятка для пользователей (не-разработчиков), иллюстрации: РУКОВОДСТВО_КАБИНЕТ_ТЕСТОВ.md · images/cabinet-ui/