feat(FN-817): add expand button and swipe-friendly touch behavior for board cards

- Add expand button to TaskCard for opening task detail modal on mobile
- Implement CSS scroll-snap on board columns for swipe-friendly navigation
- Add touch-action and overscroll-behavior styles for smoother mobile scrolling
- Add comprehensive tests for mobile scroll snap behavior and expand button
- Document expand button and swipe-friendly board behavior in README
This commit is contained in:
gsxdsm
2026-04-03 22:40:00 -07:00
parent d67290a7f4
commit 16e8feebd3
5 changed files with 127 additions and 7 deletions

View File

@@ -39,7 +39,7 @@ AI-guided interactive planning for creating well-specified tasks from high-level
- `POST /api/planning/create-task` - Create task from summary (`{ sessionId }`)
### Task Management
- **Kanban Board**: Drag-and-drop task management across columns (Triage, Todo, In Progress, In Review, Done)
- **Kanban Board**: Drag-and-drop task management across columns (Triage, Todo, In Progress, In Review, Done). Each card includes an explicit expand button (↗ icon in the card header) for opening task details — visible on hover for desktop, always visible on mobile. On touch devices, horizontal swipes that start on a card still scroll the board between columns; only quick taps open the task detail modal.
- **Inline Editing**: Quick-edit a task's description directly on the board for Triage and Todo columns. The editor opens as a taller multi-line editing area (4 visible lines) for comfortable editing of longer descriptions, and auto-grows to fit existing content. Double-click a card or use the pencil icon — visible on hover for desktop, always visible on mobile for touch accessibility. Inline editing changes only the description; the title is preserved. To edit both title and description, use the task detail modal.
- **Task Detail Editing**: Edit task title and description directly in the task detail modal. Click the pencil icon in the modal header (available for Triage and Todo tasks) to enter edit mode. Save and Cancel actions appear in the modal footer alongside a keyboard shortcut hint, keeping editing controls consistent with other modal action patterns.
- **List View**: Alternative tabular view for tasks with sorting and filtering. The "Hide Done" toggle hides both Done and Archived tasks for an active-work-only view.