- Documented the behavior of `RouteBadge` and `NumericText` after animation changes. - Addressed width issues for numbers `2` and `6` post-animation. - Updated `ResizeObserver` to monitor number badge resizing. - Fixed scaling for short numbers and ensured proper transitions. - Verified functionality across different browser sizes and builds.
2.4 KiB
2.4 KiB
Размер номера после анимации — 9 октября 2026
Браузерный сценарий воспроизведён на настоящих RouteBadge и NumericText, с сохранением компонентов при смене номера. Проверены переходы 21тк → 2, 16тк → 6 и обратные переходы, повторный цикл, неизменный номер 11.
- До исправления после завершения анимации метки
2и6имели ширину 22 px, но сохраняли масштаб0.54023, рассчитанный во время исчезновения предыдущих символов.11имел масштаб 1. ResizeObserverтеперь наблюдает также за меткой номера: сжатие исчезающих разрядов и изменение шрифта повторно запускают вписывание. CSS-transform самой метки не меняет наблюдаемый размер, поэтому расчёт не образует обратную связь.- После исправления короткие
2,6,11используют масштаб 1 при базовом шрифте 35 px. Длинные21тк,16тккорректно уменьшаются до масштаба0.5875в этом контейнере. Повторные смены возвращают ожидаемый масштаб. - Во время смены сохранены анимации
digit-down-inи прокрутка разрядов. Смещение центра метки <0,01 px. Браузерных ошибок и предупреждений нет. - Проверены широкий браузерный вид и узкий 487×664. Production build и TypeScript проходят.
Снимок board-badge-size-fixed.jpg содержит тестовые карточки после перехода на короткие номера. Сценарий воспроизводится через npm exec vite build -- --config artifacts/badge-preview.config.mts и /__visual-badge/artifacts/badge-preview.html. Кнопка переключает длинные и короткие номера; позиции компонентов сохраняются. Обычный production build не включает этот сценарий.