Show a dashed drop-area in empty kanban columns and the inbox
.kanban__cards:empty (shared by every status column and the sidebar's inbox list) gets a dashed border, transparent background, and a 'Drop cards here' hint, echoing the dashboard's 'Create a project' tile. Pure CSS: both draggables are already always-rendered even when empty, so an empty one is a genuinely childless element and :empty just tracks that -- it steps aside on its own once Sortable inserts a drag-over ghost, and needs no JS empty-state flag. Drops the sidebar's separate 'Nothing in the inbox.' message, now redundant with the box itself. Verified the container really is childless when empty via a DOM dump against a running instance (no screenshot). Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
@@ -78,6 +78,14 @@ project view is currently mounted (`route.name === 'project'`), that project's
|
||||
cards too -- either side of a drag could have been the inbox. A small form
|
||||
under the list adds a card straight to the inbox.
|
||||
|
||||
Empty (no cards) is shown as a subtle dashed drop-area rather than blank
|
||||
space -- `.kanban__cards:empty` in `style.css`, so it's pure CSS keyed off the
|
||||
real DOM child count. Since a card's kanban column/inbox `<draggable>` is
|
||||
always rendered even with nothing in it (see above), that container is
|
||||
genuinely childless when empty, so the rule applies with no extra markup or
|
||||
JS state; it steps aside automatically once Sortable inserts its drag-over
|
||||
ghost. The same rule covers every kanban status column too (below).
|
||||
|
||||
## Project detail
|
||||
|
||||
`/projects/:id` shows one project. It renders on a **full-width** layout (the
|
||||
|
||||
Reference in New Issue
Block a user