iu/ds-galo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 2 Wiki Activity
Files
ebae341c9a799964993497a9e8fc8607593fd841
ds-galo/openspec/changes/mobile-tap-open-and-panel/tasks.md
T
iu ebae341c9a feat(ui): open photo on tap for touch and fix narrow-screen panel 
- Touch/pen tap opens the viewer; mouse click still selects, dblclick opens
- Panel and rail emit a single transform utility so the panel actually
  slides in below 1280px (Tailwind v4 utility ordering made the base
  translate-x-full win over the conditional translate-x-0)
- Add touch-action: manipulation to grid cells
2026-10-11 17:58:04 +03:00

3.8 KiB
Raw Blame History

Tasks

1. Выдвижение панели и рейла на узком экране

  • 1.1 В AppShell.svelte у <aside aria-label="Панель"> убрать постоянный translate-x-full и эмитить единственный класс трансформации: panelOpen ? 'translate-x-0' : 'translate-x-full' (вариант xl:translate-x-0 сохранить). Проверка: при ширине 390px после нажатия «Панель» computed translate равен 0px, aside попадает в пределы вьюпорта.
  • 1.2 Тем же принципом нормализовать <aside aria-label="Альбомы"> (единственный класс вместо постоянного -translate-x-full). Проверка: на 390px кнопка «Альбомы» открывает рейл (computed translate: 0px).
  • 1.3 Проверить отсутствие регрессии на рабочем столе: при ширине >= 1280px обе панели видны статично, разделители ширины работают. Проверка: вьюпорт 1280px — панели видимы, drag разделителя меняет ширину.

2. Открытие фото одним касанием на сенсорных экранах

  • 2.1 В PhotoGrid.svelte фиксировать pointerType на pointerdown ячейки и добавить хелпер активации: для touch/pen вызывать onOpen(i), иначе — onSelect(i, e). Проверка: тап по фото на touch-эмуляции открывает маршрут просмотра; клик мышью выделяет и не открывает.
  • 2.2 Оставить ondblclick -> onOpen для мыши без изменений. Проверка: двойной клик мышью открывает просмотр.
  • 2.3 При сенсорной активации не менять selection, cursorIndex и содержимое панели. Проверка: после тапа selection пуст, номер фото в панели не появляется, происходит переход в просмотр.
  • 2.4 Добавить ячейке touch-action: manipulation, чтобы исключить двойной тап-зум. Проверка: быстрый двойной тап не масштабирует страницу и открывает просмотр.
  • 2.5 Проверить, что клавиатурный Enter открывает фото, а навигация стрелками и ровинг tabindex не изменились. Проверка: Enter на ячейке открывает просмотр; стрелки двигают курсор, ровно одна ячейка tabbable.

3. Интеграционная проверка

  • 3.1 npm run check и npm run build во frontend/ проходят без ошибок. Проверка: обе команды завершаются успешно.
  • 3.2 CDP-прогон на вьюпорте 390x844 с touch: (а) «Панель» выдвигает панель, оверлей закрывает; (б) тап по фото открывает просмотр; (в) мышь-клик по фото выделяет без перехода; (г) «Альбомы» открывает рейл. Проверка: все четыре пункта наблюдаемы.
  • 3.3 Убедиться, что сценарии в openspec/specs/ui-workspace/spec.md синхронизируются при архивации изменения. Проверка: openspec validate "mobile-tap-open-and-panel" --strict проходит; при архивации спека содержит новые сценарии.
Reference in New Issue View Git Blame Copy Permalink