- 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.
24 lines
5.6 KiB
Markdown
24 lines
5.6 KiB
Markdown
# Макет, темы и информационные карточки — 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.
|