Files
ridebus-board/artifacts/verification-layout-themes.md
Zakhar Timoshenko f4ea47f2ae feat: add verification layout themes documentation and new components
- Created `verification-layout-themes.md` to document layout and theme verification results.
- Introduced `AlertCard` component for displaying alerts with appropriate icons and metadata.
- Added `RouteCloud` component to manage and display route information dynamically.
- Implemented tests for QR code generation and decoding to ensure functionality across multiple city and platform links.
2026-10-09 02:43:42 +03:00

24 lines
5.6 KiB
Markdown
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# Макет, темы и информационные карточки — 9 октября 2026
Проверено в браузере на production-сборке. Основное табло использовало реальные маршруты и расписание Швейной фабрики. Уведомления проверены отдельно на явно отмеченных тестовых данных: во время проверки активных уведомлений для остановки не было.
- `npm run build`: TypeScript и Vite проходят. `npm test`: 45/45, включая контраст светлых палитр, границы часового ожидания, миграцию настроек и декодирование округлённого QR для трёх разных ссылок.
- 879×593, 6 рейсов: страницы по 3, минимальный промежуток между названием и ожиданием 16 px. Последняя строка заканчивается на y=520, нижняя панель начинается на y=532.
- 855×723, 4 рейса, светлая тема: все четыре видны, промежуток 16 px. Последняя строка y≈649, панель y=662. Фон `rgb(255,255,255)`, акцент `#154a9c`. Разница нижних границ чисел и «ч/мин» — 0 px; шрифт единиц в строках — 18 px. Отступ под ближайшим отправлением ≈18,8 px.
- Центры числовых меток и рамок совпадают: горизонтальная разница 0, вертикальная <0,01 px. Длинные «12тк», «16тк», «29тк» также проверялись при разработке.
- После бездействия ширина управления 0, правая граница статуса совпадает с правой границей панели: x≈829,35 при ширине 855.
- 390×667, 6 рейсов: страницы по три, последний рейс заканчивается на y≈602, панель на y=614. Промежуток между колонками 10 px. Отступ ближайшего отправления 18 px.
- Времена следующего дня проверены на реальном маршруте «29тк» при 1280×900: `08:38 завтра` и `10:23 завтра` показаны однократно, ожидание отдельно в часах/минутах (`board-next-day-times.jpg`).
- 1280×900: три карточки, каждая `clientHeight = scrollHeight = 497`. Маршруты показаны вертикальными карточками, следующий час — 23 px, без подписи «Рейс». При смене названий в DOM есть предыдущий текст и `destination-up-in/out`.
- 879×593 и 1079×591: широкая карточка маршрутов имеет две дорожки с направлениями `normal/reverse`. Минимальный вертикальный зазор после наклона ≈25 px; названия и времена не переполняют своих контейнеров. Время в маленьких дорожках 21 px.
- Погода на 879×593 и 1079×591: текущие условия и почасовой прогноз занимают отдельные заполненные панели. Карточки не имеют внутреннего переполнения. Иконки будущих часов 36 px на коротком экране, 40 px в трёх карточках, до 64 px в широком высоком блоке.
- Погода на 390×667: `clientHeight = scrollHeight = 320`, погодное содержимое помещается. Вертикальные маршруты показываются без горизонтального обрезания.
- Уведомления проверены в обеих темах на 1280×900 и на 390×667: ширина текстового содержимого совпадает с его scrollWidth, исходный текст сохранён. Несколько длинных уведомлений допускают вертикальную прокрутку информационной сцены.
- Браузерных ошибок и предупреждений при итоговой проверке основного табло и примеров уведомлений нет.
Примеры уведомлений воспроизводятся командой `npm exec vite build -- --config artifacts/alert-preview.config.mts`, после чего доступны локально по `/__visual/artifacts/alert-preview.html` и `?theme=light`. Эта сборка отдельная: обычный `npm run build` не включает примеры в табло и удаляет временную папку из dist.
Снимки: `board-dark-879x593.jpg`, `board-light-855x723.jpg`, `board-info-three-cards.jpg`, `board-routes-lanes-1079x591.jpg`, `board-weather-1079x591.jpg`, `board-alerts-dark.jpg`, `board-alerts-light.jpg`.
Физический дисплей и читаемость с конкретного расстояния не проверялись. Docker runtime ранее проверен импортом из изолированной структуры образа; полный Docker build локально не выполнялся из-за недоступного daemon.