1.8 KiB
1.8 KiB
Tasks
1. Эффект наведения на миниатюры нижней ленты
- 1.1 В
Viewer.svelteв блоке «Лента миниатюр» добавить плитке классgroup, а изображению —transition-transform duration-200 group-hover:scale-105 group-focus-visible:scale-105. Проверка: наведение указателя плавно увеличивает картинку внутри плитки, клавиатурный фокус даёт тот же эффект. - 1.2 Убедиться, что раскладка ленты не меняется: плитка остаётся
h-16 w-16, overflow скрывает выход за границы, соседние миниатюры не смещаются. Проверка: при наведении координаты соседних плиток не меняются. - 1.3 Проверить, что выбор миниатюры по клику по-прежнему меняет фото и текущая миниатюра сохраняет
border-primary. Проверка: клик по другой миниатюре переключает просмотр, рамка текущей — primary.
2. Интеграционная проверка
- 2.1
npm run checkиnpm run buildвоfrontend/проходят без ошибок. Проверка: обе команды успешны. - 2.2 CDP-проверка в режиме просмотра: hover на миниатюре даёт ненулевой
scaleна изображении, а раскладка ленты неизменна. Проверка: computedtransform/scaleизображения меняется при наведении,getBoundingClientRectплитки постоянен.