fix(16): restore task-drag-handle for Sortable.js drag-and-drop

Phase 16 executor removed the .task-drag-handle div from TaskCard
during restyling. Sortable.js handle: '.task-drag-handle' had no
matching element → dragging completely non-functional.

Restores the grip element with CSS-token styling (no Tailwind).
This commit is contained in:
Arthur Belleville 2026-05-16 23:58:51 +02:00
parent a10fa46ae2
commit 18a705c812
No known key found for this signature in database
5 changed files with 27 additions and 14 deletions

View file

@ -21,7 +21,7 @@
| 13 | 5/5 | Complete | 2026-05-16 |
| 14 | 1/2 | In Progress| |
| 15 | 3/3 | Complete | 2026-05-16 |
| 16 | Tablo Detail | Restyle tasks, etapes, and files views | DETAIL-01..04 |
| 16 | 4/4 | Complete | 2026-05-16 |
| 17 | Chat & Planning | Restyle discussion and planning pages | CHAT-UI-01, PLAN-UI-01 |
---
@ -111,7 +111,7 @@ Plans:
**Mode:** mvp
**Status:** Pending
**Requirements:** DETAIL-01, DETAIL-02, DETAIL-03, DETAIL-04
**Plans:** 4 plans
**Plans:** 4/4 plans complete
**Success Criteria:**
1. Tablo detail header uses project-card-top layout with title, avatar, and action controls
2. Task kanban uses tasks-section design: section header with add button, task rows with checkbox and meta
@ -121,16 +121,16 @@ Plans:
Plans:
**Wave 1**
- [ ] 16-01-PLAN.md — CSS foundation + icons: append CSS Sections 1925 to app.css; add download + chat icon cases to UIIcon switch
- [x] 16-01-PLAN.md — CSS foundation + icons: append CSS Sections 1925 to app.css; add download + chat icon cases to UIIcon switch
**Wave 2** *(blocked on Wave 1 completion)*
- [ ] 16-02-PLAN.md — Header + tab nav + overview tab: restyle TabloDetailPage header (project-card-top), metadata row, tab nav (design token classes), move desc to overview tab, remove EtapeStrip call from TasksTabFragment
- [x] 16-02-PLAN.md — Header + tab nav + overview tab: restyle TabloDetailPage header (project-card-top), metadata row, tab nav (design token classes), move desc to overview tab, remove EtapeStrip call from TasksTabFragment
**Wave 3** *(blocked on Wave 2 completion)*
- [ ] 16-03-PLAN.md — Kanban + etape grouping: groupTasksByEtape helper, restyled KanbanBoard/Column/TaskCard, EtapeStrip OOB removal, handlers_tasks.go call sites updated
- [x] 16-03-PLAN.md — Kanban + etape grouping: groupTasksByEtape helper, restyled KanbanBoard/Column/TaskCard, EtapeStrip OOB removal, handlers_tasks.go call sites updated
**Wave 4** *(blocked on Wave 3 completion)*
- [ ] 16-04-PLAN.md — Files section: @ui.Table, @ui.EmptyState, FileListRow as tr, FileDeleteConfirmFragment as tr, browser verify checkpoint
- [x] 16-04-PLAN.md — Files section: @ui.Table, @ui.EmptyState, FileListRow as tr, FileDeleteConfirmFragment as tr, browser verify checkpoint
**User-in-loop:** Browser verify checkpoint in Plan 04 — approve visual result before considering the phase complete.

View file

@ -3,8 +3,8 @@ gsd_state_version: 1.0
milestone: v3.0
milestone_name: Design System & Visual Polish
status: executing
last_updated: "2026-05-16T21:30:26.245Z"
last_activity: 2026-05-16 -- Phase 16 planning complete
last_updated: "2026-05-16T21:30:58.783Z"
last_activity: 2026-05-16 -- Phase 16 execution started
progress:
total_phases: 5
completed_phases: 3
@ -24,14 +24,14 @@ progress:
See: `.planning/PROJECT.md` (updated 2026-05-16)
**Core value:** A user can sign in and run the Tablos workflow — organize work, attach files, discuss, and plan scheduled events — without a JS framework or managed chat provider.
**Current focus:** Phase 15 — dashboard-tablos
**Current focus:** Phase 16 — tablo-detail
## Current Position
Phase: 15 (dashboard-tablos) — EXECUTING
Plan: 1 of 3
Status: Ready to execute
Last activity: 2026-05-16 -- Phase 16 planning complete
Phase: 16 (tablo-detail) — EXECUTING
Plan: 1 of 4
Status: Executing Phase 16
Last activity: 2026-05-16 -- Phase 16 execution started
## Previous Milestone Status

View file

@ -28,7 +28,7 @@
"skip_discuss": false,
"code_review": true,
"code_review_depth": "standard",
"_auto_chain_active": false
"_auto_chain_active": true
},
"hooks": {
"context_warnings": true

View file

@ -487,6 +487,18 @@
flex-direction: column;
}
.task-drag-handle {
color: var(--color-text-faint);
cursor: grab;
flex-shrink: 0;
line-height: 1;
user-select: none;
}
.task-drag-handle:active {
cursor: grabbing;
}
.task-row {
align-items: center;
border-bottom: 1px solid var(--color-border-muted);

View file

@ -220,6 +220,7 @@ templ TaskCard(tabloID uuid.UUID, task sqlc.Task, csrfToken string) {
role="button"
aria-label={ "Edit task: " + task.Title }
>
<div class="task-drag-handle" aria-hidden="true">⠿</div>
<div class="task-check" role="checkbox" aria-checked="false"></div>
<div class="task-body">
<p>{ task.Title }</p>