UIKit и повторное сравнение

Сравниваются главные страницы атманки.рф и gheilt.mxsource.xyz в одном Chromium на ширинах 1440, 768 и 390 px. Перед снимками загружаются шрифты, раздел прокручивается к верхней границе, затем выдерживается пауза для ленивых изображений. Состояние каруселей и сторонние виджеты оригинала могут меняться. Это ручная визуальная проверка, а не набор автоматических UI-тестов.

Просмотрщик пар показывает первый экран, новости, программу, события, маршруты и FAQ; на 768 px — первый экран. Измерения.

Что исправлено

• Каскад Mantine переведён на layered CSS: мобильная страница больше не расширяется до 605 px, desktop-меню скрывается, Drawer открывается и закрывается.
• UIKit вынесен в packages/ui. Базовые компоненты Mantine получают общую тему; составные компоненты используют CSS Modules и не импортируют Next.js или CMS.
• Шапка, карусели достижений/логотипов/новостей, обзор фестиваля, подсобытия по дням, расписание, маршруты с картами и FAQ собраны из переиспользуемых блоков.
• На телефонах подсобытия показываются каруселью вместо длинной сетки. На главной восстановлены порядок групп партнёров и различие между обзором фестиваля и отдельными активностями. Карточки активностей ведут в /events.
• Полный текст маршрутов и размещения возвращён из CMS. Вопросы FAQ следуют исходному порядку. Дата показана по-русски; основные действия используют красный цвет.
• Strapi хранит плакат программы и название/описание/фотографию обзора; фотографии загружаются в Garage через upload provider.

Каталог компонентов

Storybook работает на React Webpack5 + SWC; приложение продолжает собираться Next.js. В каталоге есть кнопки и ссылки, типографика, панели, поля ввода, модальные окна, Drawer, уведомления, вкладки, аккордеоны, таблица, пустое состояние и составные блоки.

pnpm --filter @gheilt/ui storybook
pnpm --filter @gheilt/ui build-storybook

Проверены сборка Next, типы, lint/format, 23 теста web, 20 проверок импорта Strapi, статическая сборка Storybook и отображение составных stories. В браузере отдельно проверены меню, модалка, FAQ, карусели и переключение дней. Постоянных UI-тестов и отдельной сборки приложения на Vite нет.

Границы совпадения

Копия ещё не совпадает с оригиналом попиксельно. Отличаются положение стрелок, отступы и кадрирование некоторых изображений, геометрия обзора и вкладок, насыщенность заголовков, размеры текста в маршрутах и высота мобильной навигации. На оригинале есть дополнительные видео/пользовательские виджеты; они здесь не воспроизведены. Страница использует опубликованный импортированный снимок CMS, поэтому текущие изменения оригинала могут появиться только после нового импорта.

По результатам независимого ревью исправлены неверные ссылки событий, загрузка CSS Modules в Storybook, возможность перезаписать редакторские изменения страниц и опубликовать чужие черновики при миграции. Миграция сначала проверяет все документы. Она не имеет общей транзакции; сохраняются отчёт и резервная копия.

Оставлены четыре небольших ограничения: текстовый маршрут без разрешённой карты не попадает в карточки «Как добраться»; пустая карусель достижений сохраняет отступ; страница /ui-kit показывает краткую демонстрацию (полный каталог — Storybook); отрицательный offset стрелок игнорируется браузером и их положение отличается.

При реализации сохранены согласованные решения: базовые компоненты Mantine используются напрямую без дублирующих обёрток; интеграция с Next и Strapi остаётся в адаптерах приложения; маршруты используют существующие Blocks вместо второй копии CMS-модели. Редакторам нужно сохранять структуру заголовков таких страниц.

Независимые ранее существовавшие изменения, снимающие Basic Auth перед Strapi и Hatchet, сохранены отдельным коммитом b3e5dac по явному разрешению пользователя.

Production

Релиз ef9b285 развёрнут GitHub Actions. Проверки, сборка образов и deployment завершились успешно. Обновление 18 документов Strapi прошло без ошибок; повторный dry-run тоже успешен. Резервная копия БД и отчёты доступны администраторам в /opt/gheilt/backups/presentation-20261004T143807Z. Проверка контента: 94 новости, 41 событие, 5 страниц, 15 вопросов и 44 партнёра.

На production проверены открытие/закрытие мобильного меню, FAQ, переключение дня, две карты и HTTP 200 реальной страницы события. robots.txt содержит Disallow: /, metadata — noindex, nofollow. Админки Strapi/Hatchet отвечают HTTP 200 без внешнего Basic Auth; собственная авторизация приложений сохраняется.

Измерения после финального деплоя

В этих снимках нет не загрузившихся изображений. Высота страницы всё ещё различается: отсутствующие видео, размеры текста/карточек и разные адаптивные представления меняют суммарную длину. Совпадение ширины и шапки не означает совпадения всех секций. Сохранено 26 PNG.